Designing for Color Blindness-A Look Through a Different Set of Eyes

Color blindness is not a form of blindness or loss of vision, but rather a deficiency in the way an individual sees color. A result of various degrees of color-blindness is that an individual will have difficulty distinguishing specific colors, such as yellow and blue or green and red.

For those of us that do not suffer from some degree of color blindness (or, more accurately, color vision deficiency), it is tough to understand let alone interpret how one who suffers from color blindness perceives different levels of color. For a moment imagine that it would be impossible for someone with a color vision deficiency to distinguish various levels of color and tone when food shopping for vegetables, meats, seafood, or fruits. The same challenge exists when designing for the color-deficient audience whether your message is digital or print-related. One of the components of health literacy is first understanding the disability, and then designing around it, so that your message is clear not just from a content standpoint, but also a visual one.

Types of Color Vision Deficiency

There are two main types of color vision deficiency, and these include:

Red-Green Deficiency — A common X-linked recessive gene causes the most common inherited form of color blindness (Deuteranopia). Those having red-green deficiency are unable to identify certain shades of red or green. This form of the condition is the most commonly inherited type.

Blue–Yellow Deficiency — This is a more rare form of color deficiency (Tritanopia) where it is difficult for a person to differentiate between blue and green. Yellow could be perceived as grey or purple.

Photo Credit: boredpanda.com

According to National Eye Institue, as many as 8 percent of men and 0.5 percent of women with Northern European ancestry have the common form of red-green color deficiency.

What About Driving? — The Color Blindness Solution

Most color-blind individuals can’t tell the difference between green or red, but they can learn to “respond” to the way the traffic signal lights are configured. That explains why the red light is generally on top and green is on the bottom (the United States for example). This configuration of the traffic lights enables a driver with color-blindness to distinguish a “Stop” on red, and “Clear to go” on a green light.

Design Considerations-Color Vision Deficiency

Now that you have the basic understanding of this condition, it becomes apparent the level of frustration a color-blind individual can have when navigating a website or reading patient information materials. First off, the designer needs to identify the level of importance of the content from headline levels to body copy, tables, diagrams, and typographic emphasis using color. The solution is NOT to make everything 1-color, but instead, explore the design options using tools that are available. The tools are just a guide and a starting point. The importance of branding, use of shapes, icons, in addition to how well the photographic elements portray the message to the color-deficient audience present an interesting design challenge.

Color-Blindness Tools

Coblis Color Blindness Simulator
This online color simulator will enable you to explore how an image of your choice will display across various levels of color deficiency, such as Trichromatic view, Anomalous Trichromacy view, Dichromatic view, and Monochromatic view.

Color Oracle — Design for the Color Impaired
Color Oracle is a free color blindness simulator for Windows, Mac, and Linux that in real time will display what people with common color vision impairments will see.

I hope this helped to enlighten the necessity of an experienced designer to bridge your design and messaging across audiences who deal with a disability such as color-blindness.