Tableo
Il QR code del ristorante non doveva più essere un PDF, ma un canale di vendita.
- Anno
- 2026
- Progettazione
- 9 settimane
- Stack
- React · TypeScript · Vite · Supabase · Vercel
- Product design
- Design mobile
- Sviluppo
- Database
- Pagamento
Prodotto sviluppato da Kayzen Web, servito su un indirizzo di anteprima Vercel in attesa del dominio definitivo.
- apertura del menu dopo la scansione
- < 1 s
- performance Lighthouse
- 91/100
- accessibilità LighthouseSotto la nostra soglia di 95: il punto rilevato sono i contrasti del menu, ricalcati sui colori di ogni ristorante; la loro messa a norma è pianificata al prossimo intervento.
- 87/100
Cosa c'era da risolvere.
Il contesto
Tableo trasforma il QR code sul tavolo di un ristorante in un'interfaccia completa: menu aggiornato, ordinazione, pagamento, raccolta di recensioni e dati di affluenza.
Il vincolo
Il QR code ha una cattiva reputazione dal 2020, perché inizialmente è servito a mostrare un PDF illeggibile. Il prodotto doveva cancellare quel ricordo fin dalla prima schermata mobile, in un contesto sfavorevole: sala rumorosa, una mano sola, rete satura, cliente di fretta.
La risposta
Progettare prima la vista cliente, mai il back-office. Il menu si apre in meno di un secondo, senza installazioni, senza account, e resta leggibile con una mano. La dashboard del ristoratore è arrivata dopo, vincolata dai dati che la vista cliente produce davvero.
I punteggi rilevati alla consegna.
Punteggi Lighthouse del sito in produzione. Li pubblichiamo così come sono: quando uno è basso, la causa e il piano di correzione sono spiegati più sotto invece di essere taciuti.
Ogni scelta di design, e il suo perché.
Pensato per il pollice
Navigazione per categorie fissa in fondo allo schermo, nella zona raggiungibile con il pollice. Aree tattili di almeno 44 px. Il menu di un ristorante si consulta in piedi, con una mano, con un bicchiere nell'altra.
Foto facoltative, mai obbligatorie
Pochi ristoranti hanno foto decenti di tutti i piatti. Il menu resta elegante senza immagini; le foto, quando ci sono, sono un di più e non la struttura della pagina.
Una dashboard leggibile a colpo d'occhio
Il ristoratore consulta la dashboard tra un servizio e l'altro. Tre cifre in alto, il resto più in basso. Nessun grafico che richieda una lettura attenta.
Palette del progetto
Seppia
#7C4A21
Identità, intestazioni
Crema
#FBF7F0
Sfondo del menu
Inchiostro
#1C1917
Testo
Verde ordine
#15803D
Conferma
Sistema tipografico
Titoli
Outfit 700
Testo corrente
Inter 400
I prezzi sono in cifre tabulari allineate a destra: una colonna di prezzi disallineata si legge come un menu tirato via.
Cosa c'è sotto il cofano.
- React
- TypeScript
- Vite
- Supabase
- Vercel
Supabase in tempo reale
Le ordinazioni arrivano in diretta in cucina tramite sottoscrizione in tempo reale. Un aggiornamento periodico avrebbe aggiunto latenza proprio dove si nota di più.
Separazione per locale
Policy di accesso per riga: un ristorante non può strutturalmente leggere i dati di un altro. In un prodotto multi-tenant, questa regola appartiene al database, non al codice applicativo.
Pagamento esternalizzato
Nessun dato di carta transita dal prodotto. Il fornitore di pagamento gestisce l'inserimento e la conformità PCI: è l'unica scelta ragionevole per un team di queste dimensioni.
Come il sito si fa trovare.
La SEO riguarda la vendita del software
Il menu di un ristorante non è fatto per essere indicizzato: cambia ogni giorno e non risponde ad alcuna ricerca. Il posizionamento punta a «logiciel commande à table» (software per ordinare al tavolo), «QR code menu restaurant»: ricerche del ristoratore.
Utilizzabile da tutti.
Da giugno 2025 l'Atto europeo sull'accessibilità (European Accessibility Act) impone l'accessibilità digitale a una larga parte dei servizi online. La affrontiamo in fase di progettazione, non come rimedio a posteriori.
Contrasti rivisti sul menu
I menu dei ristoranti abusano del grigio chiaro su bianco. Tutte le coppie sono sopra 4,5:1, prezzi e indicazioni sugli allergeni compresi, la cui leggibilità non è solo una questione di comfort.
Cosa è stato consegnato.
- Sito del prodotto
- Vista cliente (QR)
- Dashboard del ristoratore
- Prezzi
- Account
Lo svolgimento del progetto.
Vista cliente
Prototipo mobile testato in sala prima di scrivere una riga di back-office.
Back-office
Menu, categorie, disponibilità, orari.
Ordinazione e pagamento
Tempo reale in cucina, fornitore di pagamento.
Analytics
Affluenza, piatti più visti, scontrino medio.
Cosa ci chiedono spesso.
Altri lavori
Conformità GDPR e SaaSKonsent by Kayzen
Un fornitore di banner che verifica i banner è giudice e parte: l'indipendenza era il prodotto.
Sicurezza offensiva e SaaSSentinel by Kayzen
Vendere un prodotto di sicurezza agli ingegneri: ogni affermazione doveva essere dimostrabile.
Dati e servizio meteoMétéo Climat France
358 pagine indicizzabili, una mappa animata su 72 scadenze e nemmeno una riga di framework.
Lo stesso livello di rigore, per il tuo sito.
Audit gratuito del tuo sito attuale, preventivo entro 24 ore e un ragionamento scritto, come quello che hai appena letto. Pagamento in tre rate senza interessi; agevolazioni locali verificate prima della firma.