5 suggerimenti sulla progettazione di visualizzazioni daltoniche
Nota: Quanto segue è il primo capitolo di una serie di guest post di Tableau Zen Master Jeffrey Shaffer.
Questo è il primo di una serie di post su alcune delle ben note “regole data-viz.”Spesso sentiamo queste regole, ma i dettagli dietro di loro spesso non vengono esaminati in profondità o trascurati completamente. Ho voluto esaminare alcuni di loro per capire meglio come dovrebbero essere applicati. Per il primo della serie, ho esaminato il problema dell’uso del rosso e del verde insieme.,
Gli studi hanno dimostrato che circa l ‘ 8% degli uomini e lo 0,5% delle donne hanno deficit di visione dei colori (CVD). Questo è più comunemente indicato come daltonismo, anche se daltonismo non è il termine più preciso.
Avere CVD non significa che una persona non possa vedere il colore a meno che tu non sia la persona molto rara (una persona su 33.000) con acromatopsia. Per la persona più comune con CVD, il problema chiave è che i colori che la maggior parte delle persone vede come diverso avrà lo stesso aspetto.,
I due tipi più comuni di CVD sono deuteranomaly e la deuteranopia, che insieme contano per circa il 6% degli uomini, e protanomaly e protanopia, che rappresentano un altro 2% (ulteriori informazioni sono disponibili presso color-blindness.com). Queste condizioni sono anche comunemente indicato come “rosso debole” e “verde debole” o “rosso, verde e daltonismo.”(Nota: Non voglio discutere blu/giallo CVD perché è molto meno comune.)
Ecco alcuni suggerimenti per la progettazione di visze che sono daltonici.,
Rosso e verde insieme possono essere problematici, ma a volte possono essere usati insieme
Quindi, in effetti, usare rosso e verde insieme è un problema comune. Le persone con forte CVD (forte che significa una condizione più grave di CVD) vedrebbero sia il rosso che il verde come marrone. Le persone con CVD debole possono vedere forti colori rosso e verde come rosso e verde. Tuttavia, questo può ancora essere problematico quando i colori sono deboli o mescolati insieme.,
Tieni presente che essere in grado di distinguere questi colori è solo un problema se il colore è l’unico metodo di codifica utilizzato per effettuare un confronto distinto, ad esempio, un buon numero rispetto a un numero errato in una tabella o una riga rispetto a un’altra riga nello stesso grafico a linee. Ad esempio, nel grafico sottostante, il colore è necessario per distinguere un quadrato buono da un quadrato cattivo. Usando la simulazione del deuteranopo, possiamo vedere quanto sarebbe difficile.,
Ho visto critiche riguardanti l’uso di rosso e verde insieme nella stessa visualizzazione, ma i colori non venivano usati in un modo che richiedeva a qualcuno di dire la differenza tra loro. Se stanno da soli—ad esempio, due grafici diversi, uno rosso e uno verde-e sono etichettati bene, allora potrebbe non essere un problema se entrambi appaiono di colore marrone.
Il grafico sottostante offre un esempio in cui è facile vedere dalla linea dell’asse che la maggior parte dei numeri sono positivi e altri sono negativi., Il colore è una caratteristica secondaria che codifica semplicemente positivo contro negativo. Anche se questa potrebbe non essere la scelta migliore dei colori, qualcuno con CVD può interpretare questo grafico senza l’uso del colore per effettuare il confronto.
Essere consapevoli del fatto che non è solo rosso e verde
Molti strumenti di visualizzazione dei dati hanno una tavolozza “semaforo” incorporato in loro, e ci sono molte aziende (e clienti e capi) che ancora insistono sull’uso della tavolozza semaforo., Con tutto il parlare dei colori del semaforo e dei soprannomi per le condizioni CVD, non c’è da meravigliarsi che la regola di visualizzazione dei dati sia semplicemente diventata “non usare il rosso e il verde.”Di seguito è riportata una simulazione dei colori dei semafori di Tableau utilizzando la simulazione protanope.
Si noti che il problema qui è molto più complesso del semplice rosso rispetto al verde. Dal momento che rosso, verde e arancione sembrano tutti essere marrone per qualcuno con forte CVD, sarebbe più preciso dire, “Non usare rosso/verde/marrone/arancione insieme.”Tuttavia, non finisce qui., Quando i colori sono mescolati, possono anche essere problematici.
Una combinazione di colori che viene spesso trascurata sta usando blu e viola insieme. In un modello di colore RGB, viola si ottiene utilizzando blu e rosso insieme. Se qualcuno ha problemi con il rosso, allora la persona può anche avere problemi con il viola, che sembrerebbe apparire come blu.
Inoltre, rosa e grigio insieme e grigio e marrone insieme possono essere problematici. Di seguito è riportata la tavolozza dei colori Tableau 10 utilizzando una simulazione deuteranope., Non solo il rosso, il verde e il marrone sono problematici, ma lo sono anche il blu e il viola, il rosa e il grigio e il grigio e il marrone.
Mio cognato ha CVD, quindi è spesso la cavia per i miei esperimenti di colore. Fuori da tutte le cose che ho provato su di lui, la combinazione di colori sull’immagine qui sotto (a sinistra) è stata la più difficile per lui da distinguere. Sembra soffrire di protanopia, che è simulata in basso a destra.
Quindi ora che sappiamo che ci sono molte più combinazioni di colori che possono essere problematiche, cosa dovremmo fare?,
Utilizzare una tavolozza daltonica quando appropriato
Un colore usato insieme in combinazione con un altro colore è generalmente bene quando uno di essi non è solitamente associato a CVD. Ad esempio, blu/arancione è una tavolozza comune daltonico-friendly. Blu/rosso o blu / marrone funzionerebbe anche. Per le condizioni più comuni di CVD, tutti questi funzionano bene, dal momento che il blu apparirebbe generalmente blu a qualcuno con CVD.
Tableau ha una tavolozza daltonica integrata progettata da Maureen Stone. Questa tavolozza funziona molto bene per i casi comuni di CVD., Di seguito è riportato il Tableau tavolozza daltonico-friendly sia sotto deuteranope e protanope simulazione. Si noti quanto bene questa tavolozza di colori funziona per i vari confronti di colore.
Forse è il capo, il cliente, o anche i colori aziendali o guida di stile che richiede di utilizzare rosso e verde. Quindi ora cosa possiamo fare?
Se è necessario utilizzare rosso e verde insieme, leva luce vs scuro
Per qualcuno con CVD, il problema è principalmente con la tonalità del colore (ad esempio rosso vs verde) e non con il valore del colore (luce vs verde)., scuro).
Quasi chiunque può capire la differenza tra un colore molto chiaro e un colore molto scuro, quindi un’altra opzione quando si usano rosso e verde insieme è usare un verde molto chiaro, un giallo medio e un rosso molto scuro. Questo sembrerebbe essere più di una combinazione di colori sequenziale a qualcuno che ha un forte CVD, ma la persona sarebbe almeno in grado di distinguere il rosso dal verde in base alla luce rispetto al buio.,
Se devi usare rosso e verde insieme, offri metodi alternativi per distinguere i dati
Lungo quelle stesse linee, se usi rosso e verde, puoi anche aggiungere icone, frecce direzionali, etichette, annotazioni o altri indicatori che consentirebbero a una persona con CVD di vedere che qualcosa è cattivo (rosso) contro buono (verde).
Un’altra opzione potrebbe essere una casella di controllo per un utente per passare la tavolozza dei colori per l’intera viz a una tavolozza daltonica., Ciò consente l’abbinamento rosso/verde per la maggior parte del pubblico offrendo un modo per qualcuno con CVD di cambiare completamente la tavolozza.
Sfortunatamente, non c’è un modo semplice per farlo in Tableau. Tuttavia, può certamente essere fatto. Di seguito sono riportati due esempi, uno utilizzando un parametro per modificare la tavolozza dei colori (utilizzando sia una combinazione di colori sequenziale e categoriale con trasparenza) e l’altro utilizzando un’azione dashboard, simile a quello che Tableau Maestro Zen Robert Rouse utilizzato nella sua tecnica hidden-menu.,
Vuoi assicurarti che il viz che hai progettato sia daltonico? Oltre a una serie di simulatori daltonici online, c’è anche un plug-in per questo. Il plug-in Chrome “NoCoffee” simulerà tutti i tipi di CVD direttamente nel browser, comprese le visualizzazioni ospitate su Tableau Public o Tableau Server.
Provare a utilizzare il browser NoCoffee plug-in per un giorno intero, e sarete stupiti di ciò che il mondo sembra a qualcuno con CVD. Per le immagini della visualizzazione senza un browser, provare questo simulatore di visione cromatica.,
Vorrei ringraziare Maureen Stone per la preziosa recensione, l’input e i suggerimenti per questo post.
Per ulteriori suggerimenti, idee, e vizzes da Jeffrey Shaffer, controllare la sua pagina pubblica Tableau e il suo blog. È inoltre possibile connettersi con lui su Twitter @HighVizAbility.