Riferimento degli strumenti MCP

Tutti gli strumenti restituiscono un array content di blocchi di contenuto MCP. Gli strumenti di testo restituiscono { type: "text", text: "<json-string>" }. Gli strumenti di immagine restituiscono { type: "image", data: "<base64>", mimeType: "image/png" }. In caso di errore, isError: true è impostato e il blocco di testo contiene il messaggio di errore.

Strumenti file

`list-files`

Elenca i file Flowstep per l’utente corrente. Input

Parametro	Tipo	Predefinito	Descrizione
`orderByCreation`	`boolean`	`true`	Ordina per data di creazione
`limit`	`integer` (1–100)	`20`	Numero di file da restituire
`offset`	`integer` (≥0)	`0`	Offset di paginazione

Output — Array JSON di oggetti file.

[
  {
    "id": "5c2170f0-5b09-4a5a-ba7a-4d5c2cfb07e0",
    "name": "Dashboard redesign",
    "created_at": "2026-04-30T15:02:13.120152+00:00",
    "updated_at": "2026-04-30T15:02:13.120152+00:00",
    "owner": true,
    "url": "https://app.flowstep.ai/file?activeFileId=5c2170f0-5b09-4a5a-ba7a-4d5c2cfb07e0"
  }
]

`get-file`

Ottieni un singolo file per ID. Il contenuto del file è intenzionalmente omesso — usa get-screen o get-screen-image per ispezionare le schermate, e get-design-guidelines per recuperare le linee guida allegate. Input

Parametro	Tipo	Descrizione
`id`	`uuid`	ID file

Output — Oggetto file JSON.

{
  "file": {
    "id": "5c2170f0-5b09-4a5a-ba7a-4d5c2cfb07e0",
    "name": "Dashboard redesign",
    "project_id": "81cb84d6-c69f-492c-a895-7421b60d1a6d",
    "created_at": "2026-04-30T15:02:13.120152+00:00",
    "updated_at": "2026-04-30T15:02:13.120152+00:00",
    "access_level": "private",
    "owner": true,
    "url": "https://app.flowstep.ai/file?activeFileId=5c2170f0-5b09-4a5a-ba7a-4d5c2cfb07e0"
  },
  "user_access_level": "write"
}

`create-file`

Crea un nuovo file Flowstep. Input

Parametro	Tipo	Descrizione
`title`	`string` (min 1)	Nome del file

Output — Oggetto file JSON con l’id del nuovo file.

{
  "id": "5c2170f0-5b09-4a5a-ba7a-4d5c2cfb07e0",
  "name": "Dashboard redesign",
  "project_id": "81cb84d6-c69f-492c-a895-7421b60d1a6d",
  "created_at": "2026-04-30T15:02:13.120152+00:00",
  "updated_at": "2026-04-30T15:02:13.120152+00:00",
  "access_level": "private",
  "user_access_level": "write",
  "owner": true,
  "url": "https://app.flowstep.ai/file?activeFileId=5c2170f0-5b09-4a5a-ba7a-4d5c2cfb07e0"
}

Usa l’id restituito come fileId nelle successive chiamate di strumento.

`update-file`

Rinomina un file. Input

Parametro	Tipo	Descrizione
`id`	`uuid`	ID del file
`name`	`string` (min 1)	Nuovo nome

Output — Oggetto file aggiornato nella stessa forma di get-file.

{
  "file": {
    "id": "5c2170f0-5b09-4a5a-ba7a-4d5c2cfb07e0",
    "name": "Dashboard redesign (v2)",
    "project_id": "81cb84d6-c69f-492c-a895-7421b60d1a6d",
    "created_at": "2026-04-30T15:02:13.120152+00:00",
    "updated_at": "2026-04-30T15:02:13.120152+00:00",
    "access_level": "private",
    "owner": true,
    "url": "https://app.flowstep.ai/file?activeFileId=5c2170f0-5b09-4a5a-ba7a-4d5c2cfb07e0"
  },
  "user_access_level": "write"
}

`delete-file`

