Vai al contenuto

Creare uno scenario

Questa guida accompagna passo passo nella creazione di uno scenario completo, dalla pianificazione alla pubblicazione. Per i dettagli sull'interfaccia dell'editor, vedi Interfaccia dello Scenario Editor.

Pianificare prima di costruire

Prima di aprire l'editor, è utile avere chiara la struttura del percorso:

  • Qual è il punto di partenza?
  • Quali sono i punti decisionali chiave?
  • Quali sono i possibili finali?
  • Ci sono percorsi che si ricongiungono o loop?

Uno schema su carta o una mappa mentale aiutano a visualizzare la struttura. Non serve che sia perfetto: lo scenario evolverà durante la creazione, ma partire con un'idea chiara evita di perdersi.

Workflow consigliato

1. Configurare i metadati

Aprire scenario-editor.html nel browser. L'editor si presenta con un nuovo scenario vuoto contenente solo il nodo Start.

Prima di lavorare sui nodi, impostare i metadati cliccando su Settings:

  • Title: il nome che apparirà nell'intestazione del Navigator
  • Description: una breve descrizione (opzionale, utile per ricordare lo scopo)
  • Author: il nome dell'autore (opzionale)

Se lo scenario sarà in una lingua diversa dall'inglese, ad esempio l'italiano, oppure si desidera usare altri testi per le azioni dei tasti, si deve personalizzare anche le UI Labels per tradurre i testi dei pulsanti (Passo al posto di Step, Ricomincia al posto di Step Over, Fine del percorso al posto di End of this path, ecc.).

2. Costruire dal nodo iniziale

Partire dal nodo Start e procedere in profondità:

  1. Selezionare il nodo nella colonna sinistra
  2. Scrivere il contenuto nel blocco Content usando la sintassi Markdown
  3. Aggiungere le scelte nel blocco Choices
  4. Per ogni scelta, selezionare un nodo esistente o crearne uno nuovo con + Create new node

Procedere così per tutti i nodi, ramificando la struttura secondo il piano iniziale.

Convenzioni per gli identificativi

Usare nomi brevi e descrittivi senza spazi: intro, domanda_1, risposta_ok, finale_positivo. Gli identificativi non sono visibili agli utenti ma aiutano a orientarsi nella struttura.

3. Verificare con la mappa

Periodicamente, usare il pulsante Map per visualizzare l'intera struttura. La mappa mostra:

  • Il flusso generale dei percorsi
  • Eventuali nodi orfani (bordo rosso) da collegare o eliminare
  • I nodi terminali (bordo arancione)
  • I loop, evidenziati con collegamenti arancioni

Per i dettagli sul codice colori, vedi Vista mappa.

4. Salvare regolarmente

Non c'è salvataggio automatico. Cliccare Save frequentemente per evitare di perdere il lavoro. Il pulsante genera un file JSON da scaricare.

La barra di stato in basso mostra sempre se ci sono modifiche non salvate.

Gestire i nodi terminali

Un nodo senza scelte è automaticamente un nodo terminale. Nel Navigator, al posto dei pulsanti appare il messaggio "Fine del percorso" e il pulsante per ricominciare.

  • Per creare un terminale: rimuovere tutte le scelte dal nodo
  • Per trasformare un terminale in nodo intermedio: aggiungere almeno una scelta

Gestire i nodi orfani

Un nodo orfano esiste nello scenario ma non è raggiungibile dal nodo iniziale attraverso nessun percorso. L'editor li segnala con l'etichetta "orphan" nella lista e il bordo rosso nella mappa.

I nodi orfani si creano tipicamente quando:

  • Si elimina un nodo che era l'unico collegamento verso altri nodi
  • Si rimuove una scelta che era l'unico percorso verso un nodo

Per risolvere: collegare il nodo aggiungendo una scelta che punta a lui da qualche altro nodo, oppure eliminarlo se non serve più.

Eliminare nodi in sicurezza

Per eliminare un nodo, selezionarlo e cliccare DELETE nel blocco Node.

Attenzione

Eliminando un nodo che ha figli, quei figli possono diventare orfani se non hanno altri collegamenti.

Best practice: eliminare i nodi partendo dalle foglie (nodi terminali) e risalendo verso la radice. In questo modo non si creano orfani accidentalmente.

Creare loop

È possibile creare percorsi che tornano indietro collegando un nodo a uno dei suoi antenati. Nella vista mappa, questi collegamenti sono evidenziati in arancione.

Casi d'uso tipici:

  • Permettere all'utente di rivedere una sezione
  • Creare menu principale a cui tornare
  • Gestire errori con "riprova"
  • Rappresentare strutture repeat ... until (o equivalenti)

Aggiungere risorse

Per allegare documenti, link o video a un nodo, usare il blocco Resources. Per i dettagli sui tipi disponibili e la configurazione, vedi Resources.

Le risorse appaiono nel Navigator come pulsanti sotto il contenuto del nodo.

Risorse locali

Per file locali (PDF, documenti), si consiglia di creare una sottocartella docs/ e usare percorsi relativi come docs/manuale.pdf.

Modificare uno scenario esistente

Per riprendere il lavoro su uno scenario:

  1. Cliccare Open e selezionare il file JSON
  2. Lo scenario si carica con tutti i nodi nella colonna sinistra
  3. Selezionare un nodo per modificarlo
  4. Salvare le modifiche con Save

Dalla creazione alla pubblicazione

Una volta completato lo scenario:

  1. Salvare il file JSON con un nome descrittivo (es. onboarding-nuovi-dipendenti.json)
  2. Copiare il file nella cartella del Navigator
  3. Modificare config.json per puntare al nuovo scenario
  4. Testare aprendo choicemap.html

Per i dettagli sulle opzioni di pubblicazione (intranet, GitHub Pages, embedding), vedi Pubblicazione.