Color Alone Cannot be an Indicator

Two coffee pots with differently colored rectangles on the handles and a color key on the wall.

Communicating something important with color alone is a problem for users with deficient color vision. So when you indicate something important in an interface with just color, you are creating a poor user experience for about 8% of the male population and 0.5% of the female population.

Color deficiency is complex and the colors that a user has difficulty distinguishing is based on their type of color blindness. Using the example in the photo, we have 2 coffee pots representing supposedly two different kinds of coffee and different brew times. Both pots are using the same visual signifier on the handle, differently colored rectangles, to indicate type of brew and time of brew on the wall. Which one is decaf? Which one was brewed at 8:15?

How can this be solved? Don’t use color alone as an indicator. One shape can be a rectangle and the other shape can be a circle. Maybe the rectangle is regular coffee and the circle is decaf. So we would need to write the brew or blend with the representative shape on the key on the wall with the listed brew time. Or better yet skip the shapes and just use the text “regular” or “decaf” or “hazelnut” if hazelnut is your bag. Otherwise you would need to look at the chart to figure out which is the coffee that will make your day a +1 day. If you care about brew times, you can look at the chart.

Use color in conjunction with text. Color alone cannot be an indicator.