Cómo exportar un GIF desde Figma

Enlaces de dispositivos

¿Está buscando una manera de llevar su juego de desarrollador y diseño al siguiente nivel? Figma es una herramienta increíble que permite a los usuarios crear prototipos ricos llenos de efectos de audio, video y animación. Sin embargo, para probar adecuadamente la sensación y las funciones del prototipo, debería poder exportarlo como un GIF y verlo en acción.

Cómo exportar un GIF desde Figma

Esta guía explicará cómo puede exportar sus prototipos de Figma como GIF utilizando su PC o dispositivo móvil.

Cómo exportar a GIF en Figma en una PC

La forma más sencilla de exportar GIF animados desde Figma es con el complemento TinyImage. Antes de que pueda iniciar y usar el complemento, deberá iniciar sesión en su cuenta de Figma e ir a la sección "Comunidad".

Para descargar el complemento:

  1. Ingrese "TinyImage" en el cuadro de búsqueda.
    Cómo exportar un GIF desde Figma
  2. En la sección "Complementos", busque el icono "TinyImage Compressor".
    Cómo exportar un GIF desde Figma
  3. Haga clic en el botón de instalación junto al icono.
    Cómo exportar un GIF desde Figma

Cuando haya instalado el complemento, abra el proyecto de diseño que desea guardar como GIF. Haga clic en cualquier parte de la pantalla para abrir el menú desplegable. Elija "Complementos" y toque "TinyImage Compressor" para iniciarlo.

Aquí se explica cómo crear un GIF con el complemento:

  1. En la parte superior de la ventana del complemento, presione el botón "Crear un GIF".
    Cómo exportar un GIF desde Figma
  2. Selecciona las capas en tu lienzo de Figma. Actuarán como marcos de tu GIF.
    Cómo exportar un GIF desde Figma
  3. En la parte inferior de la ventana de TinyImage, toque la opción "Usar capas seleccionadas". Verá una presentación de diapositivas de sus capas en el centro de la ventana en el orden en que las seleccionó.
    Cómo exportar un GIF desde Figma
  4. Debajo de la vista previa, haga clic en los íconos de capa, luego arrástrelos hacia la izquierda o hacia la derecha para cambiar su orden.
    Cómo exportar un GIF desde Figma
  5. Toque el pequeño botón "Reproducir" debajo de la presentación de diapositivas para ajustar la velocidad de reproducción.
    Cómo exportar un GIF desde Figma
  6. Junto a los controles de retardo de tiempo, seleccione cuántas veces se repetirá el GIF. La configuración predeterminada es "Infinito". Haga clic en la opción "Infinito" para desactivarlo e ingrese el número deseado de bucles en el cuadro al lado.
    Cómo exportar un GIF desde Figma
  7. Ajuste el tamaño del GIF en los campos debajo de las opciones de retardo de tiempo y bucle.
    Cómo exportar un GIF desde Figma
  8. Si sus capas tienen bordes transparentes, presione el botón "Fondo transparente" en la parte inferior de la ventana para hacerlos visibles en el GIF.
    Cómo exportar un GIF desde Figma
  9. Seleccione la calidad de imagen del GIF en la esquina inferior izquierda. Lo mejor es establecer la tasa en alrededor de 80 o 90 para conservar todas las características de sus capas.
    Cómo exportar un GIF desde Figma
  10. Deje los controles de "Dithering" configurados en "No Dithering".
    Cómo exportar un GIF desde Figma
  11. Toque el botón "Exportar GIF" en la parte superior de la ventana de TinyImage.
    Cómo exportar un GIF desde Figma
  12. Los marcos se fusionarán y formarán un GIF y se descargarán y guardarán automáticamente en sus archivos de descarga.

Una nota sobre las capas

El menú desplegable sobre las miniaturas de las capas también le permite reproducir las capas de izquierda a derecha o de derecha a izquierda. Sin embargo, para tener más control sobre la apariencia final del GIF, es mejor ordenar los marcos manualmente.

Una nota sobre la reproducción

