Prototipar con video y animaciones es posible con Lottie y Adobe XD

En Adobe MAX 2021 presentamos las actualizaciones de Adobe XD, esta vez la compatibilidad con los videos y animaciones Lottie nos enorgullece porque te permitirá prototipar tus ideas deslumbrantes.

Prototipar ahora es más fácil con Adobe XD y Lottie

Antes de empezar, recuerda que puedes tener las nuevas funciones, actualizando XD en la aplicación Creative Cloud o probando Adobe XD de forma gratuita si aún no lo tienes.

A veces prototipar es lo único que hace falta para que tu idea se vendan. Comunica tu visión, consigue que las partes interesadas se alineen y ayuda a los equipos de desarrollo a entender mejor cómo deben implementarse tus diseños. Un buen prototipo vale más que mil reuniones, y con las herramientas adecuadas, puedes ahorrar mucho tiempo.

Además, como sabemos, el movimiento puede ser útil para comunicar y atraer; desde divertidas animaciones hasta videos con historias. El problema es que la mayoría de las herramientas de diseño UI/UX se quedan cortas cuando se trata de movimiento. Los diseñadores a menudo tienen que "fingir" los detalles (como utilizar imágenes fijas) para representar el movimiento.

Para evitar ese retroceso de diseño-animación-edición llega la compatibilidad con el video y Lottie en XD, puedes incorporar movimiento en una fase temprana del proceso creativo y crear prototipos con el aspecto y la sensación de los sitios web y las apps reales, todo ello sin la necesidad de hacer más trabajo. La capacidad de utilizar video y animaciones en los prototipos de XD fue la función más solicitada en la Adobe XD UserVoice y estamos encantados de ofrecértela.

Cómo añadir videos y animaciones Lottie a los prototipos XD

Al diseñar en XD, ahora podrás agregar videos y animaciones de Lottie en tus diseños y estos se reproducirán cuando previsualices tus prototipos en XD y cuando compartas un enlace a tu prototipo desde XD. Arrastra y suelta los archivos desde tu ordenador directamente en el lienzo de diseño o importa los videos desde las Bibliotecas Creative Cloud. Una vez importados, puedes personalizar el comportamiento de los medios, como establecer que las animaciones se reproduzcan en bucle o configurar cuándo se reproducirá un video o una animación (automáticamente, al tocarlo, etc.). En el caso de los videos, también puedes utilizar sencillas herramientas de edición para recortar el video a la longitud deseada y cargar imágenes en miniatura personalizadas.

Plugin LottieFiles para Adobe XD

Junto con el lanzamiento de hoy, también te queremos mostrar el nuevo plugin XD - LottieFiles para Adobe XD - para ayudarte a descubrir animaciones Lottie que puedes utilizar en sus diseños. LottieFiles ofrece la mayor colección del mundo de animaciones. Además, cualquier animación Lottie creada en After Effects y compartida con el plugin LottieFiles para After Effects también está disponible en el plugin LottieFiles para Adobe XD.

Actualizaciones para prototipar en Adobe XD

Además de la compatibilidad con video y Lottie, estamos introduciendo algunas otras actualizaciones interesantes en XD:

• Compartir en Behance. Desde el modo Compartir en XD, ahora puedes llevar prototipos directamente a Behance para mostrar tu trabajo y obtener comentarios de la mayor red creativa del mundo.
• Organizar activos. Ahora puedes agrupar colores, estilos de texto, componentes y otros activos en tu panel de Bibliotecas para organizar y estructurar sistemas de marca y diseño.
• Mejorar la exportación. Hemos realizado algunas actualizaciones y optimizaciones para mejorar la calidad de la exportación y darte más flexibilidad y control al exportar imágenes desde XD.

Estamos increíblemente entusiasmados con las posibilidades en tus prototipos XD que te da el movimiento de la animación y el video. Recuerda que también tienes otras potentes herramientas de prototipado XD como Auto-Animate, Scroll Groups y Voice Prototyping. Si buscas inspiración, suscríbete al canal de Howard en YouTube, síguelo en Twitter, o sintoniza una próxima transmisión de Adobe Live para verlo en acción.

También te puede interesar: 6 complementos de Adobe XD para prototipar