LottieFiles

+

Figma

Figma a Lottie:
Da movimiento a Figma

Convierta fácilmente sus diseños o prototipos en animaciones Lottie listas para producción con la función Figma a Lottie. Utilice LottieFiles para el modo de desarrollo de Figma para obtener códigos de inserción y enlaces de activos directamente dentro de la herramienta y entregar archivos sin problemas.

Exporta tus diseños de Figma como animaciones Lottie y úsalos en tus sitios web o aplicaciones. Obtén acceso instantáneo a la mayor biblioteca de animaciones Lottie del mundo dentro de Figma.

Animaciones listas para producción en Figma

Crear animaciones Lottie listas para producción

La función de Figma a Lottie te permite crear animaciones cautivadoras dentro de Figma sin esfuerzo y exportarlas como Lottie. Elige entre usar preajustes animados o conectar múltiples fotogramas para crear tus animaciones.

AI Prompt to Vector
AI Prompt to Vector

AI Prompt to Vector

Convierte los textos en solicitudes personalizadas de SVG, evitando la búsqueda de activos perfectos. Disfruta del agrupamiento y nombrado de capas con inteligencia artificial para mantener tus diseños limpios y organizados.

🎉 Nuevo

Raster to Vector
Raster to Vector

Raster a Vector

Convierte imágenes de mapa de bits como PNG y JPG a vectores totalmente editables, diciendo adiós al trazado manual. Úsalos en tus diseños de inmediato, o después de animarlos con Figma a Lottie.

🎉 Nuevo

Download animations directly to your device
Download animations directly to your device

Descarga animaciones directamente a tu dispositivo

Descargue animaciones como DotLottie/Lottie JSON optimizados, DotLottie o Lottie JSON directamente a su dispositivo. También puede exportarlos como GIF, MP4, WebM o MOV en varios tamaños.

🎉 Nuevo

Premium animations
Premium animations

Animaciones premium

Acceda a más de 400.000 animaciones premium exclusivas y completamente personalizables dentro de Figma para crear productos impresionantes que a sus usuarios les encantarán.

Search Lottie animations
Search Lottie animations

Animaciones para cualquier industria y caso de uso imaginable

Busca más de 100,000 animaciones Lottie gratuitas y listas para usar desde nuestro complemento de Figma. Todas las animaciones se pueden utilizar para uso personal y comercial.

Diseñar prototipos igual que productos finales

Agrega animaciones Lottie a tus prototipos de Figma y presenta la versión más realista y atractiva de tus diseños a tus partes interesadas. Comunícate de manera efectiva con el movimiento y elimina la incertidumbre.

Lottie Stickers for FigJam
Lottie Stickers for FigJam

Lottie Pegatinas para FigJam

Haz que tus sesiones de lluvia de ideas, ideación y colaboración en FigJam sean más divertidas y emocionantes con acceso directo a más de 100,000 pegatinas Lottie gratuitas y más de 400,000 premium.

Private animations
Private animations

Accede a tus archivos privados y a la biblioteca de animación de tu equipo

Ahora puedes insertar tus archivos privados y llevar la biblioteca compartida de tu equipo a tus diseños de Figma para un flujo de trabajo más eficiente y colaborativo.

Export animation
Export animation

Personaliza animaciones para tu marca

Aplica paletas de colores populares o adapta tus colores para que coincidan con el estilo y la estética de tu marca.

LottieFiles para Figma Modo Desarrollador

NUEVO

Animaciones de barcos de forma rápida y conveniente

Accede fácilmente a los enlaces de activos de tus animaciones y a los códigos de inserción generados automáticamente directamente dentro de Figma y envíalos en un abrir y cerrar de ojos.

Ship animations quickly and conveniently
Ship animations quickly and conveniently
VS Code Support
VS Code Support

Soporte de VS Code