Establezca la velocidad de reproducción predeterminada moviendo el botón en la línea de medición de tiempo. Sin embargo, si desea que los cuadros específicos tengan diferentes velocidades de reproducción, puede hacerlo haciendo clic en una miniatura y configurando la velocidad en el cuadro debajo de ella.

Cómo exportar a GIF en Figma en un dispositivo móvil

Los prototipos de Figma a menudo vienen con animaciones avanzadas como pestañas deslizantes, opciones de deslizamiento y menús desplegables. Guardarlos como un GIF le facilitará mostrar el diseño en acción. Sin embargo, la aplicación móvil solo permite a los usuarios obtener una vista previa de sus prototipos. Aunque no hay soporte de exportación incorporado, puede solucionar el problema grabando la pantalla de la aplicación y convirtiendo el video en un GIF.

Cómo exportar a GIF en Figma en un iPhone

Para guardar su proyecto como un GIF en un iPhone, primero grabará en pantalla la aplicación Figma y creará un GIF con la aplicación Accesos directos.

Para grabar en pantalla Figma en un iPhone:

  1. Inicie la aplicación móvil Figma y abra el proyecto que desea convertir en un GIF.
  2. Ingrese a "Configuración" y seleccione "Centro de control".
  3. Elija "Personalizar controles" y toque el botón verde junto a "Grabación de pantalla" para habilitar la función.
  4. Regrese al "Centro de control".
  5. Presione el botón "Grabación de pantalla".
  6. Haga clic en el botón rojo para finalizar la grabación.

La grabación generalmente se almacena en su aplicación Fotos.

Verifique si su iPhone tiene la herramienta de accesos directos preinstalada para convertir su video en un GIF. También puede descargar la herramienta desde la App Store .

Aquí se explica cómo convertir el video en un archivo GIF en un iPhone:

  1. Abra la aplicación, vaya a la parte inferior de la interfaz y seleccione la tarjeta "Galería".
    Cómo exportar un GIF desde Figma
  2. Toque la pestaña "Accesos directos de inicio" debajo del menú de búsqueda.
  3. Desplácese hasta la parte inferior de la pantalla y haga clic en la sección "Crear GIF".
    Cómo exportar un GIF desde Figma
  4. Presione el botón "Agregar acceso directo" para habilitar el acceso directo GIF.
    Cómo exportar un GIF desde Figma
  5. Cuando se haya instalado el acceso directo, vuelva a "Mis accesos directos".
    Cómo exportar un GIF desde Figma
  6. Toque "Crear GIF" y elija "Aceptar" para conectar la aplicación y su galería de fotos.
    Cómo exportar un GIF desde Figma
  7. Navegue a través de sus videos y seleccione el video que convertirá en un GIF.
    Cómo exportar un GIF desde Figma
  8. Utilice los controles deslizantes para seleccionar qué fotogramas se incluirán en el GIF.
    Cómo exportar un GIF desde Figma
  9. Toque "Guardar" para registrar los cambios. Su nuevo archivo GIF se guardará en la aplicación de fotos de la tableta.
    Cómo exportar un GIF desde Figma
  10. Haga clic en "Listo" para salir de la aplicación Accesos directos.
    Cómo exportar un GIF desde Figma

Cómo exportar a GIF en Figma en un dispositivo Android

Como la aplicación Figma permite a los usuarios obtener una vista previa de los prototipos pero no exportarlos, grabará la vista previa en su dispositivo Android, transformando el video en un GIF más tarde.

Aquí se explica cómo grabar en pantalla Figma en un Android:

  1. Inicie la aplicación y abra una vista previa de su proyecto.
  2. Deslice dos veces desde la parte superior de la pantalla y seleccione "Registro de pantalla". Si no está allí, intente deslizar el dedo hacia la derecha. A veces tendrás que tocar el ícono "Editar" en la parte superior de la pantalla para revelar un menú oculto. La función "Registro de pantalla" también puede estar allí.
  3. Toque la vista previa del prototipo para indicar que desea grabarlo.
  4. Haga clic en el botón "Inicio". Una vez finalizada la cuenta atrás, se grabará la pantalla.
  5. Deslice hacia abajo y toque la tarjeta "Grabadora de pantalla" para detener la grabación.

