Creating dashboards for the color blind
Recently I have been reading an amazing book titled The Big Book of Dashboards. A gigantic collection of knowledge would be an understatement. I would recommend it to anyone in the UX industry designing dashboards.
The correct term for this problem is Color Vision Deficiency caused by a lack of one of the three cones found in the eye. People suffering from CVD can see colors but are unable to distinguish between some.
There are 3 types of CVD: Protanopia(weak red), Deuteranopia(weak green) and Tritanopia(weak blue). According to statistics 8 percent of males suffer from CVD while only 0.4 percent of females face this. Though this number looks pretty small, in a group of 25 men, there is an 88 percent chance that one of them has CVD. Therefore it would really help if designers choose colors in the dashboard keeping them in mind.
The major problem people with CVD face is with colors Red and Green. So basically the traffic light combination that is extensively used in dashboards looks like the same shades of a color to them.
Let’s have a look at what the normal human would see vs what a person with CVD would. As you could see below how a graph with red, green and yellow would look like to a person with CVD.
One alternative to the usage of these traffic lights is the use of Blue instead of green and Orange instead of Red. Both blue and orange look clearly distinctive to a person with CVD (with some exceptions though).
Since we can see red and green used extensively together across many platforms, it is difficult for a person with CVD to make sense out of a graph that uses this combination. Also, a person with strong CVD won't be able to distinguish between red, green, orange and brown(see below). So it is safe to say one should avoid the usage of these 4 colors together to visualize different values.
Well, the problem is not just limited to red and green. Combining blue and purple together also makes it difficult to be recognized since purple is derived from red and blue and a person with CVD having an issue with red would find blue and purple quite similar. I'll add another example here where there are four colors: blue, purple, magenta and gray. While applying deuteranopia simulation to this, all colors would look indistinguishable.
So take some precautions next time you are visualizing data. One easy way to do this is actually via this website. It is free and you can upload your images and check how the colors will look like for people with various forms of CVD.
So that was something I learned from this amazingly insightful book — “The Big Book of Dashboards” by Steve, Jeffrey, and Andy. I would be posting more of it soon. Keep learning.