Los desarrolladores ahora pueden acceder a enlaces y códigos de animaciones directamente dentro de VS Code. ¡No más alternar entre Figma y VS Code!

Player Controls
Player Controls

Controles del jugador

Personaliza la configuración de la animación, como el modo de reproducción, la dirección, la velocidad y más, y genera su código de inserción con solo unos pocos clics.

Automatic enabling of asset links
Automatic enabling of asset links

Activación automática de enlaces de activos

Olvídate de la molestia de cambiar entre tu espacio de trabajo y los diseños de Figma. Los enlaces de activos de las animaciones del espacio de trabajo se habilitan automáticamente cuando se insertan a través de LottieFiles para Figma.

Full preview of animations
Full preview of animations

Vista previa completa de animaciones

Podrás previsualizar tus animaciones seleccionadas en movimiento completo, lo que te dará una buena idea de cómo se verán y se comportarán una vez que estén listas para ser utilizadas.

Ship animations as Optimized dotLottie or Lottie JSON
Ship animations as Optimized dotLottie or Lottie JSON

Animaciones de barcos como dotLottie optimizado o Lottie JSON

Puedes elegir enviar tus animaciones en los formatos Optimized dotLottie o Lottie JSON, asegurando que tus archivos sean súper pequeños y se carguen en un instante.

Comience en 3 simples pasos

Step 1

Instalar y ejecutar el plugin

Step 2

Buscar o crear el tuyo propio

Buscar animaciones a través de la pestaña ‘Descubrir’ ‘Espacios de trabajo’. O crea tu propia animación usando la pestaña "Figma a Lottie".


Para el plugin Modo de desarrollo, selecciona una animación insertada desde cualquiera de tus espacios de trabajo para empezar.

Step 3

Inserte o inspeccione su animación

Abre, personaliza e inserta tu animación como un GIF en el lienzo de Figma.


Para el complemento Modo Desarrollador, elige el formato de archivo deseado y copia el enlace del recurso de la animación o el código de inserción generado automáticamente para enviarlo.

¡Aprende todo sobre cómo crear animaciones en Figma y también obtén la certificación!

Design teams love LottieFiles

Airbnb

"Instead of spending dozens of hours learning Xcode or Android studio, I use LottieFiles to test and share. Now I use those hours to make my animations as dope as I can."

Salih Abdul-Karim
Lead Motion Designer at Airbnb

Salih Abdul-Karim, Lead Motion Designer at Airbnb
Webflow

"Our customers can add Lottie animations to their site in seconds, without even thinking about code. The creative control this unlocks is huge."

Barrett Johnson
Product Marketing at Webflow

Barrett Johnson, Product Marketing at Webflow
Swiggy

"LottieFiles is a one-stop destination for all your Lottie needs ever."

Saptarshi Prakash
Product Design Manager at Swiggy

Saptarshi Prakash, Product Design Manager at Swiggy

Design teams love LottieFiles

Airbnb

"Instead of spending dozens of hours learning Xcode or Android studio, I use LottieFiles to test and share. Now I use those hours to make my animations as dope as I can."

Salih Abdul-Karim
Lead Motion Designer at Airbnb

Salih Abdul-Karim, Lead Motion Designer at Airbnb
Webflow

"Our customers can add Lottie animations to their site in seconds, without even thinking about code. The creative control this unlocks is huge."

Barrett Johnson
Product Marketing at Webflow

Barrett Johnson, Product Marketing at Webflow
Swiggy

"LottieFiles is a one-stop destination for all your Lottie needs ever."

Saptarshi Prakash
Product Design Manager at Swiggy

Saptarshi Prakash, Product Design Manager at Swiggy

FAQs

¿Qué es un Lottie?

Un Lottie es un formato de archivo de animación basado en JSON que utiliza una representación textual y descriptiva de los elementos de la animación y el movimiento hacia un tamaño de archivo más pequeño, independencia de plataforma, independencia de resolución y velocidad de fotogramas variable durante la reproducción de la animación. Existes reproductores de Lottie de código abierto y gratuitos en la web, iOS, Android, Windows y otras plataformas.

