Como exportar um GIF do Figma

Links de dispositivos

• Android
• Iphone
• Mac
• janelas
• Dispositivo ausente?

Você está procurando uma maneira de levar seu jogo de desenvolvedor e design para o próximo nível? Figma é uma ferramenta incrível que permite aos usuários criar protótipos ricos preenchidos com efeitos de áudio, vídeo e animação. No entanto, para testar adequadamente a sensação e as funções do protótipo, você deve ser capaz de exportá-lo como um GIF e vê-lo em ação.

Este guia explicará como você pode exportar seus protótipos Figma como GIFs usando seu PC ou dispositivo móvel.

Como exportar para GIF no Figma em um PC

A maneira mais simples de exportar GIFs animados do Figma é com o plugin TinyImage. Antes de iniciar e usar o plug-in, você precisará fazer login na sua conta Figma e ir para a seção “Comunidade”.

Para baixar o plug-in:

1. Digite “TinyImage” na caixa de pesquisa.
   
2. Na seção “Plugins”, encontre o ícone “TinyImage Compressor”.
   
3. Clique no botão de instalação ao lado do ícone.
   

Depois de instalar o plug-in, abra o projeto de design que deseja salvar como GIF. Clique em qualquer lugar na tela para abrir o menu suspenso. Escolha “Plugins” e toque em “TinyImage Compressor” para iniciá-lo.

Veja como criar um GIF com o plug-in:

1. Na parte superior da janela do plug-in, pressione o botão “Criar um GIF”.
   
2. Selecione as camadas na tela do Figma. Eles atuarão como os quadros do seu GIF.
   
3. Na parte inferior da janela do TinyImage, toque na opção “Usar camadas selecionadas”. Você verá uma apresentação de slides de suas camadas no centro da janela na ordem em que as selecionou.
   
4. Abaixo da visualização, clique nos ícones da camada e arraste-os para a esquerda ou para a direita para mudar a ordem.
   
5. Toque no pequeno botão “Play” abaixo da apresentação de slides para ajustar a velocidade de reprodução.
   
6. Ao lado dos controles de atraso, selecione quantas vezes o GIF será repetido. A configuração padrão é “Infinito”. Clique na opção “Infinito” para desativá-la e digite o número desejado de loops na caixa ao lado.
   
7. Ajuste o tamanho do GIF nos campos abaixo das opções de atraso e loop.
   
8. Se suas camadas tiverem bordas transparentes, pressione o botão “Fundo transparente” na parte inferior da janela para torná-las visíveis no GIF.
   
9. Selecione a qualidade da imagem do GIF no canto inferior esquerdo. É melhor definir a taxa em torno de 80 ou 90 para preservar todos os recursos de suas camadas.
   
10. Deixe os controles “Dithering” definidos como “No Dithering”.
    
11. Toque no botão “Exportar GIF” na parte superior da janela do TinyImage.
    
12. Os quadros se fundirão e formarão um GIF e ele será automaticamente baixado e salvo em seus arquivos de download.

Uma observação sobre camadas

O menu suspenso acima das miniaturas das camadas também permite reproduzir as camadas da esquerda para a direita ou da direita para a esquerda. No entanto, para ter mais controle sobre a aparência final do GIF, é melhor ordenar os quadros manualmente.

Uma observação sobre a reprodução

Defina a velocidade de reprodução padrão movendo o botão na linha de medição de tempo. No entanto, se você deseja que quadros específicos tenham velocidades de reprodução diferentes, clique em uma miniatura e defina a velocidade na caixa abaixo dela.

Como exportar para GIF no Figma em um dispositivo móvel

Os protótipos do Figma geralmente vêm com animações avançadas, como guias deslizantes, opções de deslizar e menus suspensos. Salvá-los como um GIF facilitará a exibição do design em ação. No entanto, o aplicativo móvel permite apenas que os usuários visualizem seus protótipos. Embora não haja suporte de exportação integrado, você pode contornar o problema gravando a tela do aplicativo e transformando o vídeo em um GIF.

Como exportar para GIF no Figma em um iPhone

Para salvar seu projeto como um GIF em um iPhone, primeiro você deve gravar a tela do aplicativo Figma e criar um GIF com o aplicativo Atalhos.

Para gravar a tela do Figma em um iPhone:

