Menu Cliente

Il menu cliente è la pagina web pubblica su handy.cafe/{your-slug}. I clienti vi accedono scansionando il codice QR sul loro tavolo. Questa pagina descrive il flusso del cliente dall'inizio alla fine, in modo che tu possa spiegarlo al personale e pianificare il tuo lancio.

Struttura URL

Ogni tavolo ha un URL unico del tipo handy.cafe/{cafe-slug}/{table-code}. Il codice QR codifica questo URL più un token a breve termine che dimostra l'autenticità dell'adesivo. Quando il cliente scansiona il QR:

1. Il loro telefono apre l'URL nel browser predefinito.
2. La pagina risolve lo slug e il codice del tavolo tramite l'API cloud.
3. Se il tavolo è out_of_order, la pagina mostra un avviso di indisponibilità.
4. Se il tavolo è idle, la pagina spiega che il personale non ha ancora fatto accomodare il cliente e chiede di chiamare assistenza.
5. Se il tavolo è in_use, la pagina richiede il codice di sicurezza a 6 cifre.

Verifica del Codice di Sicurezza

Il codice di sicurezza assicura che solo il cliente attualmente seduto al tavolo possa effettuare ordini. Impedisce a chi ha visto il QR da una foto o dall'esterno del tuo locale di effettuare ordini fraudolenti.

Dopo che il cliente inserisce il codice:

1. L'API valida il codice rispetto al valore hash memorizzato sul tavolo.
2. Se valido, viene creata una sessione e viene restituito un token.
3. Il token è memorizzato in un cookie (hc_menu_session). Un token Bearer di riserva è anche conservato nella memoria locale del dispositivo. Questo è necessario su iPhone Safari, che potrebbe bloccare i cookie di terze parti in alcune configurazioni.
4. Il cliente viene reindirizzato al menu.

La sessione è valida per 24 ore dall'emissione. Se il cliente chiude il browser e ritorna sullo stesso dispositivo, la sessione funziona ancora e può rientrare senza dover verificare nuovamente.

Lingue

Il menu supporta 24 lingue: arabo, tedesco, greco, inglese, spagnolo, farsi, francese, hindi, indonesiano, italiano, giapponese, coreano, malese, polacco, portoghese, rumeno, russo, tailandese, tagalog, turco, ucraino, urdu, vietnamita e cinese.

Alla prima visita, la pagina ispeziona l'intestazione Accept-Language del browser e sceglie la corrispondenza migliore. Il cliente può cambiare la lingua in qualsiasi momento utilizzando il selettore in cima al menu. La lingua scelta viene ricordata per la sessione.

I nomi dei prodotti, le descrizioni e gli ingredienti non sono tradotti automaticamente; appaiono nella lingua in cui li hai inseriti nell'editor del menu. Le etichette dell'interfaccia utente come "Aggiungi al Carrello", "Checkout" e i messaggi del flusso di pagamento sono completamente localizzati.

Tema

Il menu supporta un tema chiaro e uno scuro. Il predefinito è sensibile al dispositivo: se il sistema operativo del cliente è impostato su modalità scura, il menu si apre in modalità scura. Un interruttore del tema in cima consente al cliente di cambiare.

Intestazione Brandizzata

L'intestazione in cima al menu mostra:

Personalizza questi campi per offrire la migliore impressione ai clienti. I clienti riconoscono il brand quando il menu assomiglia alla segnaletica fisica del tuo locale.

Navigazione del Menu

Il menu è raggruppato per categoria. All'interno di una categoria, i prodotti sono mostrati con una miniatura, nome, breve descrizione e prezzo.

Toccando un prodotto si apre la scheda del prodotto. La scheda mostra:

• La foto completa.
• Descrizione in Markdown.
• Linea degli ingredienti.
• Chip del tempo di preparazione (solo quando Mostra Tempo di Preparazione nel Menu è abilitato).
• Etichetta dell'unità se configurata (ad esempio "250 ml").
• Selettori di varianti per qualsiasi gruppo di varianti collegato al prodotto.
• Stepper della quantità.
• Un pulsante Aggiungi al Carrello.

