Designing for Color Blindness

A mini case-study on bad designs for colorblindness and how to improve them.

 

Typography

colorblindUsers-3.jpg

For people with red colorblindness, this will look the same color. Replacing one of the colors with green wouldn’t be a good choice either as those with red/green color blindness will just see a box of muted color as well.

Metro Map

map1.jpg

Understanding this map is completed dependent on being able to see all the colors. Depending on the type of color blindness a person has, different colors will be more apparent than others or in extreme versions, they just see a grayscale version of the map which isn’t helpful at all. Solutions for this would be to use patterns, different thickness of lines, monochrome, high contrast colors, etc.

Google Analytics

Screen Shot 2016-09-20 at 1.39.26 PM.png

If a user has red/blue color blindness the will not be able to tell the difference between the Direct Traffic and Referring Sites legend. This could be solved by using icons somehow, making in monochrome with just blue or using lines to connect the legend to the graph.

Leave a comment