Hopp til hovedinnhold
Flowstep er designlerretet for programvare bygget av agenter. Flowstep MCP-serveren eksponerer dette lerretet via Model Context Protocol, slik at agentene teamet ditt allerede bruker, kan designe skjermer, se på det gjengitte resultatet og bygge ut fra det — uten å forlate editoren eller terminalen. Skjermer en agent oppretter over MCP, havner i de samme Flowstep-filene som teamet ditt jobber i. De forblir redigerbare på lerretet, kan deles, og er klare til å eksporteres eller kopieres til Figma. Serveren er hostet på https://api.flowstep.ai/mcp (Streamable HTTP-transport). Du trenger ingen lokal prosess å kjøre og ingen API-nøkkel å administrere. Klientene logger inn med Flowstep-kontoen din via OAuth.

​
Hva du kan gjøre

Serveren eksponerer 22 verktøy i åtte kategorier: De tre AI-design-verktøyene bruker den samme meldingskvoten som Flowstep-appen. Alle andre verktøy er gratis. Se Bruksgrenser.

​
Vanlige bruksområder

Generer skjermer fra en prompt — kall ai-design-screens med en beskrivelse. Utelat fileId, så oppretter Flowstep filen og skjermene i ett steg. Kall get-screen-image for hver returnerte screenId for å se resultatet inline. Visualiser en React-komponent — last opp kildekoden din i .jsx eller .tsx med upload-attachment (mimeType: text/javascript), og send deretter vedlegget inn i ai-design-screens med en melding som beskriver skjermen. Flowstep leser kildekoden og genererer et tilsvarende design. Forbedre et design — kall ai-design-screens med én eller flere screenId-er (eller enkelte element-ID-er) i elementIds og frie instruksjoner for å endre dem på stedet. Samme kall kan også legge til nye skjermer, så én forespørsel kan redigere én skjerm og bygge den neste. Bruk ai-edit-screen-variant for å bruke en forhåndsinnstilling, for eksempel et mørkt tema eller et annet oppsett, på én hel skjerm. Utvid en flyt — kall ai-generate-screen-variant for å legge til neste skjerm, en feil- eller tomtilstand, eller en web-, nettbrett- eller mobilversjon av en eksisterende skjerm. Arbeid kodefirst — les en hvilken som helst skjerm som JSX med get-screen-jsx, og skriv deretter din egen JSX tilbake med add-screen-jsx (ny skjerm) eller replace-screen-jsx (overskriver en eksisterende). Hvis du vil bruke egne bilder, laster du dem opp med upload-attachment og legger den returnerte assetUrl-en i JSX-en din. Disse verktøyene er gratis. Hold resultatet i tråd med merkevaren — bruk update-design-guidelines for å lagre farger, typografi og komponentregler på en fil som DESIGN.md-tekst. AI-genereringer mot den filen følger dem. Les dem tilbake med get-design-guidelines, eller slett dem med delete-design-guidelines. Importer fra Figma — kall import-figma med en Figma-rammelenke og en fileId for å hente rammen inn på lerretet som redigerbare elementer. Organisasjonen som eier filen, må først ha Figma koblet til. Sjekk kvoten din — kall get-plan-details for å se abonnementet, bruken og gjenværende meldinger før en serie med genereringer.

​
Endepunkt

Transport: Streamable HTTP. Sesjonsmodell: statsløs (hver forespørsel er uavhengig, uten sesjons-ID). Serveren støtter MCP-protokollversjon 2026-07-28, som den annonserer på https://api.flowstep.ai/.well-known/mcp.json. Klienter på den tidligere protokollversjonen 2025-11-25 kobler seg til det samme endepunktet.

​
Neste steg

Hurtigstart

Koble til en klient og kjør ditt første verktøykall.

Autentisering

Hvordan innlogging og godkjenning med OAuth 2.1 PKCE fungerer.

Verktøy

Fullstendig referanse for inndata og utdata for alle 22 verktøy.

Eksempler

Ende-til-ende-arbeidsflyter for vanlige oppgaver.