> ## 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.

# Flowstep MCP — claude.ai

> Ligar Flowstep a claude.ai utilizando um conector MCP personalizado.

Claude.ai suporta conectores MCP personalizados através do painel de integrações.

## Adicionar o conector

<Steps>
  <Step title="Abrir integrações">
    Aceda a **claude.ai → Settings → Integrations**.
  </Step>

  <Step title="Adicionar um conector personalizado">
    Clique em **Add More** (ou **Custom Connector**) e introduza:

    ```
    https://api.flowstep.ai/mcp
    ```
  </Step>

  <Step title="Autenticar">
    Claude.ai redireciona o seu navegador para `https://api.flowstep.ai/oauth/authorize`. Inicie sessão com a sua conta Flowstep (correio eletrónico/palavra-passe ou Google SSO). A página redireciona-o de volta para claude.ai automaticamente.
  </Step>

  <Step title="Ativar o conector">
    De volta em Integrations, confirme que o conector Flowstep aparece como ligado. Ative-o para as conversas em que pretende utilizá-lo.
  </Step>
</Steps>

<Note>
  Precisa de uma conta Flowstep existente para autenticar. Se não tem uma, crie-a em [app.flowstep.ai](https://app.flowstep.ai) primeiro e depois volte aqui para completar a configuração do conector.
</Note>

## Verificar a ligação

Numa conversação de claude.ai com o conector Flowstep ativado:

```
List my Flowstep files
```

## Utilização

Depois de ligado, descreva o que pretende em linguagem natural:

```
Create a Flowstep file called "Checkout flow" and generate a three-step checkout screen
for an e-commerce app: cart review, address entry, and payment. Show me each screen.
```

Claude chamará as ferramentas Flowstep em sequência e apresentará as imagens processadas em linha.