Elimina definitivamente un file. Il name che trasmetti viene verificato rispetto al nome effettivo del file prima dell’eliminazione — se non corrisponde, l’eliminazione viene interrotta. Questo previene l’eliminazione accidentale del file sbagliato. Input

Parametro	Tipo	Descrizione
`id`	`uuid`	ID del file
`name`	`string`	Nome corrente del file — deve corrispondere esattamente o l’eliminazione viene interrotta

Output — "File deleted successfully"

Questo è irreversibile. Tutte le schermate nel file vengono eliminate.

Strumenti schermata

`list-screens`

Elenca tutte le schermate generate per un file. Usa i valori screenId restituiti per fare riferimento alle schermate in get-screen, get-screen-image, e come targets in edit-design, regenerate-design o expand-design. Input

Parametro	Tipo	Descrizione
`fileId`	`uuid`	ID del file

Output — Array JSON di riepiloghi di schermate.

[
  {
    "screenId": "3f9e6eb6-5525-4383-9375-67e0bd762dbe",
    "name": "Mobile login screen",
    "fidelity": "ui",
    "prompt": "Generate a simple mobile login screen with email and password fields and a sign in button",
    "createdAt": "2026-04-30T15:02:37.444139+00:00"
  }
]

name è il nome della schermata assegnato dall’utente, o null se senza nome.

`get-screen`

Ottieni il codice JSX per una schermata consentendoti di modificarlo o usare il codice al di fuori di Flowstep. Usa get-screen-image per un’anteprima visiva invece. Input

Parametro	Tipo	Descrizione
`fileId`	`uuid`	ID del file
`screenId`	`uuid`	Lo `screenId` restituito da `list-screens` o dall’array `screenIds` restituito da uno strumento di design

Output — La schermata come codice (JSX). Nota il commento della prima riga che è richiesto quando usi lo strumento add-screen.

<!-- screenType: "iphone-x-vertical" width: "375" height: "812" name: "Change to a light theme" colorTheme: "blue" screenId: "c13d3707-0efe-49f5-b6cb-0ca5ac5223d0" -->
<div className="bg-white text-zinc-950 w-full h-fit">
  <div className="flex p-6 flex-col gap-6">
    <div className="flex pt-4 justify-between items-center">
      <ArrowLeft className="size-5 text-[#71717b]" />
      <span className="font-semibold text-zinc-950 text-lg leading-7">
        World Clock
      </span>
      <Plus className="size-5 text-[#2b7fff]" />
    </div>
    <div className="rounded-xl bg-zinc-100 flex p-2 items-center gap-2">
      <Search className="size-4 text-[#71717b] ml-2" />
      <span className="text-[#71717b] text-sm leading-5">Search cities...</span>
    </div>
...
    <div className="flex pt-2 pb-4 justify-center items-center gap-4">
      <Button variant="outline" className="rounded-full px-6 gap-2">
        <Clock className="size-4" />
        <span>Compare</span>
      </Button>
      <Button className="rounded-full bg-[#2b7fff] text-blue-50 px-6 gap-2">
        <Bell className="size-4" />
        <span>Set Alert</span>
      </Button>
    </div>
  </div>
</div>;

`add-screen`

Aggiunge una nuova schermata a un file Flowstep da una stringa JSX non elaborata. Input

Parametro	Tipo	Descrizione
`fileId`	`uuid`	ID del file
`jsxContent`	`string`	JSX da aggiungere al file come schermata
`screenType`	`string`	Obbligatorio se il tipo di schermata non è definito come commento all’inizio del JSX

Nota - Un commento simile a quello di seguito DEVE essere presente come prima riga del JSX poiché viene utilizzato per aggiungere correttamente la schermata. screenType, name e screenId sono tutti facoltativi — screenId viene utilizzato (internamente) se presente (ad esempio, quando si passa JSX copiato dall’output di get-screen), ma non è obbligatorio. Il nome della schermata è preso dal campo name del commento (visualizzato come “Copy of <name>”), o “Untitled” se assente.  Output — L’ID della schermata appena aggiunta.

{ "screenId": "3f9e6eb6-5525-4383-9375-67e0bd762dbf" }

`get-screen-image`

