> ## Documentation Index
> Fetch the complete documentation index at: https://docs.flowstep.ai/llms.txt
> Use this file to discover all available pages before exploring further.

# O que é Flowstep?

> Flowstep é uma ferramenta de design impulsionada por IA que gera ecrãs de interface polidos a partir de prompts de texto. Descubra o que faz, para quem é e o que pode construir com ela.

<iframe src="https://www.youtube.com/embed/ziyHZVaSbvQ" title="YouTube video player" frameborder="0" className="w-full aspect-video rounded-xl" allow="accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture; web-share" allowfullscreen />

Descreva o ecrã que pretende, receba uma interface desenhada em segundos.

Para programadores, é a forma mais rápida de especificar uma UI antes de escrever o código. Para PMs e fundadores, é uma forma de comunicar ideias de produtos sem ambiguidade. Para designers, é um ponto de partida que evita a página em branco.

## O que pode fazer com Flowstep

* **Gerar ecrãs a partir de texto** — descreva o que pretende, obtenha uma interface desenhada em segundos
* **Iterar através de prompts ou edições diretas** — refine as disposições, o texto e o estilo sem sair do ecrã
* **Pré-visualizar como protótipo interativo** — Flowstep liga seus ecrãs num fluxo clicável automaticamente. Ver [Protótipos](/pt/prototypes).
* **Ligar ao seu IDE via MCP** — gere e edite ecrãs a partir de Cursor, Claude Code, Windsurf ou Claude Desktop. Ver [MCP Server](/pt/mcp/overview).
* **Exportar para Figma, código ou como ficheiros de imagem** — cole diretamente num ficheiro Figma existente, exporte o código ou transfira ecrãs como PNG/JPG
* **Partilhar com uma ligação** — os revisores não precisam de uma conta Flowstep para ver ou comentar

## Para quem é Flowstep

* **Programadores** que constroem UI de produtos sem um designer disponível, ou que querem especificar um ecrã visualmente antes de o implementar
* **Gestores de produto e fundadores** a comunicar ideias visualmente ou a validar uma ideia
* **Designers** a evitar a página em branco — comece a partir de uma disposição gerada e edite a partir daí

<Note>
  Nenhuma experiência em design necessária. Se conseguir descrever um ecrã em inglês simples, Flowstep consegue gerá-lo.
</Note>

## Para onde ir em seguida

<CardGroup cols={2}>
  <Card title="Início rápido" icon="rocket" href="/pt/getting-started">
    Gere o seu primeiro ecrã em menos de cinco minutos.
  </Card>

  <Card title="MCP Server" icon="terminal" href="/pt/mcp/overview">
    Use Flowstep a partir de Cursor, Claude Code ou qualquer cliente compatível com MCP.
  </Card>

  <Card title="Gerar designs" icon="wand-magic-sparkles" href="/pt/generating-designs">
    Como escrever prompts que produzem os ecrãs que realmente pretende.
  </Card>

  <Card title="Integração Figma" icon="figma" href="/pt/figma-integration">
    Cole designs Flowstep num ficheiro Figma existente com um atalho.
  </Card>
</CardGroup>