Se você já tentou conectar o Figma ao ChatGPT (na versão gratuita ou paga) e ficou meio perdido em como fazer o fluxo funcionar? Esse tutorial é pra você! 🚀
Nos últimos meses, o ChatGPT ganhou recursos incríveis de integração com ferramentas externas, e um dos mais poderosos é justamente o uso do Figma direto na conversa.
Neste mini-tutorial, vou te mostrar passo a passo como integrar e usar o Figma com o ChatGPT, mesmo que você nunca tenha feito isso antes.
Ativando o Figma dentro do ChatGPT
Passo 1: Verifique sua versão do ChatGPT
- Segundo informações do próprio ChatGPT se você usa ChatGPT Plus, Team ou Enterprise, já tem acesso à integração de apps (incluindo o Figma).
- A versão gratuita GPT-5 ainda não libera todos os apps externos, mas você ativar o Figma.
Caso tenha dúvida é só perguntar para o próprio ChatGPT qual é a versão.
Passo 2: Vamos ativar o Figma (ou verificar se está ativo)
- Clique no seu nome ou foto de perfil no canto inferior esquerdo do ChatGPT depois clique em “Configurações”
- Em “Configurações” → vá em “Aplicativos” (ou “Settings → Features”, se estiver em inglês).
- Inicie o processo de ativação clicando sob a forma retangular com o logo e nome Figma para iniciar a configuração que ativa o Figma
- Na tela de configuração do Figma clique no botão “Conectar” no lado direito
- Escolha a opção “Continuar” para conectar a sua conta Figma ou “Continuar sem conta”
- Ao continuar você vai precisar permitir acesso a sua conta Figma, aqui vamos integrar as duas ferramentas (ChatGPT + Figma)
- Você pode “Permitir acesso” (ou “Allow Access”, se estiver em inglês) para a conta que esta sendo exibida ou trocar de conta (Ao escolher trocar de conta, escolha a conta desejada)
- Ao permitir acesso é exibido uma mensagem de sucesso
- Agora o botão de conectar é substituído pelo “Desconectar”. Apenas clique nele quando precisar desconectar sua conta
- Nesse momento você já pode fechar a janela (modal de configurações)
Depois disso, se necessário recarregue a página do ChatGPT.
Passo 3: Comece a utilizar o Figma
Opção 1
- Para começar a utilizar o Figma abra uma nova conversa e na caixa de texto digite o símbolo “ / “ e depois a letra F “f”, dessa forma: /f
- Não precisa digitar a palavra toda, as vezes se digitar a palavra Figma toda a opção não aparece para ser selecionada
- Clique na opção Figma
- Agora você pode adicionar o prompt
Opção 2
- Para começar a utilizar o Figma abra uma nova conversa
- Na caixa de texto ao lado de “Pergunte alguma coisa” clique no +
- Ao clicar no símbolo + será aberto uma caixa de opções (um pequeno modal)
- Passe o mouse sobre a opção “Mais” e então vá até Figma clique sobre
- Agora você pode adicionar o prompt
Passo 4: Exemplo de prompt
- Com o Figma adicionado na caixa de texto da conversa com ChatGPT, escreva o seu prompt. Exemplo:“ Crie um fluxograma para um aplicativo que vende livros usados “
Observação: Em conjunto com o seu prompt “ Crie um fluxograma para um aplicativo que vende livros usados “ na caixa de texto a ferramenta Figma deve aparecer de alguma forma ou em formato de texto em azul, ou seja Figma escrito com texto azul, ou como a logo (igual da imagem)
- O resultado do fluxograma é exibido na conversa do chat
- Você pode clicar em “Edit in Figma” para editar no Figma 🤩
- Pode ser necessário escolher novamente a conta que foi autorizada para conexão agora para abrir o arquivo
- Ao escolher editar no Figma será aberto o arquivo no FigJam
- Pode acontecer do Figma pedir para você mover o arquivo para uma equipe
Prontinho!🥳 Agora você pode começar a editar ✍️🎨