Renderizza una schermata in PNG e restituiscila come un’immagine in linea. Richiede un client che supporta blocchi di contenuto di immagine. Input

Parametro	Tipo	Descrizione
`fileId`	`uuid`	ID del file
`screenId`	`uuid`	Lo `screenId` restituito da `list-screens` o dall’array `screenIds` restituito da uno strumento di design

Output — Blocco di contenuto di immagine MCP (image/png).

`rename-screen`

Rinomina l’etichetta della tela di una schermata — il nome mostrato da list-screens e nell’editor. Questo cambia solo l’etichetta, non il layout, la dimensione o il contenuto della schermata — usa edit-design per quelli. Input

Parametro	Tipo	Descrizione
`fileId`	`uuid`	ID del file
`screenId`	`uuid`	Lo `screenId` restituito da `list-screens`
`name`	`string` (1–100 chars)	Nuovo nome della schermata. Lo spazio bianco iniziale e finale viene ritagliato

Output — { screenId, name }.

{ "screenId": "3f9e6eb6-5525-4383-9375-67e0bd762dbe", "name": "Checkout — empty cart" }

Strumenti IA

regenerate-design, expand-design e edit-design richiedono il contesto di design che è presente solo sulle schermate originariamente generate con un array designs. Le schermate generate senza contesto di design restituiranno un errore.

`create-new-design`

Genera uno o più design di schermate da un prompt di testo. Ometti fileId per creare automaticamente un nuovo file. Blocca fino al completamento della generazione o al timeout (180 secondi). Input

Parametro	Tipo	Predefinito	Descrizione
`fileId`	`uuid`	—	File di destinazione — ometti per creare automaticamente un nuovo file. Obbligatorio quando `targets` è impostato
`message`	`string`	—	Prompt che descrive le schermate da generare
`targets`	`uuid[]`	`[]`	Riferimenti visivi opzionali — `screenId`s da `list-screens` e/o ID di sottoelementi da `get-screen`. Le schermate referenziate vengono utilizzate solo come ispirazione visiva; non vengono modificate in posizione
`attachments`	`AttachmentRequestData[]` (max 5)	`[]`	Allegati pre-caricati — immagini, PDF o file di codice. Carica sempre tramite `upload-attachment` prima; non inline il contenuto del file nel messaggio
`designs`	`DesignRequestData[]`	`[]`	Riferimenti di design

Output — { fileId, screenIds, designGuidelinesUpdated }. Passa ogni screenId a get-screen-image per visualizzare i risultati. designGuidelinesUpdated riporta se le linee guida di design del file sono state modificate come parte di questa generazione.

{
  "fileId": "5c2170f0-5b09-4a5a-ba7a-4d5c2cfb07e0",
  "screenIds": ["3f9e6eb6-5525-4383-9375-67e0bd762dbe"],
  "designGuidelinesUpdated": false
}

`regenerate-design`

Rifare schermate esistenti da zero o con una variazione di stile. Richiede almeno uno screenId in targets. Blocca fino al completamento della generazione o al timeout (180 secondi). Input

Parametro	Tipo	Predefinito	Descrizione
`fileId`	`uuid`	—	File di destinazione
`message`	`string`	—	Testo del prompt
`targets`	`uuid[]` (min 1)	—	screenIds delle schermate da rigenerare
`operationVariant`	`"different_layout" \| "different_style" \| "from_scratch"`	—	Obbligatorio — come rifare la schermata: `different_layout` (mantieni lo stile e il contenuto, cambia il layout), `different_style` (mantieni il layout e il contenuto, cambia colori e trattamento visivo), o `from_scratch` (nuovo layout, stile e contenuto per lo stesso scopo)
`designs`	`DesignRequestData[]`	`[]`	Riferimenti di design (risolti automaticamente)

Output — { fileId, screenIds, designGuidelinesUpdated }. Passa ogni screenId a get-screen-image per visualizzare i risultati.

`expand-design`

Aggiungi schermate di follow-on a un design esistente. Richiede almeno uno screenId in targets e un operationVariant obbligatorio. Blocca fino al completamento della generazione o al timeout (180 secondi). Input