¿Qué es un Lottie?

Un Lottie es un formato de archivo de animación basado en JSON que utiliza una representación textual y descriptiva de los elementos de la animación y el movimiento hacia un tamaño de archivo más pequeño, independencia de plataforma, independencia de resolución y velocidad de fotogramas variable durante la reproducción de la animación. Existes reproductores de Lottie de código abierto y gratuitos en la web, iOS, Android, Windows y otras plataformas.

¿Dónde puedo descargar el complemento LottieFiles para Figma?

¿Dónde puedo descargar el complemento LottieFiles para Figma?

¿Qué formatos admite el plugin para importar?

¿Qué formatos admite el plugin para importar?

¿Qué formatos admite el complemento para exportar?

¿Qué formatos admite el complemento para exportar?

¿Necesito iniciar sesión para usar el plugin?

¿Necesito iniciar sesión para usar el plugin?

¿Necesito una conexión a Internet para usar el complemento?

¿Necesito una conexión a Internet para usar el complemento?

¿El complemento LottieFiles para Figma admite el formato dotLottie?

¿El complemento LottieFiles para Figma admite el formato dotLottie?

¿La extensión de LottieFiles para Figma admite el formato GIF?

¿La extensión de LottieFiles para Figma admite el formato GIF?

¿Soporta LottieFiles para Figma el formato SVG?

¿Soporta LottieFiles para Figma el formato SVG?

¿Puedo acceder a mis Animaciones Privadas desde el complemento?

¿Puedo acceder a mis Animaciones Privadas desde el complemento?

¿Qué es LottieFiles para Figma Dev Mode?

¿Qué es LottieFiles para Figma Dev Mode?

¿Cómo puedo acceder a LottieFiles para Figma Dev Mode?

¿Cómo puedo acceder a LottieFiles para Figma Dev Mode?

¿Cómo utilizo LottieFiles para el Figma en Dev Mode?

¿Cómo utilizo LottieFiles para el Figma en Dev Mode?

¿Puedo previsualizar las animaciones antes de agregarlas desde mis diseños de Figma a un entorno de código?

¿Puedo previsualizar las animaciones antes de agregarlas desde mis diseños de Figma a un entorno de código?

¿Qué formatos de animación puedo usar al enviar animaciones a través de LottieFiles para el Modo Dev de Figma?

¿Qué formatos de animación puedo usar al enviar animaciones a través de LottieFiles para el Modo Dev de Figma?

¿Por qué no pueden funcionar las animaciones públicas que he insertado en LottieFiles para Figma Dev Mode?

¿Por qué no pueden funcionar las animaciones públicas que he insertado en LottieFiles para Figma Dev Mode?

¿Se me cobrará algo por usar LottieFiles para el modo de desarrollo de Figma?

¿Se me cobrará algo por usar LottieFiles para el modo de desarrollo de Figma?

¿Puedo colaborar con otros usando LottieFiles para el Modo de Desarrollo de Figma?

¿Puedo colaborar con otros usando LottieFiles para el Modo de Desarrollo de Figma?

¿Hay soporte disponible si encuentro algún problema o tengo preguntas sobre LottieFiles para el modo de desarrollo de Figma?

¿Hay soporte disponible si encuentro algún problema o tengo preguntas sobre LottieFiles para el modo de desarrollo de Figma?

¿Cómo puedo mantenerme actualizado con cualquier nueva función o cambio en LottieFiles para el Modo Dev de Figma?

¿Cómo puedo mantenerme actualizado con cualquier nueva función o cambio en LottieFiles para el Modo Dev de Figma?

Instalar LottieFiles para Figma

Comience con el complemento y todas sus funciones de forma gratuita

7,9 mil me gusta

603k instalaciones