El video de la vista previa de Figma se guardará en su aplicación de fotos de Android. Puedes convertirlo en un GIF con la aplicación GIPHY .

Para convertir un video en un GIF en un dispositivo Android:

  1. Instale y ejecute la aplicación GIPHY en su dispositivo.
    Cómo exportar un GIF desde Figma
  2. Regístrate y crea una cuenta GIPHY.
    Cómo exportar un GIF desde Figma
  3. Presione el botón "Crear" en la parte superior derecha de la interfaz.
    Cómo exportar un GIF desde Figma
  4. Habilite la aplicación para acceder a su cámara.
    Cómo exportar un GIF desde Figma
  5. Seleccione un video de su galería de Android.
    Cómo exportar un GIF desde Figma
  6. Ajusta la duración del video. La aplicación GIPHY permite a los usuarios insertar elementos como texto y pegatinas en sus archivos.
    Cómo exportar un GIF desde Figma
  7. Haga clic en el icono de "Flecha" en la parte inferior de la aplicación.
    Cómo exportar un GIF desde Figma
  8. Elija "Compartir GIF" y seleccione "Guardar GIF".
    Cómo exportar un GIF desde Figma

Exportar GIF sin restricciones

Ya sea que sea un desarrollador experimentado o un diseñador aficionado, merece tener una forma conveniente de mostrar su trabajo a otros en forma de GIF. Puede obtener una vista previa de sus creaciones en la aplicación Figma, pero acceder a sus diseños puede convertirse en una tarea desafiante una vez que se corta la conexión a Internet. Hasta que Figma presente una solución de exportación fácil de usar, puede confiar en los métodos que presentamos en el artículo.

Esperamos que esta guía lo haya ayudado a comprender mejor cómo obtener un GIF de alta calidad de sus creaciones de Figma, sin importar qué dispositivo esté usando.

¿Utilizas la versión web o móvil de Figma? ¿Cuál es tu forma preferida de exportar GIF? Háganos saber en la sección de comentarios a continuación.

Sign up and earn $1000 a day ⋙

Cómo encontrar quién te dejó de seguir en Instagram

Cómo encontrar quién te dejó de seguir en Instagram

Aunque Instagram te notifica cada vez que otro usuario te sigue, no sabrás si alguien dejó de seguirte a menos que revises tu perfil. Mientras

Cómo ponerse en contacto con el servicio de atención al cliente de Amazon

Cómo ponerse en contacto con el servicio de atención al cliente de Amazon

¿Necesitas ayuda con un problema relacionado con Amazon y no sabes a quién contactar? Descubra todas las formas de ponerse en contacto con Atención al cliente de Amazon.

Cómo agregar un nuevo usuario en HubSpot

Cómo agregar un nuevo usuario en HubSpot

Si está iniciando o haciendo crecer un negocio, necesita una forma efectiva de administrar diferentes equipos y departamentos, compartir información, administrar el flujo de trabajo y

Cómo saber cuándo alguien fue visto por última vez en Snapchat

Cómo saber cuándo alguien fue visto por última vez en Snapchat

Snapchat se enorgullece de ser la plataforma de redes sociales más honesta que existe. Ofrece funciones e información que la mayoría de las aplicaciones sociales no ofrecen, como quién

Cómo encontrar amigos eliminados en Snapchat

Cómo encontrar amigos eliminados en Snapchat

Si alguien te molesta en Snapchat o tus instantáneas no te parecen interesantes, una opción que tienes además de bloquearlo es eliminarlo de tu cuenta.

Snapchat: cómo ver quién te bloqueó

Snapchat: cómo ver quién te bloqueó

Si usas mucho Snapchat, es posible que te hayas topado con un usuario que hizo algo que te molestó o molestó. Lamentablemente, esto es algo común en las redes sociales. Pero

Cómo desactivar el envejecimiento en Sims 4

Cómo desactivar el envejecimiento en Sims 4