Parametro	Tipo	Predefinito	Descrizione
`fileId`	`uuid`	—	File di destinazione
`message`	`string`	—	Testo del prompt
`targets`	`uuid[]` (min 1)	—	screenIds delle schermate da espandere
`operationVariant`	`"next_screen" \| "error_state" \| "empty_state" \| "web_version" \| "mobile_version" \| "tablet_version" \| "mobile_ios_version" \| "mobile_android_version"`	—	Obbligatorio — tipo di schermata di follow-on da generare
`designs`	`DesignRequestData[]`	`[]`	Riferimenti di design (risolti automaticamente)

Output — { fileId, screenIds, designGuidelinesUpdated }. Passa ogni screenId a get-screen-image per visualizzare i risultati.

`edit-design`

Modifica schermate esistenti tramite un prompt. Richiede almeno uno screenId in targets. Blocca fino al completamento della generazione o al timeout (180 secondi). Input

Parametro	Tipo	Predefinito	Descrizione
`fileId`	`uuid`	—	File di destinazione
`message`	`string`	—	Istruzioni che descrivono le modifiche da applicare
`targets`	`uuid[]` (min 1)	—	screenIds delle schermate da modificare
`operationVariant`	`"dark_theme" \| "light_theme" \| "make_pretty"`	—	Scorciatoia di stile facoltativa
`attachments`	`AttachmentRequestData[]` (max 5)	`[]`	Allegati pre-caricati. Carica sempre tramite `upload-attachment` prima
`designs`	`DesignRequestData[]`	`[]`	Riferimenti di design (risolti automaticamente)

Output — { fileId, screenIds, designGuidelinesUpdated }. Passa ogni screenId a get-screen-image per visualizzare i risultati.

`upload-attachment`

Carica un file per usarlo come allegato in create-new-design o edit-design (non regenerate-design o expand-design). I byte del file non passano mai attraverso il modello, e il server non recupera mai gli URL per conto tuo. Ci sono due modalità — usa esattamente una, e non combinarle. Modalità A — file e immagini (mimeType + fileName) Un flusso richiesto in tre fasi per qualsiasi immagine, PDF o file di testo più grande:

Chiama upload-attachment con mimeType e fileName solo (ad esempio image/png e dog.png). La risposta è un caricamento preparato, non un file memorizzato:

{
  "id": "a1b2c3d4-e5f6-7890-abcd-ef1234567890",
  "path": "attachments/a1b2c3d4-e5f6-7890-abcd-ef1234567890",
  "type": "image",
  "mimeType": "image/png",
  "signedUrl": "https://…",
  "uploadCommand": "curl -sS -f -X PUT '…' -H 'Content-Type: image/png' -H 'x-metadata: …' --data-binary @LOCAL_FILE_PATH",
  "nextStep": "…"
}

Sostituisci LOCAL_FILE_PATH in uploadCommand con il percorso assoluto del tuo file ed esegui quel comando esatto nella tua shell — deve uscire 0. Il token in signedUrl autorizza solo questo singolo caricamento. Saltare questo passaggio lascia lo spazio di archiviazione vuoto e lo strumento di design non supera il controllo preliminare.
Passa solo { id, path, type } nell’array attachments dello strumento di design — non signedUrl, uploadCommand o nextStep.

Per allegare un file remoto, scaricalo tu stesso in un percorso locale (ad esempio con curl), quindi segui gli stessi tre passaggi. Non passare mai un URL a upload-attachment.

Parametro	Tipo	Descrizione
`mimeType`	enum	Tipo MIME del file. Uno di `image/jpeg`, `image/png`, `image/webp`, `application/pdf`, `text/markdown`, `text/plain`, `text/javascript`. Usa `text/javascript` per file `.jsx`, `.tsx`, `.js`, `.ts`
`fileName`	`string` (min 1)	Nome file originale con estensione, ad esempio `cat.png` o `design.md`

Modalità B — testo breve (text + mimeType) Carica testo che è già nel contesto — nessun comando di shell necessario. La risposta è pronta all’uso direttamente:

{
  "id": "a1b2c3d4-e5f6-7890-abcd-ef1234567890",
  "path": "attachments/a1b2c3d4-e5f6-7890-abcd-ef1234567890",
  "type": "document",
  "mimeType": "text/plain"
}

Parametro	Tipo	Descrizione
`text`	`string` (max 64,000 chars)	Contenuto di testo non elaborato. Solo file di testo — non usare per immagini o PDF. Più di 64.000 caratteri? Usa Modalità A invece
`mimeType`	enum	Uno di `text/markdown`, `text/plain`, `text/javascript`

Passa il risultante { id, path, type } nell’array attachments di create-new-design o edit-design. La dimensione massima del file è 3 MB in entrambe le modalità, e i PDF sono limitati a 100 pagine. type è "image" per file di immagine e "document" per PDF e file di testo.

Strumenti di chat

`get-chat-history`

Ottieni la cronologia dei messaggi di chat per un file. Input

Parametro	Tipo	Descrizione
`fileId`	`uuid`	ID del file

Output — Oggetto JSON con un array messages. Ogni messaggio ha un type ("request" o "response"), author ("human" o "ai"), e content_type ("text", "summary" o "followup").

{
  "messages": [
    {
      "id": "453f593d-2380-425b-ba29-127db08d6a8e",
      "chat_id": "146d0f19-497e-450c-ba53-3de15f6bd70b",
      "type": "request",
      "status": "success",
      "content": "Generate a simple mobile login screen with email and password fields",
      "author": "human",
      "content_type": "text",
      "sequence": 1,
      "request_message_id": null,
      "targets": [],
      "attachments": []
    },
    {
      "id": "d860186b-82d5-4bd1-8e8e-8ba5377a14bf",
      "chat_id": "146d0f19-497e-450c-ba53-3de15f6bd70b",
      "type": "response",
      "status": "success",
      "content": "Generated a mobile login screen with email and password input fields, sign in button, remember me checkbox, forgot password link, social login options (Apple/Google), and sign up link.",
      "author": "ai",
      "content_type": "summary",
      "sequence": 7,
      "request_message_id": "453f593d-2380-425b-ba29-127db08d6a8e",
      "targets": [{ "target_id": "3f9e6eb6-5525-4383-9375-67e0bd762dbe" }],
      "attachments": []
    }
  ]
}

Strumenti di design

`get-design-guidelines`

Ottieni le linee guida di design archiviate per un file. Input

Parametro	Tipo	Predefinito	Descrizione
`resourceId`	`uuid`	—	ID del file
`linkedTo`	`"file"`	`"file"`	Tipo di risorsa

Output

{
  "guidelines": "## Colors\n\nPrimary: #6366F1\nBackground: #FFFFFF\n\n## Typography\n\nFont: Inter",
  "linkedTo": "file"
}

guidelines è null se nessuna linea guida è stata impostata.

`update-design-guidelines`

Imposta o sostituisci le linee guida di design per un file. Le linee guida vengono passate come una stringa di testo semplice nel formato design.md di Google — non passare un oggetto o JSON. Il server esegue la convalida morbida e può restituire una sezione Warnings: nella risposta che elenca i problemi (chiavi sconosciute, colori non esadecimali) che sono stati accettati ma potrebbero essere ignorati dall’IA. Presenta questi all’utente. Input

Parametro	Tipo	Predefinito	Descrizione
`resourceId`	`uuid`	—	ID del file
`designGuidelines`	`string` (min 1)	—	Contenuto di testo non elaborato delle linee guida. Deve essere una stringa semplice — non codificata in JSON
`linkedTo`	`"file"`	`"file"`	Tipo di risorsa

Regole di convalida

Il frontmatter deve essere aperto e chiuso correttamente
Le righe del frontmatter devono essere YAML di stile blocco valido
Il corpo Markdown non deve contenere intestazioni di sezione ## duplicate

Output — "Design guidelines updated successfully", facoltativamente seguito da una sezione Warnings:.

`delete-design-guidelines`

Cancella le linee guida di design per un file. Input

