Skip to main content
Screenshot 2026 05 06 At 14 19 04
Flowstep foi construído para se encaixar no fluxo de design que você já usa — não para substituir. Você pode gerar um design no Flowstep e imediatamente trazê-lo para Figma usando um copiar-e-colar simples, ou fazer o inverso e importar um frame do Figma para o Flowstep. Isso significa que você consegue a velocidade da geração de design assistida por IA combinada com os recursos de precisão e colaboração que você confia no Figma.
Flowstep e Figma são ferramentas complementares, não concorrentes. Flowstep ajuda você a gerar rapidamente e explorar ideias de design de UI; Figma é onde você refina, colabora e constrói trabalho pronto para produção. Usar ambas juntas te dá o melhor dos dois mundos.

​
Como copiar um design do Flowstep para Figma

1

Selecione uma ou mais telas no Flowstep

Clique em uma tela para selecioná-la — ou selecione várias telas para copiá-las todas de uma vez. Certifique-se de que a seleção está destacada na tela.
2

Copie a seleção

Pressione **Cmd+**⇧+C no Mac ou **Ctrl+**⇧+C no Windows. Flowstep mostra “Preparing your design — stay on this tab and keep the screen selected” enquanto trabalha; a cópia completa em um momento.
3

Cole em seu arquivo Figma

Alterne para Figma e abra o arquivo onde você quer colocar o design. Pressione Cmd+V no Mac ou Ctrl+V no Windows para colar. As telas do Flowstep aparecem em sua tela do Figma, prontas para editar.
Copiar para Figma usa a área de transferência do seu navegador, então o navegador deve permitir acesso à área de transferência do Flowstep — se você vir um erro de permissão, permita acesso à área de transferência nas configurações do seu navegador e tente novamente. Alternar abas durante a cópia interrompe a transferência; mantenha a aba do Flowstep focada até que a cópia termine.
Cole o frame em uma página dedicada “AI imports” no Figma para manter seus arquivos de trabalho organizados. De lá, você pode mover elementos para seu sistema de design principal ou biblioteca de componentes no seu próprio ritmo.

​
Importe um design do Figma

Você também pode fazer o inverso e trazer um frame do Figma para o Flowstep como telas editáveis. Importação está disponível para todos — conecte sua conta Figma uma vez, depois importe de um link de frame.
1

Conecte Figma

Conecte sua conta Figma ao Flowstep a partir de suas configurações. Flowstep usa a autorização do Figma para ler os arquivos que você tem acesso.
2

Copie um link de frame no Figma

No Figma, clique com o botão direito no frame que você quer e escolha Copy link to selection. Você também pode copiar um link para uma página inteira para importar todos os seus frames de nível superior de uma vez.
3

Importe para o Flowstep

Use a opção de importação Figma na barra de ferramentas do Flowstep e cole o link. Flowstep converte o frame em elementos editáveis em sua tela. Reimportar o mesmo frame o atualiza no lugar.

​
O que é importado

Flowstep recria um frame do Figma como elementos nativos e editáveis — não uma imagem plana. Uma importação traz:
  • Frames e suas camadas aninhadas
  • Texto, incluindo estilos por caractere como peso, cor e negrito
  • Cores das suas variáveis Figma
  • Preenchimentos de imagem e ícones SVG e formas
  • Sombras de queda e internas, e borrões de camada e fundo
  • Traços tracejados e pontilhados
A organização do arquivo deve ter Figma conectado. Se um frame não for importado, Flowstep mostra uma mensagem acionável que diz o que fazer a seguir — por exemplo, reconecte Figma se sua autorização expirou, aguarde e tente novamente se Figma estiver limitando taxa ou respondendo lentamente, ou, para um template Community, duplique-o para seu time primeiro e cole o novo link.