I gruppi di varianti obbligatori bloccano il pulsante Aggiungi al Carrello finché il cliente non seleziona un'opzione.

Carrello

L'icona del carrello si trova in una posizione fissa in modo che i clienti possano raggiungerla da qualsiasi schermata. Il contenuto del carrello persiste durante la navigazione all'interno del sito; passare dal carrello al menu e viceversa non fa perdere gli articoli.

Il carrello consente al cliente di:

• Regolare la quantità per riga.
• Rimuovere una riga.
• Aggiungere una nota opzionale.
• Fornire un numero di telefono (opzionale).

Il subtotale, l'IVA e il totale sono mostrati in tempo reale.

Effettuare l'Ordine

Il passaggio di Checkout offre uno o due metodi di pagamento a seconda della tua configurazione:

Contanti

Se il pagamento online è disabilitato nelle tue impostazioni, viene mostrato solo Contanti. Il cliente conferma l'ordine e viene inviato immediatamente. Il cliente paga alla cassa quando l'ordine arriva.

Online (Stripe Checkout)

Se il pagamento online è abilitato, Online appare come opzione. Al momento dell'invio:

1. L'ordine viene creato in stato pendente.
2. Viene restituito un client secret di Stripe Checkout.
3. L'interfaccia utente incorporata di Stripe si apre in linea. Il cliente inserisce i dettagli della carta.
4. Al successo dell'autorizzazione, Stripe conferma l'addebito e l'ordine passa a pagato.
5. Il cliente vede la pagina di successo.

I pagamenti falliti o abbandonati lasciano l'ordine in stato pendente. Un secondo tentativo può essere effettuato dalla stessa sessione, oppure il personale può annullare l'ordine dalla dashboard degli Ordini.

Pagina di Successo

Dopo un invio riuscito, il cliente arriva su una pagina di ricevuta che mostra:

• Numero e orario dell'ordine.
• Ogni riga con quantità, varianti e totale della riga.
• Subtotale, IVA e totale complessivo.
• Metodo di pagamento.
• Icona di stato del pagamento (pendente per contanti; pagato per online).
• Un CTA "Effettua un Altro Ordine" che ritorna al menu mantenendo la sessione intatta.
• Un link "Torna al Menu".

Polling dello Stato dell'Ordine

Dopo l'invio, la vista dell'ordine del cliente interroga l'endpoint dello stato per riflettere gli aggiornamenti dalla cucina. Se il tuo personale avanza un articolo da preparazione a pronto, il cliente vede il badge sulla riga aggiornarsi automaticamente entro pochi secondi.

Questo è utile per il ritiro self-service al banco. Il cliente può rilassarsi al tavolo finché il menu non gli comunica che l'ordine è pronto.

Cosa Non Possono Fare i Clienti

• I clienti non possono navigare nel menu senza il codice di sicurezza. Il passaggio di verifica è sempre richiesto.
• I clienti non possono effettuare ordini per tavoli che sono idle o out_of_order.
• I clienti non possono modificare o annullare un ordine dopo che è stato inviato. L'annullamento è un'azione del personale dalla dashboard degli Ordini.

Consigli per un'Esperienza Cliente Pulita

• Stampa adesivi QR con il nome del caffè e un'istruzione chiara come "Scansiona per ordinare. Chiedi al personale il codice." Altrimenti i clienti a volte saltano il passaggio di verifica.
• Mantieni brevi i nomi delle categorie e dei prodotti. I nomi lunghi si avvolgono su mobile e spingono le immagini sotto la piega.
• Carica almeno una foto per prodotto. I menu ricchi di immagini convertono meglio dei menu solo testo.
• Abilita Mostra Tempo di Preparazione nel Menu solo dopo che la tua stima dinamica si è allenata. Per i primi 30 giorni il valore statico potrebbe essere troppo generoso o troppo stretto, e i clienti se ne accorgono.
• Testa l'intero flusso tu stesso da un telefono prima di aprire ai clienti. Scansiona un vero QR, inserisci il codice, effettua un ordine di prova e verifica che l'ordine appaia sulla tua dashboard.