Parametro	Tipo	Predefinito	Descrizione
`resourceId`	`uuid`	—	ID del file
`linkedTo`	`"file"`	`"file"`	Tipo di risorsa

Output — "Design guidelines deleted successfully"

Strumenti Figma

`import-figma`

Importa un frame Figma in un file Flowstep come elementi modificabili sulla sua canvas. Re-importare lo stesso frame lo aggiorna in posizione. L’organizzazione del file deve prima avere Figma connesso nelle impostazioni di Flowstep. Input

Parametro	Tipo	Descrizione
`figmaUrl`	`string`	Link a uno specifico frame Figma. In Figma, fai clic destro sul frame e scegli Copy link to selection. Un link a una pagina importa tutti i frame di primo livello su quella pagina (limitato a 20 frame su MCP).
`fileId`	`uuid`	Il file Flowstep in cui importare il frame

Output — { fileId, screenId }. screenId è l’id dell’elemento schermata importato — passalo a get-screen-image per visualizzare il risultato. Quando un URL di pagina importa più frame, screenId è null e frameCount viene restituito invece.

{
  "fileId": "5c2170f0-5b09-4a5a-ba7a-4d5c2cfb07e0",
  "screenId": "3f9e6eb6-5525-4383-9375-67e0bd762dbe"
}

Strumenti di fatturazione

`get-plan-details`

Ottieni il piano dell’utente corrente, lo stato dell’abbonamento e la quota rimanente. Non accetta input. Output

{
  "plan": {
    "name": "Starter",
    "code": "starter",
    "type": "paid"
  },
  "subscription": {
    "isPaid": true,
    "isTrial": false,
    "startDate": "2025-01-01T00:00:00Z",
    "endDate": null,
    "trialDaysRemaining": null
  },
  "limits": {
    "messages": {
      "daily": { "max": 50, "warn": 40 },
      "monthly": { "max": 500, "warn": 400 },
      "unlimited": false
    }
  },
  "usage": {
    "messages": { "daily": 12, "monthly": 87 }
  },
  "remaining": {
    "messages": { "daily": 38, "monthly": 413 }
  }
}

I limiti variano in base al piano. Chiama questo strumento prima di un batch di generazioni per controllare la quota disponibile.

Per iniziare

Usare Flowstep

Team e organizzazioni

Esportazione e integrazioni

Server MCP

Fatturazione e piani

Sicurezza e privacy

Riferimento degli strumenti MCP

Strumenti file

`list-files`

`get-file`

`create-file`

`update-file`

`delete-file`

Strumenti schermata

`list-screens`

`get-screen`

`add-screen`

`get-screen-image`

`rename-screen`

Strumenti IA

`create-new-design`

`regenerate-design`

`expand-design`

`edit-design`

`upload-attachment`

Strumenti di chat

`get-chat-history`

Strumenti di design

`get-design-guidelines`

`update-design-guidelines`

`delete-design-guidelines`

Strumenti Figma

`import-figma`

Strumenti di fatturazione

`get-plan-details`

​Strumenti file

​list-files

​get-file

​create-file

​update-file

​delete-file

​Strumenti schermata

​list-screens

​get-screen

​add-screen

​get-screen-image

​rename-screen

​Strumenti IA

​create-new-design

​regenerate-design

​expand-design

​edit-design

​upload-attachment

​Strumenti di chat

​get-chat-history

​Strumenti di design

​get-design-guidelines

​update-design-guidelines

​delete-design-guidelines

​Strumenti Figma

​import-figma

​Strumenti di fatturazione

​get-plan-details

Strumenti file

`list-files`

`get-file`

`create-file`

`update-file`

`delete-file`

Strumenti schermata

`list-screens`

`get-screen`

`add-screen`

`get-screen-image`

`rename-screen`

Strumenti IA

`create-new-design`

`regenerate-design`

`expand-design`

`edit-design`

`upload-attachment`

Strumenti di chat

`get-chat-history`

Strumenti di design

`get-design-guidelines`

`update-design-guidelines`

`delete-design-guidelines`

Strumenti Figma

`import-figma`

Strumenti di fatturazione

`get-plan-details`