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

# Esikatsele Flowstep-suunnitelmia interaktiivisina prototyyppeinä

> Avaa mikä tahansa Flowstep-tiedosto napsautettavaksi prototyyppiksi — Flowstep linkittää näyttösi automaattisesti, ja voit asettaa tai lukita navigoinnin manuaalisesti elementtiä kohti.

Flowstep voi muuttaa tiedoston näyttöjä napsautettavaksi prototyyppiksi. Napsauta **Preview** (esikatselu) editorin työkalupalkissa ja Flowstep avaa koko sivun prototyypin soittimen, jossa voit napsauttaa kulkuasi läpi — hyödyllistä käyttäjän matkan testaamiseen tai esittämiseen sidosryhmille.

## Avaa prototyyppi

<Steps>
  <Step title="Napsauta Preview">
    Napsauta editorin työkalupalkissa **Preview**. Prototyypin soitin avautuu koko sivun näkymänä, erillään editorista.
  </Step>

  <Step title="Anna Flowstepin linkittää näyttösi">
    Jos tiedostossasi on kaksi tai useampia näyttöjä, Flowstep linkittää automaattisesti interaktiivisia elementtejä — painikkeita, kortteja, valikon kohteita — niiden kohdenäyttöihin kun avaat esikatselun (näet "Bringing your screens to life" -tekstin samalla kun se toimii). Linkit luodaan uudelleen vain silloin, kun näyttösi ovat muuttuneet edellisen ajon jälkeen.
  </Step>

  <Step title="Napsauta läpi kulkuasi">
    Napsauta mitä tahansa linkitettyä elementtiä — painiketta, korttia, valikon kohdetta — siirtyäksesi sen kohdenäyttöön. Sivupalkissa näkyvät kaikki tiedoston näytöt, joten voit hypätä mihin tahansa suoraan. **Back to editor** palauttaa sinut tiedostoon.
  </Step>
</Steps>

<Note>
  Automaattinen linkitys vaatii vähintään kaksi näyttöä tiedostossa. Jos linkkien luominen epäonnistuu, käytä soittimessa **Retry**-painiketta.
</Note>

## Aseta navigointi manuaalisesti

Voit määrittää tarkalleen, mihin elementti navigoi:

1. Valitse elementti editorissa (esimerkiksi painike).
2. Avaa oikeanpuoleisen omaisuuspaneelin **Navigation**-paneeli.
3. Valitse kohdenäyttö avattavasta luettelosta — tai valitse **No navigation** poistaaksesi linkin.

Estääksesi Flowstepin automaattisen linkityksen ylikirjoittamasta omaa linkkiäsi, napsauta **Lock link** Navigation-paneelissa. Lukitut linkit jätetään koskemattomiksi linkkejä luotaessa uudelleen.

## Interaktiivinen säädöt

Prototyyppi ei ole vain napsautettava navigointi — näyttöjen ohjaimet reagoivat esikatselussa. Käännä kytkin, valitse valintaruutu, valitse radiovalinta, valitse avattavasta luettelosta, vaihda välilehteä, kirjoita kenttään tai lisää laskuria, ja näyttö päivittyy reaaliajassa uuden tilan heijastamiseksi.

Tiedoston näytöt jakavat yhden prototyypin tilan esikatselu-istunnon aikana, joten tekemäsi muutos yhdellä näytöllä siirtää kun napsautat toisiin. Voit myös vaihtaa näyttöä vaalea- ja pimeän ulkoasun välillä nähdäksesi miten se reagoi.

<Note>
  Interaktiivinen käyttäytyminen luodaan automaattisesti näytöistäsi — ei ole mitään johdotettavaa. Esikatsele tiedostoa kokeillaksesi.
</Note>