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

# Anteprima dei design di Flowstep come prototipi interattivi

> Apri qualsiasi file di Flowstep come prototipo cliccabile — Flowstep collega automaticamente le tue schermate, e puoi impostare o bloccare la navigazione manualmente per ogni elemento.

Flowstep può trasformare le schermate in un file in un prototipo cliccabile. Fai clic su **Preview** nella barra degli strumenti dell'editor e Flowstep apre un lettore di prototipi a pagina intera dove puoi navigare attraverso il tuo flusso — utile per testare un percorso utente o presentarlo agli stakeholder.

## Apri un prototipo

<Steps>
  <Step title="Fai clic su Preview">
    Nella barra degli strumenti dell'editor, fai clic su **Preview**. Il lettore di prototipi si apre come una vista a pagina intera, separata dall'editor.
  </Step>

  <Step title="Lascia che Flowstep collegi le tue schermate">
    Se il tuo file ha due o più schermate, Flowstep collega automaticamente gli elementi interattivi — pulsanti, card, elementi di menu — alle loro schermate di destinazione quando apri l'anteprima (vedrai "Bringing your screens to life" mentre funziona). I link vengono rigenerati solo quando le tue schermate sono cambiate dall'ultima esecuzione.
  </Step>

  <Step title="Naviga attraverso il tuo flusso">
    Fai clic su qualsiasi elemento collegato — un pulsante, una card, un elemento di menu — per navigare alla sua schermata di destinazione. La barra laterale elenca tutte le schermate nel file così puoi saltare direttamente a una qualsiasi di esse, e **Back to editor** ti riporta al file.
  </Step>
</Steps>

<Note>
  Il collegamento automatico richiede almeno due schermate nel file. Se la generazione di link fallisce, usa il pulsante **Retry** nel lettore.
</Note>

## Imposta la navigazione manualmente

Puoi controllare esattamente dove un elemento naviga:

1. Nell'editor, seleziona l'elemento (ad esempio, un pulsante).
2. Apri il pannello **Navigation** nel pannello delle proprietà a destra.
3. Scegli una schermata di destinazione dal menu a discesa — oppure scegli **No navigation** per rimuovere il link.

Per impedire al collegamento automatico di Flowstep di sovrascrivere un link che hai impostato tu stesso, fai clic su **Lock link** nel pannello Navigation. I link bloccati vengono lasciati intatti quando i link vengono rigenerati.

## Controlli interattivi

Un prototipo non è solo navigazione cliccabile — i controlli sulle tue schermate rispondono mentre visualizzi l'anteprima. Attiva un interruttore, seleziona una casella di controllo, scegli un'opzione del pulsante di selezione, scegli da un menu a discesa, cambia schede, digita in un campo, o incrementa un contatore, e lo schermo si aggiorna in tempo reale per riflettere il nuovo stato.

Le schermate in un file condividono uno stato di prototipo durante una sessione di anteprima, quindi una modifica che fai su una schermata si trasporta quando fai clic sulle altre. Puoi anche cambiare una schermata tra l'aspetto chiaro e scuro per vedere come risponde.

<Note>
  Il comportamento interattivo viene generato automaticamente dalle tue schermate — non c'è nulla da configurare. Visualizza l'anteprima di un file per provarlo.
</Note>