1. Inicie o aplicativo móvel Figma e abra o projeto que deseja transformar em GIF.
2. Entre em “Configurações” e selecione “Centro de Controle”.
3. Escolha “Personalizar controles” e toque no botão verde ao lado de “Gravação de tela” para ativar o recurso.
4. Retorne ao “Centro de Controle”.
5. Pressione o botão "Gravação de tela".
6. Clique no botão vermelho para terminar a gravação.

A gravação é normalmente armazenada em seu aplicativo Fotos.

Verifique se o seu iPhone tem a ferramenta Atalhos pré-instalada para transformar seu vídeo em um GIF. Você também pode baixar a ferramenta na App Store .

Veja como transformar o vídeo em um arquivo GIF em um iPhone:

1. Abra o aplicativo, vá até a parte inferior da interface e selecione o cartão “Galeria”.
   
2. Toque na guia "Atalhos iniciais" abaixo do menu de pesquisa.
3. Role até a parte inferior da tela e clique na seção "Criar GIF".
   
4. Clique no botão "Adicionar atalho" para ativar o atalho GIF.
   
5. Quando o atalho for instalado, volte para “Meus Atalhos”.
   
6. Toque em “Criar GIF” e escolha “OK” para conectar o aplicativo e sua galeria de fotos.
   
7. Navegue pelos seus vídeos e selecione o vídeo que você transformará em um GIF.
   
8. Use os controles deslizantes para selecionar quais quadros serão incluídos no GIF.
   
9. Toque em “Salvar” para gravar as alterações. Seu novo arquivo GIF será salvo no aplicativo de fotos do tablet.
   
10. Clique em "Concluído" para sair do aplicativo Atalhos.
    

Como exportar para GIF no Figma em um dispositivo Android

Como o aplicativo Figma permite aos usuários visualizar protótipos, mas não exportá-los, você gravará a visualização em seu dispositivo Android, transformando o vídeo em um GIF posteriormente.

Veja como gravar a tela do Figma em um Android:

1. Inicie o aplicativo e abra uma prévia do seu projeto.
2. Deslize duas vezes na parte superior da tela e selecione “Gravação de tela”. Se não estiver lá, tente deslizar para a direita. Às vezes, você terá que tocar no ícone “Editar” na parte superior da tela para revelar um menu oculto. O recurso “Gravação de tela” também pode estar lá.
3. Toque na visualização do protótipo para indicar que deseja gravá-lo.
4. Clique no botão “Iniciar”. Assim que a contagem regressiva terminar, a tela será gravada.
5. Deslize para baixo e toque no cartão “Gravador de tela” para interromper a gravação.

O vídeo da prévia do Figma será salvo em seu aplicativo de fotos do Android. Você pode transformá-lo em um GIF com o aplicativo GIPHY .

Para converter um vídeo em um GIF em um dispositivo Android:

1. Instale e inicie o aplicativo GIPHY em seu dispositivo.
   
2. Inscreva-se e crie uma conta GIPHY.
   
3. Pressione o botão "Criar" no canto superior direito da interface.
   
4. Ative o aplicativo para acessar sua câmera.
   
5. Selecione um vídeo da sua Galeria do Android.
   
6. Ajuste a duração do vídeo. O aplicativo GIPHY permite que os usuários insiram elementos como texto e adesivos em seus arquivos.
   
7. Clique no ícone "Seta" na parte inferior do aplicativo.
   
8. Escolha “Compartilhar GIF” e selecione “Salvar GIF”.
   

Exporte GIFs sem restrições

Seja você um desenvolvedor experiente ou um designer amador, você merece ter uma maneira conveniente de mostrar seu trabalho para outras pessoas em formato GIF. Você pode visualizar suas criações no aplicativo Figma, mas acessar seus designs pode se tornar uma tarefa desafiadora quando a conexão com a Internet cair. Até que o Figma apresente uma solução de exportação amigável, você pode confiar nos métodos que apresentamos no artigo.

Esperamos que este guia tenha ajudado você a entender melhor como obter um GIF de alta qualidade de suas criações Figma, não importa qual dispositivo você esteja usando.

Você usa a versão web ou móvel do Figma? Qual é a sua forma preferida de exportar GIFs? Deixe-nos saber na seção de comentários abaixo.