Tutorial en vídeo: exporta banners de Figma a imágenes PNG animadas (APNG)
Este vídeo muestra cómo exportar banners animados listos para producción desde Figma a imágenes PNG animadas (APNG) con el plugin Bannerify.
Después de hacer clic en Export to GIF/Video y configurar los ajustes de exportación, puedes hacer clic en el botón Export APNG (n Banners) de la parte inferior del panel de exportación para empezar a exportar tus banners de Figma a imágenes PNG animadas. Así, tus banners animados se exportarán como archivos de imagen PNG animado.
Compatibilidad con navegadores. Por problemas de compatibilidad entre navegadores, las imágenes Animated PNG solo se pueden exportar con Chrome o con la aplicación de escritorio de Figma.
Incluir o excluir banners de la exportación. Por defecto, todas las capas de nivel superior de tu archivo de Figma que se cargan en Bannerify como banners se incluyen en la exportación. Si quieres excluir algún banner (sin volver a cargar los banners seleccionados), desactiva el interruptor Include In Export en la cabecera de la línea de tiempo de ese banner. Así se oculta la línea de tiempo de ese banner y se excluye de cualquier exportación.
Fotogramas por segundo
Puedes cambiar la frecuencia de fotogramas de tus exportaciones GIF con las opciones del selector Frames Per Second. Puedes elegir entre estas opciones de FPS:
- 60 FPS (Ludicrous Mode)
- 30 FPS (Ultra Smooth)
- 24 FPS (Smooth)
- 18 FPS (Less Smooth)
- 12 FPS (Least Smooth)
- 6 FPS (Jittery)
Cuantos más FPS, más tarda el renderizado. Ten en cuenta que más fotogramas tardan más en exportarse y generan archivos más grandes. Por ejemplo, exportar una línea de tiempo de 5 segundos a 24 FPS renderiza 120 fotogramas por banner.
Descargar el archivo .zip final con los PNG
Cuando Bannerify termine de procesar tus banners, verás un mensaje de confirmación. Puedes descargar el archivo .zip con los banners exportados haciendo clic en el botón Download your .zip file.
Guardar archivos descargados desde Figma Si usas la aplicación de escritorio de Figma, verás un aviso para descargar el archivo. En cambio, si usas Figma en un navegador web, el archivo se descargará automáticamente en tu ordenador (normalmente en la carpeta Descargas).
Abrir el archivo .zip con los PNG
Cuando hayas descargado el archivo .zip de Figma a tu ordenador, abre el explorador de archivos en la carpeta donde se guardó. Haz doble clic en el archivo .zip exportado para descomprimir su contenido y usar tus banners como quieras.