Animación

Motion UI: Microinteracciones en Lottie

Optimización de animaciones vectoriales en formato JSON para las instancias del software. Pipeline colaborativo desde Illustrator hasta código interactivo.

LottieAfter EffectsBodymovinIllustratorOverlord

Microinteracciones en Lottie: Celebraciones del Sistema

Creación y optimización de un sistema de animaciones vectoriales para conmemorar festividades dentro de la plataforma. El proyecto transformó composiciones complejas en archivos JSON ultra-ligeros, integrándose directamente en diferentes instancias del software sin penalizar el rendimiento ni el consumo de memoria.

Componentes Interactivos (En Vivo)

Variaciones de las animaciones estacionales ejecutándose en tiempo real en la web:

Flujo de Trabajo y Sinergia Técnica

  • Diseño e Implementación: Trabajo en estrecha colaboración con el equipo de diseñadores para la conceptualización de los assets y con el equipo de ingeniería de implementación para asegurar el correcto renderizado y comportamiento de los JSON en las instancias del software.
  • Pipeline Vectorial: Estructuración de recursos geométricos limpios en Illustrator y transferencia nativa a After Effects mediante Overlord, manteniendo las formas puras para evitar la rasterización.
  • Optimización y Animación: Diseño de dinámicas fluidas (rebotes, aceleraciones y partículas) enfocado en las restricciones técnicas del motor web, logrando una tasa de cuadros estable y fluida.
  • Exportación de Código (Bodymovin): Traducción matemática de las líneas de tiempo en código JSON puro, reduciendo el peso de los assets en más de un 80% en comparación con formatos de video o GIFs tradicionales.

Entorno de Producción

Captura de pantalla que muestra el resultado final y el comportamiento visual de la animación integrada directamente en la interfaz del software.