Albero. Nel preciso istante in cui hai letto questa parola nella tua mente sarà comparsa un’immagine pressoché simile a quella qui sotto.
I più fantasiosi si saranno immaginati un bell’albero fiorito in primavera, oppure un albero dalle calde sfumature autunnali. Le stagioni cambiano e con esse i colori e la percezione di questi. Mi ha sempre affascinato l’idea di più percezioni cromatiche della realtà e Simone questo lo sa bene.

Simone è uno dei miei più cari amici, daltonico dalla nascita e forse mio amico ancora per poco, se si stancherà di esperimenti cromatici e domande poco sensate da parte mia. Molto seccanti per lui ma interessanti per chi, come me, lavora col colore e la psicologia ad esso collegata.
Per quanto l’argomento sia ben poco conosciuto, riducendosi spesso ad uno stereotipo o a battute spiritose (perdonami Simone), il daltonismo, ovvero l’incapacità di distinguere precisamente i colori, è una condizione che riguarda circa 1 uomo su 12 e 1 donna su 200.

Chi avrebbe mai pensato che colorare un paesaggio autunnale all’asilo avrebbe stroncato la carriera di Simone a Risiko? Lui, infatti non vuole mai giocare perché ha difficoltà a distinguere i carri armati colorati.

Cos’è il daltonismo?

Ci sono diversi tipi di daltonismo che si dividono ulteriormente per il livello di gravità. Solo in rarissimi casi le persone affette da daltonismo vedono solo in bianco e nero (Acromatopsia).
In realà, la maggior parte dei soggetti daltonici fatica a distinguere le differenze tra sfumature e livelli di luminosità di determinati colori.

La condizione più comune è la difficoltà nel distinguere tra il verde e il rosso, che si divide in due tipologie: protanopia e deuteranopia.
Le persone affette da Protanopia hanno una ridotta sensibilità alla luce rossa. Le tonalità di rosso, arancione e giallo tendono a diventare verdi e ad apparire meno saturate.
Invece i soggetti affetti da Deuteranopia hanno una ridotta sensibilità alla luce verde, dunque distinguono con difficoltà tonalità blu, gialle, viola, rosse e verdi.

Schema dei diversi tipi di daltonismo

Verso una UX più accessibile a tutti

Il legame tra design e daltonismo è un elemento che ogni designer deve tenere in considerazione quando realizza un progetto, sia offline che online.
Talvolta questa patologia può essere considerato un vero e proprio inconveniente per i progettisti che lavorano in questo campo, poiché la psicologia del colore, è parte integrante di ogni UXD (User eXperience Design) di successo.

Per diventare un bravo UX Designer avrai bisogno di conoscere trucchi e buone pratiche per progettare prodotti digitali accessibili.
Di seguito trovi alcuni consigli da tenere a mente quando sei all’opera, che ti aiuteranno a creare dei siti web adatti anche ai daltonici.

1. Gioca molto sui contrasti tra colori

Le persone affette da Acromatopsia riescono a percepire il contrasto, ovvero la differenza tra il chiaro e lo scuro. Per essere sicuro che il sito sia leggibile, bisogna assicurarsi che i contenuti riescano a differenziarsi dallo sfondo. Banalmente, un testo bianco su sfondo nero può essere la soluzione più indicata.

2. Usa diverse sfumature piuttosto che diversi colori

Questo consiglio va di pari passo con quello precedente.
Usare variazioni dello stesso colore è un ottimo modo per assicurarti che le tue creazioni siano di facile fruizione per i daltonici.

Uno schema monocromatico utilizza diverse sfumature dello stesso colore.
Questa pratica riduce in maniera piuttostoefficace tutti i problemi riguardanti gli schemi cromatici e ci aiuta ad inserire facilmente contrasto nei nostri progetti.
Uno schema monocromatico non deve essere necessariamente bianco e nero, utilizzare varie sfumature di blu può creare un progetto visibilmente piacevole senza ridurre la leggibilità.

3. Sperimenta il daltonismo durante la progettazione

Utilizza le visualizzazioni dei software grafici, come Adobe Photoshop, Sketch o i plugin dei browser, che simulano le diverse forme di visione dei daltonici.
Ci sono diversi strumenti che possono simulare gli effetti del daltonismo, permettendoci di capire come la nostra interfaccia si comporta agli occhi di una persona con questo tipo di problemi.
Photoshop ha un’opzione apposita, raggiungibile semplicemente attraverso il percorso: Visualizza > Imposta prova. Mettersi nei panni dei propri utenti è il modo migliore per capirne le necessità e i problemi. L’empatia ci permette di progettare elementi utili per tutti, senza sacrificare l’estetica del lavoro.

