Lottie sin efectos posteriores

Lottie Who?

El proceso de creación de movimiento para dispositivos móviles se vio interrumpido hasta que Airbnb lanzó una impresionante biblioteca de código abierto llamada Lottie. Antes de eso (febrero de 2017), la creación de animaciones móviles complejas requería un arduo intercambio entre diseñadores y desarrolladores.
 
Los diseñadores crearían prototipos para desarrolladores que tendrían que recrearlos a mano en varios idiomas (una vez para Android y otra para iOS), o elegir incrustar GIF grandes o sprites de imágenes sin escala. Pero Lottie cambió todo eso, generando animaciones intrincadas y escalables para iOS y Android con la facilidad de incluir una imagen estática. Swiftkey, por ejemplo, cambió una secuencia .png de 6mb de tamaño por un Lottie .json de solo 340kb. La fidelidad impecable y los ahorros de descarga tienen un enorme impacto en la experiencia del usuario.

Crédito de imagen: http://airbnb.io/lottie/

Es un gran problema tener este poder, y muchos diseñadores están programando tiempo fuera de sus fines de semana para aprender la nueva cadena de herramientas. Pero es sorprendentemente complejo.

La confianza de Lottie en After Effects

Lottie confía en Adobe After Effects (AE) como su herramienta de creación de animación. La brillantez de AE ​​es innegable: es el estándar de la industria para animar títulos, introducciones y transiciones de películas cinematográficas. Pero con el poder viene un laberinto de complejidad (muchas características no son compatibles con Lottie y la animación de la interfaz de usuario en general). Las capacidades de AE ​​hacen que no sea trivial aprender, y lamentablemente la curva empinada pone a Lottie fuera del alcance de muchos diseñadores.
 
Como imaginamos el conjunto ideal de herramientas para el diseño de movimiento de la interfaz de usuario, no podemos evitar preguntarnos si AE es realmente el compañero adecuado para Lottie. Después de todo, el uso de AE ​​para el diseño de movimiento de la IU está más allá de su alcance original. La situación se siente análoga a 2005, cuando los diseñadores confiaban mucho en Photoshop como herramienta de diseño de interfaz de usuario, no porque se hiciera para el tipo de trabajo, sino porque no había nada mejor en el mercado. Luego llegó Sketch, una herramienta con un enfoque de diseño de interfaz de usuario puro.
 
¿Qué pasaría si hubiera un "After Effects" destinado al diseño de interacción y movimiento de la aplicación?

Una nueva forma de Lottie

Diseñamos Haiku desde cero para animar los componentes de la interfaz de usuario. Al igual que Sketch, es una herramienta simple con un propósito específico, y como AE, es compatible con Lottie.
 
Nuestros usuarios dicen que es más intuitivo animar y, en general, mucho más fácil de poner en marcha que AE. No es necesario que descargue e instale complementos especiales de terceros para Sketch y After Effects, luego aprenda a animar usando el subconjunto de funciones compatibles. Simplemente crea animaciones en Haiku y publica.
 
Después de publicar, puede elegir usar Lottie como su reproductor (para aplicaciones nativas) o usar nuestro propio reproductor (solo web por ahora) donde sus animaciones pueden responder a la interacción del usuario.

Además de eso, tenemos algo bajo la manga que llamamos Live Design. Imagine hacer un cambio en su herramienta de dibujo (Sketch) y ver que se actualiza instantáneamente en Haiku, la base de código de su aplicación y en todas las plataformas de producción a las que se dirige. Esa sería realmente una conexión sin precedentes para los equipos de diseño y desarrollo: la columna vertebral de un sistema de diseño conectado.
 
Recientemente se ha hablado mucho sobre las herramientas de diseño que implementan "administradores de sistemas de diseño" cuando en realidad son meras imágenes estáticas de sistemas de diseño. Creemos que hay una mejor manera de avanzar: que un sistema de diseño debería ser un conjunto vivo de componentes. Con Haiku puede ser solo eso, y es una gran diferencia. Pronto lanzaremos Live Design en la aplicación. Hasta entonces, aquí hay un avance rápido de cuán satisfactorio se siente este flujo de trabajo de cambio de paradigma.

Divulgación completa: Haiku se encuentra actualmente en una vista previa privada y todavía hay algunas cosas que puede hacer en After Effects que aún no puede hacer en Haiku, como la transformación de formas y las máscaras. Estas son características importantes y estamos trabajando para incorporarlas a la aplicación lo antes posible. Dicho esto, Haiku ya tiene muchas características que AE no tiene (diseño en vivo, interacciones, eventos, estados). Esperamos que nuestra visión de empoderar a los diseñadores lo inspire a probar nuestra beta privada.

Regístrese y vea lo que los usuarios están creando en www.haiku.ai.