Un Lottie es un formato de datos de animación basado en JSON que puede utilizarse tan fácilmente como los activos estáticos en cualquier plataforma. Son archivos compactos que pueden escalar hacia arriba y hacia abajo sin pixelación y funcionan en cualquier dispositivo. Lo mejor de todo es que las animaciones Lottie no requieren conocimientos de codificación.
Contenido
¿Cómo puede Lottie Animation hacer su vida más fácil?
Las Lottie pueden utilizarse en casi cualquier plataforma, incluyendo la web y el móvil. Como resultado, puedes incorporarlos de forma sencilla tanto a las apps como a los sitios online.
Las animaciones Lottie también pueden utilizarse como pegatinas de la plataforma de chat. Los archivos JSON son compactos en lugar de los archivos GIF y PNG; por lo tanto, el uso de un archivo Lottie aumenta la velocidad de descarga y minimiza el uso de espacio en el disco.
Puede mezclar componentes vectoriales y rasterizados con Lottie y, en tiempo de ejecución, aplicar transformaciones. La realización de animaciones y la utilización de animaciones Lottie en ITG.digital le ayudarán a comprender mejor.
Los archivos Lottie se utilizan en emocionantes animaciones en la mayoría de las páginas de aterrizaje del sitio web.
¿Cuál es la mejor manera de hacer Animaciones Lottie?
Diseño (Paso 1)
Lo primero y más importante es completar y preparar el diseño de la animación. Me viene a la mente una ilustración de una chica con un perro. Tienes que ajustar la postura para acomodar el fuerte suspiro de la chica y el golpeteo de sus pies. Después de cambiar la postura, esboza diferentes alternativas de textura para el vestido de la chica.
Si decides animar utilizando texturas, debes tener en cuenta lo siguiente:
Es preferible utilizar texturas vectoriales porque el archivo resultante será más corto.
Por favor, recuerde cuando esboce la textura que cuantos más puntos y piezas menores tenga, más sencillo será animarlo. También puede reducir el tamaño del archivo de animación completado manteniendo la textura mínima.
Si es posible, evite utilizar máscaras en la animación; de lo contrario, pueden surgir problemas en algunos navegadores.
Animar (Paso 2)
La animación es la siguiente fase. Tendrás que animar algunos dibujos y transformarlos a JSON para crear un archivo Lottie.
Mantener las cosas simples es el consejo más matizado que puedes recibir para esa fase. En lugar de utilizar efectos, anima las propiedades principales de la capa: posición, rotación, escala y opacidad. La animación de la ruta también será impecable.
Sus animaciones pueden reproducirse o reproducirse una vez al integrarlas.
Asegúrate de que tu animación tiene un bucle impecable antes de exportarla desde After Effects si quieres un bucle perfecto en el sitio web/la aplicación.
Exportar animaciones (Paso 3)
Es el momento de publicar las animaciones una vez que las hayas terminado.
1. Inicie Bodymovin y busque la composición que desea producir.
2. Realiza los ajustes de los parámetros.
3. Haz clic en renderizar y ya está.
4. Comprueba tu animación en la página web de Lottie files o en Bodymovin.
5. Haga clic en "demo" en el renderizado si quiere mostrar su animación a alguien que no esté familiarizado con Lottie.
Conclusión
Consiga las animaciones finales exactamente como las quiere con Lottie Animation. En comparación con las animaciones de JavaScript, la animación en After Effects es más accesible y versátil. Podrás ser más imaginativo en el proceso de diseño después de conocer Lottie Animation en sitios web de confianza como Seahawk Media.