4. Scegli con cautela le combinazioni di colore

Sfortunatamente, come web designer non abbiamo sempre la possibilità di scegliere i colori da utilizzare nei nostri progetti. A volte siamo limitati dalle linee guida dei brand, ma quando possibile è saggio scegliere colori primari e secondari prima di finalizzare l’immagine di un brand.
Ecco alcuni abbinamenti da evitare:

5. Usa texture al posto del colore

Nel progettare grafici e info-grafiche, considera l’utilizzo di texture o pattern per aiutare gli utenti a distinguere i colori. Adesempio, nel grafico qui sotto, i colori sarebbero del tutto irriconoscibili per una persona affetta da Protanopia. Inserendo delle texture, il risultato cambia.

6. Non utilizzare solamente il colore

Quando progetti elementi come forme e interfacce complesse, non dovresti utilizzare il solo colore come indicatore. Guarda i form qui sotto.
Quello sulla sinistra indica con il colore rosso la presenza di errori e con il colore verde la buona riuscita dell’operazione. Una persona affetta da deuteranopia non riuscirebbe a distinguere la differenza tra questi due messaggi. Il miglior modo per evitare questo problema è quello di utilizzare delle icone come nell’ esempio a destra.

7. Chiarezza nelle didascalie delle immagini

È sempre meglio specificare nel testo, ad esempio nel titolo della pagina o nella descrizione, il colore di un prodotto o dialtro oggetto rappresentato in una fotografia, evitando di affidare alla sola immagine il compito di trasferire l’informazione.Affiancare un testo esplicativo, anche se può sembrare ridondante per alcuni, può essere molto utile per altri.

Perché progettare per l’accessibilità?

Come designer, abbiamo il potere e la responsabilità di garantire che tutti abbiano accesso a ciò che creiamo indipendentemente da abilità, contesto o situazione. Il bello di rendere il nostro lavoro accessibile è che porta a tutti un’esperienza migliore.

Esempio: Trello

Un buon esempio di UX è Trello, un’applicazione che può essere usata sia per gestire progetti software e tracciare cosa sta facendo il team, sia per gestire le proposte della prossima campagna marketing di prodotto che vorrete lanciare.
Un contenitore completamente neutro che proprio grazie a questa sua caratteristica può contenere qualsiasi progetto. Anzi: qualsiasi idea.

Se sei daltonico, le etichette colorate che contraddistinguono le varie aree di lavoro all’interno dell’applicazione non sono proprio il massimo per te, ma puoi abilitare un sistema di labelling per daltonici.

Conclusioni

Purtroppo non c’è una soluzione progettuale univoca che possa soddisfare le varie forme di daltonismo. Basta tenere a mente i principi fondamentali:

• I contrasti sono validi alleati;
• Mantenere 2 o 3 colori (sfruttando tonalità, saturazione e luminosità);
• Sperimentare sempre durante la progettazione;
• Evitare l’uso di pessime combinazioni di colori;
• Utilizzare texture per marcare il contrasto;
• Non fare affidamento solo sul colore per trasmettere un messaggio.

Strumenti utili

In aggiunta puoi avvalerti di alcuni strumenti disponibili online per visionare un’anteprima del tuo lavoro e vedere come apparirebbe per un daltonico.
Alcuni strumenti ottimi per questo scopo sono:

• WebAIM Colour Contrast Checker: ottimo controllo del colore a contrasto che ti dà risultati in tempo reale per testi regolari e di grandi dimensioni.
• Componenti inclusivi: una libreria di modelli sotto forma di blog, con particolare attenzione al design inclusivo. Ogni post esplora un componente di interfaccia comune e ne fornisce una versione migliore, più robusta e accessibile.
• Color Oracle: un simulatore di cecità colore gratuito per Windows, Mac e Linux. Ti mostra in tempo reale cosa vedono lepersone con problemi di visione dei colori comuni.Linee guida per l’accessibilità ai prodotti.
• Vox: una checklist completa per progettisti, ingegneri e project manager.
• AX Google Chrome Extension: prova qualsiasi sito per le violazioni dell’accessibilità utilizzando la finestra di ispezione di Chrome. Contrasto: un’app macOS per un rapido accesso ai rapporti di contrasto del colore WCAG.

Qui trovi altri link utili con cui puoi approfondire l’argomento:

TED Talk – “I listen to color” di Neil Harbisson.
EnChroma – occhiali per daltonici.

Virna Antichi
I anno del Biennio Specialistico di Grafica e Comunicazione