¿Qué es un archivo Lottie y cómo funciona?

Abre un Lottie en un editor de texto y no verás píxeles. Verás llaves, comas y una lista de objetos con nombres cortos. Esa es la primera sorpresa del formato y también la clave para entender qué es un archivo Lottie y cómo funciona lejos del programa que lo creó.

Nació como una exportación del complemento Bodymovin, pensada para llevar animaciones de un editor de composición a la web sin convertir el diseño en vídeo. El archivo no guarda una película: guarda las instrucciones para dibujarla.

Un archivo de texto que describe movimiento

Por debajo hay JSON, un formato de texto con estructura de objetos y listas. Cada capa, cada trazado, cada relleno y cada keyframe ocupa su propio objeto dentro del archivo.

Eso tiene una consecuencia inmediata: el archivo es legible. Puedes abrirlo, buscar un color concreto y encontrarlo. No hay que descifrar un flujo binario para saber qué contiene.

Los campos que no pueden faltar

La estructura mínima incluye el campo de versión (v), la velocidad de fotogramas (fr), el fotograma de entrada (ip), el de salida (op), el ancho y el alto (w, h) y la lista de capas. Sin esos datos el reproductor no sabe cuánto dura la animación ni qué tamaño tiene.

La duración no se expresa en segundos, sino en fotogramas. Con fr = 60, ip = 0 y op = 120, la animación dura 120 ÷ 60 = 2 segundos. Con fr = 30 y op = 90, dura 90 ÷ 30 = 3 segundos. Cambiar la velocidad de fotogramas sin tocar los puntos de entrada y salida cambia la duración.

El tamaño merece otra aclaración. w = 1920 y h = 1080 definen 2.073.600 unidades de referencia, no un búfer de píxeles. El archivo describe un espacio de dibujo, y la pantalla decide cuántos píxeles le corresponden.

Por qué se puede comparar línea a línea

Como el contenido es texto estructurado, dos versiones del mismo Lottie se pueden comparar con la misma herramienta que se usa para el código. Un cambio de posición aparece como un número distinto; un color nuevo, como tres valores nuevos; una capa eliminada, como un bloque que desaparece.

En un equipo eso ahorra discusiones. La revisión deja de ser una conversación sobre lo que parece que cambió y pasa a ser una lista de líneas modificadas.

La misma propiedad explica lo demás: si el archivo guarda geometría en lugar de píxeles, un solo archivo sirve para cualquier tamaño de pantalla. No hay rejilla que se quede corta cuando el contenedor crece.

El easing viaja dentro

Un detalle que sorprende al abrir el JSON es que la curva de velocidad también está escrita. Cada tramo entre dos keyframes lleva sus manejadores Bézier de entrada y salida, además de una marca de retención que congela el valor hasta el keyframe siguiente.

Para quien viene del vídeo, esto es una diferencia de fondo. En un vídeo la interpolación ya está fijada en los fotogramas; en un Lottie la curva sigue siendo un dato que el reproductor aplica al vuelo, y por eso el archivo puede ocupar tan poco aunque el movimiento dure.

Existe además un envoltorio llamado dotLottie, con extensión .lottie, que empaqueta una o varias animaciones y sus recursos en un contenedor comprimido. Es cómodo para distribuir, pero el contenido sigue siendo el mismo JSON por dentro.

Lo que un Lottie no lleva

No lleva audio, ni vídeo, ni escenas 3D. Tampoco es un reproductor universal que se abra en cualquier sitio: necesita una biblioteca que interprete el JSON y dibuje en pantalla.

La otra limitación aparece al exportar desde un editor. No todos los efectos sobreviven a la traducción, y las expresiones suelen ser lo primero que se pierde, porque son código que el reproductor tendría que ejecutar. Las máscaras, las capas de forma y los animadores de texto son el terreno donde el formato se siente cómodo.

Dónde importarlo y exportarlo

El editor de motion graphics y VFX trabaja con Lottie en las dos direcciones y guarda los proyectos en el formato propio .ecproj. Ese archivo nativo guarda el proyecto del editor, no la entrega, así que conviene conservarlo antes de generar el Lottie definitivo.

Para decidir cuándo conviene este formato y cuándo no, la comparación entre Lottie, GIF y MP4 plantea los criterios prácticos. Y si la duda está en cómo se construye el movimiento que luego se empaqueta, la guía sobre qué son los keyframes explica el mecanismo que el JSON solo describe.

Un Lottie no es un vídeo pequeño, es una receta. Y como toda receta, su valor está en que otro pueda ejecutarla.