Fà a Mód Concept
Sito concept che ho progettato e sviluppato per una bottega artigiana di Modena.
La storia
Fà a Mód in dialetto modenese significa "alla maniera di Modena", e quella frase dice tutto sulla bottega. Prima di scrivere codice ho passato del tempo ad assorbirne l'identità: il nome, il cibo, la sensazione di un posto che fa le cose in modo tradizionale e ci crede davvero. Il risultato è il tipo di sito che potrebbe andare online quasi senza modifiche.
La tradizione, presentata come oggi
Il loro Instagram mostrava un equilibrio chiaro: da una parte la tradizione gastronomica modenese, dall'altra un'estetica pulita, minimale, in bianco e nero. Il sito doveva tenere insieme tutte e due, caldo e radicato ma elegante e tranquillo, con il cibo e il vino al centro. L'ho messo per iscritto come design system prima di tutto: l'identità, chi visita e perché, i colori e la tipografia, prima di qualsiasi riga di codice.
- #FAFAFAbianco panna, più morbido del bianco puro, come un menù stampato
- #1A1A1Anero antracite, per il testo: contrasto senza la durezza del nero
- #D4AF37oro opaco, per prezzi, badge e dettagli: il colore della pasta all'uovo e dei tortellini
- #F3EFE8carta calda, per le sezioni alternate
- titoli e nomi dei piatti: classico, editoriale
- Cormorant Garamond
- testo e bottoni: pulito, per bilanciare il serif
- Jost
- piccole etichette
- DM Mono
Pensato per il link in bio
La maggior parte delle visite arriva dal link su Instagram, da telefono, cercando una di tre cose: il menù, un tavolo, l'indirizzo. Quindi il sito è mobile first, e il bottone per prenotare non lascia mai lo schermo. I menù sono testo vero, non un PDF da scaricare, divisi in schede per aperitivo, pranzo, cena e vini, e i prezzi sono numeri secchi, allineati a destra, come nelle loro storie.
Una bottega raccontata scorrendo
La pagina è costruita come una storia da scorrere più che come una pila di riquadri. Le sezioni si fermano al loro posto e la successiva ci scivola sopra, una barra sottile segna a che punto sei, e tutta la pagina scorre in modo fluido.
- 1
Il benvenuto
Un hero a tutta pagina che resta fermo mentre la sezione successiva ci sale sopra.
- 2
Il manifesto
Una frase su cosa vuol dire mangiare bene a Modena, rivelata parola per parola mentre scorri, con qualche parola che si accende d'oro.
- 3
Chi siamo
La bottega e le persone dietro, accanto a un'immagine che resta ferma e si muove piano mentre leggi.
- 4
I menù
I quattro menù a schede, poi come prenotare e dove trovarli.
Galleria
Vuoi qualcosa del genere?
Posso costruire la stessa cosa per il tuo prodotto.
Raccontami cosa hai in mente. Ricevi una risposta in giornata, con uno scope e dei tempi realistici, non una proposta di vendita.