Un buon design per il digital signage parte da un fatto: lo schermo si legge da diversi metri, in un'occhiata, da qualcuno che è lì per altro. Tutto il resto viene da qui. Un messaggio per slide. Testo dimensionato per chi legge più da lontano, non per il monitor del grafico. Contrasto forte. Abbastanza tempo sullo schermo per leggere tutto due volte. Movimento lento, o niente movimento. Niente di importante vicino ai bordi, e un layout fatto per il modo in cui lo schermo è montato.
Qui sotto trovi dodici regole che mettono in pratica tutto questo. Dove un numero aiuta, è indicato come regola pratica, e chiamato così. La prova finale è sempre la stessa: mettiti dove sta chi legge più da lontano e leggi lo schermo.
1. Un messaggio per slide
Un manifesto può contenere un titolo, tre punti elenco e le note in piccolo, perché le persone ci si fermano davanti. Uno schermo di digital signage riceve un'occhiata. Dai a ogni slide un solo compito: questo piatto, questa offerta, questo avviso. Una slide con un titolo, una riga di supporto e un'azione (un prezzo, una data, un codice QR) è già piena.
Una prova rapida: riesci a dire a cosa serve la slide in cinque parole? Se ti serve una frase con una "e" in mezzo, sono due slide. Le slide non costano niente, e una playlist ne contiene quante ne vuoi.
2. Dimensiona il testo per chi legge più lontano
Dimensione dello schermo e dimensione del testo sono la stessa decisione. La regola sulla nostra pagina dell'hardware dice che chi legge più da lontano non dovrebbe stare oltre sei altezze di schermo per il testo grande, e oltre quattro per un menù letto riga per riga. La guida alle dimensioni dello schermo spiega come scegliere lo schermo stesso.
Dato che quella regola si misura in altezze di schermo, anche il testo si può dimensionare come quota dell'altezza dello schermo, qualunque sia la sua grandezza. Una regola pratica coerente con questo:
- Testo letto riga per riga (le voci di un menù, i turni): almeno circa un ventesimo dell'altezza dello schermo. In un design Full HD, alto 1080 pixel, sono caratteri di circa 54 pixel.
- Titoli e prezzi pensati per essere letti da più lontano: circa un decimo dell'altezza dello schermo, cioè circa 108 pixel.
- Niente di importante sotto la dimensione riga per riga. Sullo schermo le note in piccolo non le legge nessuno. Se devono esserci, dagli una slide tutta loro.
Puoi verificarlo senza salire su una scala. Apri la slide a tutto schermo su un laptop da 13 o 14 pollici e siediti all'indietro, a distanza di braccio, circa 70 centimetri. Sono più o meno quattro altezze dello schermo del laptop, la stessa distanza in altezze di schermo di chi legge il menù al bancone. Se devi strizzare gli occhi davanti al laptop, loro li strizzeranno davanti alla parete. Allontanati a circa un metro per la prova delle sei altezze.
3. Scrivi la metà delle parole
Scrivi la slide, poi tagliala a metà. Prima se ne vanno gli aggettivi, poi tutto quello che l'immagine dice già. "Vellutata di zucca, 4,50 €" batte "Prova oggi la nostra deliziosa vellutata di zucca di stagione fatta in casa a soli 4,50 €".
Un testo che deve scorrere è il segno che era troppo lungo. L'unico testo scorrevole che funziona su uno schermo è una riga breve in una banda scorrevole. Per un avviso, l'app Testo centra poche parole in caratteri grandi e le adatta allo schermo, ed è l'impostazione giusta di partenza.
4. Considera le linee guida sul contrasto come un minimo
Le linee guida sull'accessibilità del web chiedono un rapporto di contrasto di almeno 4,5:1 tra il testo normale e il suo sfondo, e di 3:1 per il testo grande (WCAG 1.4.3). Quei valori sono stati scritti per uno schermo a distanza di lettura. Uno schermo a parete aggiunge distanza, riflessi di finestre e lampade, e persone che lo leggono di sbieco. Considerali il minimo che accetti, non l'obiettivo.
In pratica:
- Testo scuro su sfondo chiaro, o testo chiaro su sfondo scuro. Il grigio medio su grigio chiaro è l'errore classico.
- Non mettere mai il testo direttamente su una foto piena di dettagli. Mettilo su una fascia di colore pieno, oppure scurisci la parte della foto che gli sta dietro.
- Non lasciare che sia il colore da solo a portare il significato. Per molte persone con un deficit nella visione dei colori rosso e verde si somigliano, quindi "esaurito" ha bisogno della parola oltre che del rosso.
- Un codice QR va scuro su sfondo chiaro. Lo legge qualsiasi telefono; un codice chiaro su sfondo scuro non lo legge ogni telefono.
5. Scegli chiaro o scuro in base alla stanza
Uno sfondo scuro in un bar o in un ristorante con luci soffuse evita che lo schermo brilli come un'insegna luminosa, ed è per questo che diversi design dell'app Menù digitale sono scuri. Uno sfondo chiaro va bene in un bar luminoso o in un ufficio.
Dietro una vetrina il concorrente è il sole, e lì la luminosità del pannello conta più della sua dimensione o del design. Nessuna combinazione di colori salva una TV poco luminosa sotto la luce diretta. L'articolo sui display professionali e le TV parla della luminosità.
Dove puoi, tieni una sola scelta per tutto il ciclo. Una playlist che salta da slide bianche a slide nere e ritorno fa sfarfallare tutta la stanza.
6. Tieni ogni slide abbastanza da leggerla due volte
Una slide che sparisce mentre qualcuno la sta leggendo è peggio di nessuna slide. Una regola pratica per la durata: leggi la slide ad alta voce con calma, cronometra e raddoppia. Un titolo con un prezzo può venire sugli otto secondi; una pagina di menù molto di più.
Ogni elemento di una playlist ha la sua durata, quindi impostale una per una invece di dare a tutto lo stesso tempo. Le app con più pagine si regolano da sole: il Menù digitale divide il suo tempo tra le pagine oppure dà un numero fisso di secondi a pagina, e l'app PDF gira pagina ogni 5, 7 o 10 secondi.
7. Progetta il ciclo, non solo le slide
Nessuno guarda una playlist dall'inizio. Le persone alzano gli occhi in un momento qualsiasi, guardano finché sono lì e se ne vanno. Da qui due conseguenze.
- Adatta il ciclo a quanto si fermano le persone. Chi è in fila vede una parte del ciclo; chi è in sala d'attesa lo vede tutto, più volte. Un ciclo breve va bene per un bancone; una sala d'attesa ne vuole uno più lungo e più vario.
- La frequenza batte la posizione. Essere primi in un ciclo non significa niente. Se il menù è la cosa più importante, mettilo nel ciclo due volte.
8. Muoviti piano, o non muoverti
Il movimento cattura lo sguardo, ed è proprio per questo che troppo movimento trasforma uno schermo in rumore.
- Usa transizioni lente e pochi tagli. Un video montato con tagli rapidi è fatto per un telefono in mano, non per una parete.
- Niente deve lampeggiare. La linea guida sull'accessibilità dice non più di tre lampi in un secondo (WCAG 2.3.1), perché i lampeggiamenti possono scatenare crisi nelle persone con epilessia fotosensibile. Su una parete pubblica, stanne ben lontano. Perfino l'app Avviso di emergenza, il cui unico compito è attirare l'attenzione, fa pulsare lentamente il suo bordo invece di lampeggiare.
- Non far scorrere paragrafi. L'app Banda scorrevole fa scorrere la sua banda a velocità costante qualunque sia la lunghezza del messaggio, quindi una riga lunga ci mette semplicemente di più a passare. Tieni le righe brevi.
9. Dai per scontato che non ci sia audio
La maggior parte degli schermi in negozi, uffici e sale d'attesa è muta o si trova in un ambiente rumoroso. Un browser poi avvia i video senza audio finché qualcuno non clicca sulla pagina (l'app Android riproduce l'audio senza questo passaggio), e i pannelli di uno schermo diviso non riproducono mai audio. Quindi:
- Imprimi i sottotitoli in qualsiasi video in cui qualcuno parla.
- Scegli video che abbiano senso senza audio: il prodotto in uso, non una persona che parla in camera.
10. Tieni le cose importanti lontane dai bordi
Molte TV ingrandiscono leggermente l'immagine sull'ingresso HDMI e ne tagliano i bordi. Si chiama overscan. Disattivalo nelle impostazioni dell'immagine, dove spesso si chiama Just Scan, Screen Fit, Full Pixel o in modo simile, a seconda della marca. Poi lascia comunque un margine: una regola pratica diffusa è tenere testi e loghi ad almeno il 5% da ogni bordo.
Se su uno schermo gira una banda scorrevole, lascia libera la sua fascia in alto o in basso, perché la banda scorre sopra qualunque cosa sia in riproduzione.
11. Progetta per il modo in cui lo schermo è montato
Verticale e orizzontale sono due tele diverse, non lo stesso design girato su un fianco. Progetta nel formato e nella risoluzione dello schermo: 1920 × 1080 in orizzontale, 1080 × 1920 in verticale. Il Full HD va bene per quasi tutte le stanze. Il 4K costa di più da archiviare, scaricare e decodificare, e a quattro metri una persona non distingue comunque il 4K su un pannello da 55 pollici.
Il verticale va bene per un menù vicino alla porta o accanto alla fila, per un manifesto o per un elenco. L'orizzontale va bene per la maggior parte degli schermi sopra un bancone e per tutto ciò che ha un video. Le app integrate si impaginano in entrambi i casi: ogni design del Menù digitale funziona in verticale, e l'app Zone e schermo diviso ha layout verticali oltre a quelli orizzontali. Fai le immagini nello stesso formato dello schermo, così niente viene tagliato o incorniciato da bande nere.
12. Sii coerente
La coerenza è ciò che fa sembrare una serie di slide un unico posto invece di una pila di volantini.
- Una famiglia di caratteri, due al massimo. Scegline una con lettere aperte e semplici. I pesi sottili e i caratteri calligrafici si sfaldano a distanza.
- Lo stesso colore significa sempre la stessa cosa: i prezzi nel colore del marchio, gli avvisi in un colore che nient'altro usa.
- Il logo sempre nello stesso angolo, oppure solo su alcune slide. Non tutte le slide ne hanno bisogno.
- Imposta le app perché siano coordinate. L'app Menù digitale prende il tuo logo, il colore del marchio e la valuta; le app Orologio e Conto alla rovescia prendono un colore di accento; l'app Testo prende i colori del testo e dello sfondo, e l'app Codice QR prende i colori del codice e del suo sfondo. Cinque minuti su queste impostazioni e le app sembrano parte del tuo design invece di un widget buttato lì.
Provare un design di digital signage prima di montarlo
Prendi la slide di cui sei meno sicuro e falle la prova del laptop. Poi mettila sullo schermo vero e leggila dal fondo della stanza, nell'ora del giorno in cui andrà in onda. L'anteprima della dashboard esegue lo stesso codice del player, quindi quello che approvi è quello che va in onda, ma solo la stanza ti dice qualcosa su riflessi e distanza.
Per cosa mettere sulle slide, guarda l'elenco di idee per contenuti di digital signage. Per i menù digitali in particolare, la guida al design del menù digitale approfondisce gerarchia e foto. La prova gratuita di 21 giorni include tutte le app e tutti i design del Menù digitale, su uno schermo, senza carta.
