Saltar para o conteúdo principal
Screenshot 2026 05 06 At 14 19 49
Quando estiver pronto para partilhar ou entregar um desenho, o Flowstep permite exportá-lo como uma imagem estática — JPG ou PNG. Ambos os formatos são amplamente suportados em ferramentas de design, software de apresentação e browsers, pelo que pode levar os seus desenhos gerados por IA para qualquer lugar.

​
Como exportar o seu desenho

1

Abrir o seu desenho

Navegue até ao desenho que deseja exportar dentro do Flowstep.
2

Abrir o menu de exportação

Localize a opção de exportação na barra de ferramentas ou painel de desenho. Selecione-a para abrir as definições de exportação.
3

Escolher o seu formato

Selecione JPG ou PNG consoante o seu caso de uso (veja a comparação abaixo).
4

Transferir o ficheiro

Confirme a sua seleção e transfira a imagem exportada para o seu dispositivo.
Screenshot 2026 05 06 At 14 19 39

​
JPG vs PNG: qual é o formato que deve utilizar?

Se estiver a colar o seu desenho numa apresentação ou a enviar uma pré-visualização rápida para um cliente, JPG é normalmente a escolha certa. Se necessita de bordas nítidas ou de um fundo transparente — por exemplo, para sobrepor o desenho em outra imagem — utilize PNG.

​
Código de exportação

Para além de imagens, o botão Code exporta o seu desenho como código React + Tailwind — copie um fragmento ou transfira o pacote completo como ZIP. Pode exportar um único ecrã, vários ecrãs selecionados ou um ficheiro inteiro de uma só vez. Quando exporta mais do que um ecrã, cada um torna-se o seu próprio ficheiro de componente e qualquer navegação que tenha configurado entre ecrãs é integrada no código gerado, pelo que a aplicação exportada é clicável de ponta a ponta. Os pacotes são independentes: as imagens utilizadas no desenho (incluindo as que anexou no painel de chat) estão incluídas numa pasta public/assets/ com o código a referenciá-las por caminho local, pelo que a exportação funciona como está. Os ficheiros transferidos — quer sejam imagens quer pacotes de código — são nomeados de acordo com o ecrã a que pertencem (recuando para o nome do ficheiro se o ecrã não tiver nome), o que torna as exportações fáceis de identificar quando está a trabalhar com muitos ecrãs.

​
Enviar desenhos para o seu agente de programação

Em vez de transferir um ficheiro, pode entregar um desenho diretamente a um assistente de codificação de IA. Clique em Send to your coding agent na barra de ferramentas — ou abra o diálogo de exportação e escolha a mesma opção — para copiar um prompt pronto a colar para o seu agente:
O seu agente lê estes ecrãs via MCP e constrói-os no seu repositório. Cole este prompt no Claude, Cursor ou no seu agente preferido.
O prompt diz ao seu agente para buscar os ecrãs através do servidor MCP do Flowstep e reconstruí-los na sua base de código. Pode entregar um único ecrã, vários ecrãs selecionados ou um ficheiro inteiro de uma só vez — o prompt adapta-se ao que selecionou. Isto utiliza o servidor MCP do Flowstep, pelo que tem de conectar um cliente MCP primeiro. Veja a descrição geral do servidor MCP para os clientes suportados e o Guia de Iniciação para conectar um.
Se precisar de levar o seu desenho para um fluxo de trabalho de edição vetorial, copie-o diretamente para o Figma. Veja Copiar desenhos do Flowstep para o Figma instantaneamente.