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

# Mikä on Flowstep?

> Flowstep on tekoäly-suunnittelutyökalu, joka generoi kiilloitettuja käyttöliittymänäyttöjä tekstikehötteista. Lue, mitä se tekee, kenelle se on tarkoitettu ja mitä sillä voit rakentaa.

<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 />

Kuvaile näyttöä, jonka haluat saada, ja saat suunnitellun käyttöliittymän takaisin sekunneissa.

Kehittäjille se on nopein tapa määritellä käyttöliittymä ennen koodaamista. Tuotejohtajille ja perustajille se on tapa kommunikoida tuoteideoita ilman epäselvyyksiä. Suunnittelijoille se on lähtökohta, joka ohittaa tyhjän kanvaasin.

## Mitä voit tehdä Flowstepin avulla

* **Generoi näyttöjä tekstistä** — kuvaile mitä haluat, saat suunnitellun käyttöliittymän sekunneissa
* **Iteroi kehotteilla tai suoraksi muokkauksella** — hioi asettelua, tekstiä ja tyyliä jättämättä kanvaasia
* **Katsele vuorovaikutteisena prototyyppinä** — Flowstep linkittää näyttösi napsautettavaksi virtaukseksi automaattisesti. Katso [Prototyypit](/fi/prototypes).
* **Yhdistä IDE:hen MCP:n kautta** — generoi ja muokkaa näyttöjä Cursorista, Claude Codesta, Windsurfista tai Claude Desktopista. Katso [MCP Server](/fi/mcp/overview).
* **Vie Figmaan, koodiksi tai kuvatiedostoiksi** — liitä suoraan olemassa olevaan Figma-tiedostoon, vie koodi tai lataa näyttöjä PNG/JPG-muodossa
* **Jaa yhdellä linkillä** — arvioijat eivät tarvitse Flowstep-tiliä tarkastellakseen tai kommentoidakseen

## Kenelle Flowstep on tarkoitettu

* **Kehittäjät**, jotka rakentavat tuotteen käyttöliittymää ilman kutsuttavaa suunnittelijaa, tai jotka haluavat määritellä näyttöä visuaalisesti ennen sen toteuttamista
* **Tuotejohtajat ja perustajat**, jotka kommunikoivat ideoita visuaalisesti tai validoivat ideaa
* **Suunnittelijat**, jotka ohittavat tyhjän kanvaasin — aloita generoidusta asettelusta ja muokkaa sieltä

<Note>
  Suunnittelukokemusta ei vaadita. Jos pystyt kuvailemaan näyttöä selkeässä englannissa, Flowstep voi generoida sen.
</Note>

## Mihin mennä seuraavaksi

<CardGroup cols={2}>
  <Card title="Pika-aloitus" icon="rocket" href="/fi/getting-started">
    Generoi ensimmäinen näyttösi alle viidessä minuutissa.
  </Card>

  <Card title="MCP Server" icon="terminal" href="/fi/mcp/overview">
    Käytä Flowstepia Cursorista, Claude Codesta tai mistä tahansa MCP-yhteensopivasta asiakkaasta.
  </Card>

  <Card title="Suunnitelmien generointi" icon="wand-magic-sparkles" href="/fi/generating-designs">
    Kuinka kirjoittaa kehotteita, jotka tuottavat näyttöjä, joita todella haluat.
  </Card>

  <Card title="Figma-integraatio" icon="figma" href="/fi/figma-integration">
    Liitä Flowstep-suunnitelmat olemassa olevaan Figma-tiedostoon yhdellä pikakäskyllä.
  </Card>
</CardGroup>