5 Tipps zum Entwerfen farbenblindfreundlicher Visualisierungen
Hinweis: Im Folgenden finden Sie den ersten Teil einer Reihe von Gastbeiträgen von Tableau Zen Master Jeffrey Shaffer.
Dies ist eine erste in einer Reihe von posts über einige der bekannten „Daten-viz-Regeln.“Wir hören diese Regeln oft, aber die Details dahinter werden oft nicht eingehend untersucht oder vollständig übersehen. Ich wollte einige von ihnen untersuchen, um besser zu verstehen, wie sie angewendet werden sollten. Zum ersten Mal in der Serie habe ich das Problem der gemeinsamen Verwendung von Rot und Grün untersucht.,
Studien haben gezeigt, dass etwa 8% der Männer und 0,5% der Frauen color vision deficiency (CVD). Dies wird häufiger als Farbenblindheit bezeichnet, obwohl Farbenblindheit nicht der genaueste Begriff ist.
CVD bedeutet nicht, dass eine Person keine Farbe sehen kann, es sei denn, Sie sind die sehr seltene Person (eine von 33.000 Menschen) mit Achromatopsie. Für die häufigere Person mit CVD besteht das Hauptproblem darin, dass Farben, die die meisten Menschen als unterschiedlich betrachten, gleich aussehen.,
Die beiden häufigsten Arten von CVD sind Deuteranomalie und Deuteranopie, die zusammen etwa 6% der Männer ausmachen, sowie Protanomalie und Protanopie, die weitere 2% ausmachen (weitere Informationen unter color-blindness.com). Diese Bedingungen werden auch allgemein als „rot schwach“ und „grün schwach“ oder „rot-grün Farbenblindheit bezeichnet.“(Hinweis: Ich werde nicht blau/gelb CVD diskutieren, weil es weit weniger verbreitet ist.)
Hier sind einige Tipps für die Gestaltung von vizzes, die farbenblind-freundlich sind.,
Rot und Grün zusammen können problematisch sein, aber sie können manchmal zusammen verwendet werden
In der Tat ist die Verwendung von Rot und Grün zusammen ein häufiges Problem. Menschen mit starkem CVD (stark bedeutet einen schwereren Zustand von CVD) würden sowohl rot als auch grün als braun sehen. Menschen mit schwacher CVD können starke rote und grüne Farben als rot und grün sehen. Dies kann jedoch immer noch problematisch sein, wenn die Farben schwach sind oder miteinander vermischt sind.,
Beachten Sie, dass die Möglichkeit, diese Farben voneinander zu unterscheiden, nur dann ein Problem darstellt, wenn Farbe die einzige Codierungsmethode ist, mit der ein eindeutiger Vergleich durchgeführt wird—z. B. eine gute Zahl gegenüber einer schlechten Zahl in einer Tabelle oder eine Zeile gegenüber einer anderen Zeile im selben Liniendiagramm. In der folgenden Tabelle wird beispielsweise Farbe benötigt, um ein gutes Quadrat von einem schlechten Quadrat zu unterscheiden. Mit der Deuteranopensimulation können wir sehen, wie schwierig dies wäre.,
Ich habe Kritik an der Verwendung von Rot und Grün zusammen in der gleichen Visualisierung gesehen, aber die Farben wurden nicht in einer Weise verwendet, die jemanden erforderte, um den Unterschied zwischen ihnen zu erkennen. Wenn sie alleine stehen—zum Beispiel zwei verschiedene Diagramme, eine rote und eine grüne—und gut beschriftet sind, ist es möglicherweise überhaupt kein Problem, wenn beide braun erscheinen.
Das folgende Diagramm bietet ein Beispiel, in dem aus der Achslinie leicht zu erkennen ist, dass die meisten Zahlen positiv und andere negativ sind., Farbe ist ein sekundäres Merkmal, das einfach positiv vs. negativ codiert. Obwohl dies möglicherweise nicht die beste Farbauswahl ist, kann jemand mit CVD dieses Diagramm ohne die Verwendung von Farbe interpretieren, um den Vergleich durchzuführen.
Beachten Sie, dass nicht nur Rot und Grün
In viele Datenvisualisierungstools ist eine“ Stoplight “ – Palette integriert, und es gibt viele Unternehmen (und Kunden und Chefs), die immer noch darauf bestehen, die Stoplight-Palette zu verwenden., Bei all dem Gerede von Stoplight-Farben und den Spitznamen für die CVD-Bedingungen ist es kein Wunder, dass die Datenvisualisierungsregel einfach zu „Verwenden Sie nicht Rot und Grün.“Unten finden Sie eine Simulation der Stoplight-Farben von Tableau mithilfe der Protanopensimulation.
Beachten Sie, dass das problem sehr viel komplexer ist, als einfach nur rot vs grün. Da rot, grün und orange alle für jemanden mit starker CVD braun zu sein scheinen, wäre es genauer zu sagen, „Don“t rot/grün/braun/orange zusammen verwenden.“Es endet jedoch nicht dort., Wenn Farben gemischt werden, können sie auch problematisch sein.
Eine häufig übersehene Farbkombination verwendet Blau und Lila zusammen. In einem RGB-Farbmodell wird Lila durch die Verwendung von Blau und Rot zusammen erreicht. Wenn jemand Probleme mit Rot hat, kann die Person auch Probleme mit Lila haben, das wie Blau aussieht.
Auch rosa und Grau zusammen und grau und braun zusammen können problematisch sein. Unten finden Sie die Tableau 10-Farbpalette mit einer Deuteranopensimulation., Es sind nicht nur Rot, Grün und Braun, sondern auch Blau und Lila, Rosa und Grau sowie Grau und Braun.
Mein Schwager hat CVD, daher ist er häufig das Versuchskaninchen für meine Farbexperimente. Von all den Dingen, die ich an ihm getestet habe, war die Kombination von Farben auf dem Bild unten (links) am schwierigsten für ihn zu unterscheiden. Er scheint an Protanopie zu leiden, die unten rechts simuliert wird.
Jetzt, da wir wissen, dass es viele weitere Farbkombinationen gibt, die problematisch sein können, was sollten wir tun?,
Verwenden Sie gegebenenfalls eine farbblindfreundliche Palette
Eine Farbe, die zusammen mit einer anderen Farbe verwendet wird, ist im Allgemeinen in Ordnung, wenn eine davon normalerweise nicht mit CVD verknüpft ist. Zum Beispiel ist Blau / Orange eine übliche farbblindfreundliche Palette. Blau / Rot oder blau / Braun würde auch funktionieren. Für die häufigsten Bedingungen von CVD funktionieren alle gut, da Blau für jemanden mit CVD im Allgemeinen blau aussehen würde.
Tableau verfügt über eine integrierte Farbblind-freundliche Palette von Maureen Stone. Diese Palette funktioniert sehr gut für die häufigsten Fälle von CVD., Unten finden Sie die Tableau Colorblind-freundliche Palette sowohl unter Deuteranope als auch unter Protanope Simulation. Beachten Sie, wie gut diese Farbpalette für die verschiedenen Farbvergleiche funktioniert.
Vielleicht ist es der Chef, der Kunde oder sogar die Firmenfarben oder der Styleguide, für die Sie Rot und Grün verwenden müssen. Also, was können wir jetzt tun?
Wenn Sie Rot und Grün zusammen verwenden müssen, z. B. Hell vs. dunkel
Für jemanden mit CVD, liegt das Problem in erster Linie beim Farbton (z. B. Rot vs. Grün) und nicht beim Farbwert (Licht vs., dunkel).
Fast jeder kann den Unterschied zwischen einer sehr hellen Farbe und einer sehr dunklen Farbe erkennen, daher besteht eine andere Option bei der Verwendung von Rot und Grün darin, ein wirklich hellgrünes, ein mittleres Gelb und ein sehr dunkles Rot zu verwenden. Dies scheint eher ein sequentielles Farbschema für jemanden zu sein, der eine starke CVD hat, aber die Person wäre zumindest in der Lage, Rot von Grün zu unterscheiden, basierend auf Hell vs. dunkel.,
Wenn Sie Rot und Grün zusammen verwenden müssen, bieten Sie alternative Methoden zur Unterscheidung von Daten an
Wenn Sie Rot und Grün verwenden, können Sie bei Verwendung von Rot und Grün auch Symbole, Richtungspfeile, Beschriftungen, Anmerkungen oder andere Indikatoren hinzufügen Eine Person mit CVD kann sehen, dass etwas schlecht (rot) vs. gut (grün) ist.
Eine weitere Option könnte ein Kontrollkästchen für einen Benutzer sein, um die Farbpalette für die gesamte viz auf eine farbblind-freundliche Palette umzustellen., Dies ermöglicht die rot / grüne Paarung für die Mehrheit des Publikums und bietet gleichzeitig eine Möglichkeit für jemanden mit CVD, die Palette vollständig zu ändern.
Leider gibt es in Tableau keine einfache Möglichkeit, dies zu tun. Es kann jedoch sicherlich getan werden. Im Folgenden sind zwei Beispiele aufgeführt, von denen eines einen Parameter zum Ändern der Farbpalette verwendet (sowohl unter Verwendung eines sequentiellen als auch eines kategorialen Farbschemas mit Transparenz) und das andere eine Dashboard-Aktion verwendet, ähnlich der von Tableau Zen Master Robert Rouse in seiner Hidden-Menu-Technik.,
Möchten Sie sicherstellen, dass das von Ihnen entworfene viz farbenblindfreundlich ist? Neben einer Reihe von Online-Colorblind-Simulatoren gibt es dafür auch ein Plug-In. Das Chrome-Plug-In „NoCoffee“ simuliert alle Arten von CVD direkt in Ihrem Browser, einschließlich Ihrer auf Tableau Public oder Tableau Server gehosteten Visualisierungen.
Versuchen Sie, das NoCoffee Browser Plug-In für einen ganzen Tag zu verwenden, und Sie werden erstaunt sein, wie die Welt für jemanden mit CVD aussieht. Probieren Sie diesen Chromatic Vision Simulator aus, um Bilder Ihrer Visualisierung ohne Browser zu erhalten.,
Ich möchte Maureen Stone für die wertvolle Bewertung, den Input und die Vorschläge für diesen Beitrag danken.
Weitere Tipps, Ideen und Vizzes von Jeffrey Shaffer finden Sie auf seiner Tableau Public-Seite und in seinem Blog. Sie können auch mit ihm auf Twitter @HighVizAbility verbinden.