5 tips om å designe colorblind-vennlig effekter
Merk: følgende er det første spillet i en serie av gjestene innlegg av Brettet Zen Mester Jeffrey Shaffer.
Dette er en første i en serie innlegg om noen av de kjente «data-viz regler.»Vi hører ofte disse reglene, men detaljene bak dem er ofte ikke undersøkt i dybden eller oversett fullstendig. Jeg ønsket å undersøke noen av dem til å forstå bedre hvordan de skal brukes. For det første i serien, jeg undersøkt spørsmålet om å bruke rød og grønn sammen.,
Studier har vist at rundt 8% av menn og 0,5% av kvinner har fargesyn-mangel (CVD). Dette er ofte referert til som colorblindness, selv om colorblindness er ikke den mest nøyaktige betegnelsen.
etter å Ha CVD betyr ikke at en person ikke kan se fargen med mindre du er svært sjeldne person (ett på 33 000 mennesker) med achromatopsia. For de mer vanlige person med CVD, er det avgjørende problemet er at fargene som de fleste ser på som annerledes vil se det samme.,
De to vanligste typene av CVD er deuteranomaly og deuteranopia, som til sammen teller for om lag 6% av menn, og protanomaly og protanopi, som står for en annen 2% (mer informasjon tilgjengelig på color-blindness.com). Disse forholdene er også ofte referert til som «svak rød» og «grønn svak» eller «rød-grønn colorblindness.»(Merk: jeg vil ikke diskutere blå/gul CVD fordi det er langt mindre vanlig.)
Her er noen tips for å utforme vizzes som er colorblind-vennlig.,
Rød og grønn sammen kan være problematisk, men de kan noen ganger brukes sammen
Så faktisk, ved hjelp av rød og grønn sammen er et vanlig problem. Personer med sterk CVD (sterk mening en mer alvorlig tilstand av CVD) ville se både rød og grønn, brun. Personer med svak CVD kan se sterke røde og grønne farger som rød og grønn. Men dette kan likevel være problematisk når fargene er svak eller blandet sammen.,
husk at det å være i stand til å fortelle disse fargene fra hverandre er bare et problem hvis fargen er bare koding metode som brukes for å få en tydelig sammenligning—for eksempel, en god del kontra en dårlig tall i en tabell, eller en linje vs. annen linje i samme linje i diagrammet. For eksempel, i diagrammet nedenfor, fargen er nødvendig for å fortelle en god torget fra en dårlig square. Ved hjelp av deuteranope simulering, kan vi se hvor vanskelig dette skulle være.,
jeg har sett kritikk angående bruken av rødt og grønt sammen i samme visualisering, men fargene var ikke blir brukt på en måte som krevde noen til å fortelle forskjellen mellom dem. Hvis de står alene—for eksempel to forskjellige diagrammer, en rød og en grønn—og de er merket vel, da kan det ikke være et problem i det hele tatt hvis de begge synes brun i fargen.
tabellen nedenfor gir et eksempel der det er lett å se fra aksen linje som de fleste tallene er positive og andre er negative., Fargen er en sekundær funksjon bare koding positive vs. negative. Mens dette kan ikke være det beste valget av farger, noen med CVD kan tolke dette diagrammet uten bruk av farge for å gjøre sammenligningen.
Bli klar over at det er ikke bare rødt og grønt
Mange visualisering av data verktøy har en «stoplight» palett bygget inn i dem, og det er mange selskaper (og kunder og sjefer) som fortsatt insisterer på å bruke stoplight paletten., Med alt snakket om stoplight farger og kallenavn for CVD forhold, er det ikke rart at data visualisering regel har rett og slett blitt «ikke bruk rødt og grønt. Nedenfor er en simulering av Brettet er stoplight fargene ved å bruke protanope simulering.
legg Merke til at problemet her er mye mer kompleks enn bare rett og slett rød vs. grønn. Siden rød, grønn og oransje alle synes å være brun for noen med sterk CVD, ville det være mer nøyaktig å si, «Don»t bruke rød/grønn/brun/oransje sammen.»Men det er ikke slutt med det., Når fargene er blandet, de kan også være problematisk.
En farge kombinasjon som ofte blir oversett er å bruke blå og lilla sammen. I et RGB-farge-modell, lilla er oppnådd ved å bruke blått og rødt sammen. Hvis noen har problemer med rød, da personen kan også ha problemer med lilla, som synes det ser ut som blå.
Også, rosa og grått sammen og grått og brunt sammen kan være problematisk. Nedenfor er Brettet 10 fargepalett ved hjelp av en deuteranope simulering., Ikke bare er rød, grønn og brun problematisk, men så er blå og lilla, rosa og grått og grått og brunt.
Min svoger har CVD, så han er ofte marsvin for min farge eksperimenter. Av alle ting jeg har testet på ham, kombinasjon av farger på bildet under (til venstre) var den vanskeligste for ham å skille. Han ser ut til å lide fra protanopi, som er simulert nedenfor til høyre.
Så nå som vi vet det er mange flere kombinasjoner av farge som kan være problematisk, hva bør vi gjøre?,
Bruk en colorblind-vennlig palett når det er hensiktsmessig
En farge som brukes sammen i kombinasjon med en annen farge er generelt fint når en av dem er vanligvis ikke forbundet med CVD. For eksempel, blå/orange er en vanlig colorblind-vennlig-paletten. Blå/rød eller blå/brun ville også fungere. For de mest vanlige vilkår for CVD, alle disse fungerer godt, siden blå vanligvis ville se blått ut til noen med CVD.
Brettet har en innebygd colorblind-vennlig palett designet av Maureen Stein. Denne paletten fungerer veldig bra for den vanlige tilfeller av CVD., Nedenfor er Brettet colorblind-vennlig paletten under både deuteranope og protanope simulering. Legg merke til hvor godt denne fargepaletten fungerer for de ulike sammenligninger av farge.
Kanskje det er sjefen, klienten, eller selv selskapet farger eller stil guide som krever at du bruker rødt og grønt. Så nå hva kan vi gjøre?
Hvis du må bruke rødt og grønt sammen, utnytte lyset mot mørket
For noen med CVD, problemet er først og fremst med fargetone (f.eks. rød vs. grønn) og ikke med fargen verdi (lys vs., mørk).
Nesten hvem som helst kan fortelle forskjellen mellom en svært lys farge og en veldig mørk farge, så et annet alternativ når du bruker rødt og grønt sammen, er å bruke en virkelig lys grønn, medium gul, og en veldig mørk rød. Dette synes å være mer av en sekvensiell fargevalg til noen som har sterke CVD, men personen i det minste ville være i stand til å skille rødt fra grønt basert på lys mot mørke.,
Hvis du må bruke rødt og grønt sammen, tilby alternative metoder for å skille data
Langs de samme linjene, hvis du bruker rød og grønn, kan du også legge til ikoner, retningspiler, etiketter, kommentarer, eller andre indikatorer som ville tillate en person med CVD å se at noe er dårlig (rød) vs. god (grønn).
et Annet alternativ kan være en avmerkingsboks for en bruker å bytte fargepaletten for hele nemlig til en colorblind-vennlig-paletten., Dette gjør det mulig for den rød/grønne paring for de fleste av publikum, samtidig som den tilbyr en måte for noen med CVD å endre paletten helt.
Dessverre, det er ikke en enkel måte å gjøre dette på Brettet. Imidlertid, det kan sikkert gjøres. Nedenfor er to eksempler, ett ved hjelp av en parameter for å endre fargepaletten (ved hjelp av både en sekvensiell og kategoriske farge ordningen med gjennomsiktighet) og den andre med en oversikt handling, i likhet med det Brettet Zen Master Robert Rouse brukt i hans skjulte-menyen teknikk.,
Ønsker å sørge for at du nemlig designet er colorblind-vennlig? I tillegg til en rekke online colorblind simulatorer, det er også en plug-in for det. Chrome-plugin-modulen «NoCoffee» vil simulere alle typer CVD rett i nettleseren din, inkludert effekter vert på Brettet Offentlige eller Brettet-Server.
Prøv å bruke NoCoffee browser plug-in for en hel dag, og du vil bli overrasket over hvordan verden ser ut til noen med CVD. For bilder av visualisering uten å bruke en nettleser, kan du prøve dette kromatisk visjon simulator.,
jeg ønsker å takke Maureen Stein for verdifulle anmeldelse, innspill og forslag til dette innlegget.
For flere tips, ideer, og vizzes av Jeffrey Shaffer, sjekk ut hans Tableau Offentlige siden og bloggen sin. Du kan også koble deg sammen med ham på Twitter @HighVizAbility.