Como en el mundo real, tus creaciones en Sims 4 eventualmente envejecerán y morirán. Los Sims envejecen de forma natural a través de siete etapas de la vida: bebé, niño pequeño, niño, adolescente,

Cómo agregar una página en Notability

Cómo agregar una página en Notability

Si es un usuario de Notability, probablemente no se le escape su conveniencia para tomar notas y organizar sus pensamientos. Y si bien las notas básicas son útiles sobre

Formularios de Google: cómo recibir notificaciones por correo electrónico

Formularios de Google: cómo recibir notificaciones por correo electrónico

Google Forms proporciona un método conveniente para recopilar información y opiniones mediante la realización de encuestas, registro de eventos y formularios de comentarios. Este

Microsoft Edge: cómo configurar y utilizar espacios de trabajo

Microsoft Edge: cómo configurar y utilizar espacios de trabajo

Microsoft Edge Workspaces es una función centrada en la colaboración disponible en Windows y macOS. Puedes crear un Espacio de Trabajo y abrir todo lo necesario

Cómo ver cuándo se creó una cuenta de Instagram: la suya o la de otra persona

Cómo ver cuándo se creó una cuenta de Instagram: la suya o la de otra persona

La plataforma de redes sociales Instagram ha recorrido un largo camino desde su inicio en 2010 y su adquisición de Facebook en 2012, y algunas personas han estado activas.

Cómo programar el envío de un mensaje de texto en IMessage

Cómo programar el envío de un mensaje de texto en IMessage

¿Alguna vez te has despertado en mitad de la noche y has recordado que necesitas enviarle un mensaje a alguien por la mañana? Le pasa a todo el mundo. Mientras que la mayoría

Minecraft Java: Cómo instalar el mod From The Fog

Minecraft Java: Cómo instalar el mod From The Fog

Si te cansas de dominar el mundo de Vanilla Minecraft: Java Edition, puedes darle nueva vida al juego agregando modificaciones y paquetes de datos, que incluyen

Cómo arreglar Discord que muestra una pantalla negra durante la transmisión

Cómo arreglar Discord que muestra una pantalla negra durante la transmisión

Descubra cómo solucionar el problema de la pantalla negra al transmitir en Discord con estos consejos de solución de problemas para volver a compartir su contenido.

Cómo solucionar el error No se pueden enviar mensajes en Telegram

Cómo solucionar el error No se pueden enviar mensajes en Telegram

Descubra por qué no puede enviar mensajes en Telegram y aprenda soluciones sencillas para el problema, asegurándose de poder mantenerse en contacto con sus contactos.

Cómo desinstalar y reinstalar Chrome

Cómo desinstalar y reinstalar Chrome

https://www.youtube.com/watch?v=g4e-Vxt3Cr0 Google Chrome es uno de los navegadores web más populares por una buena razón. Está disponible en todos los móviles y

How To Merge Tabs In Google Sheets

How To Merge Tabs In Google Sheets

Spreadsheets can contain valuable information like sales records, accounting data, contact information, etc. However, that data is often spread across

Instrucciones para crear la tendencia de la fase lunar.

Instrucciones para crear la tendencia de la fase lunar.

Instrucciones para crear una tendencia de fase lunar. La tendencia Luna es extremadamente popular en TikTok y ha creado una fiebre sin precedentes. A través de la fase lunar te ayudará a saber la fecha.

Cómo editar vídeos publicados en YouTube sin perder vistas

Cómo editar vídeos publicados en YouTube sin perder vistas

Cómo editar videos publicados en YouTube sin perder vistas. Olvidaste difuminar el contenido sensible en los videos publicados en YouTube. No te preocupes, aquí te explicamos cómo ajustarlo.

Cómo habilitar el modo oscuro en TikTok

Cómo habilitar el modo oscuro en TikTok

Cómo activar el modo oscuro en TikTok, Cómo activar el modo oscuro en TikTok no es difícil. El artículo le guiará en detalle sobre cómo cambiar la interfaz de TikTok a negra en Samsung.