Color Blindness
Resources
Colour (color) blindness (colour vision deficiency, or CVD) affects approximately 1 in 12 men (8%) and 1 in 200 women in the world. In Britain this means that there are approximately 2.7 million colour blind people (about 4.5% of the entire population), most of whom are male.
— Colour Blind Awareness
Color blindness and deficiencies come in a variety of types, most commonly red-green. This is a huge deal when you consider that red and green are often used for "success" or "error" feedback in messaging, buttons, and so forth. If color is the sole differentiator between two objects, chances are, there will be some frustrated users.
Compare these banners to the version run through Colorblindly:
Standard Colors
Deuteranopia-Simulated Colors
Helper text is good, but adding icons is even better. When we consider that many users are skimming and not actually reading the text, any visual cues we can add will aid them.
Of course, there are plenty of times when we can't add helper text or cute icons. Enter: video games. Here is a design with bright, colorful orbs; shoot a colored orb from the bottom to clear a matching group of orbs in the top section.
Good luck doing well in the game if you have difficulty differentiating red and green. Sure, there are slight differences in the orbs, but not enough to be considered colorblind-friendly. There is an increasing amount of gamers looking for colorblind-accessible games that work well.
Luckily, there is one game category that has this problem solved: match-3 games.
Match-3 Games
This type of game is very common. Many of them use the same (or quite similar) mechanics, so it is easy to make a spin-off game once you've figured out the technical side; new graphics can be enough to make it a "new" game.
In this type of game, you swap neighboring pieces to make matches of 3 or more of the same piece. Not only are the pieces different colors, but often unique shapes; unlike the previous image example, these would be easy to tell apart even in greyscale. Food and gemstones are common themes, copying off of the fame of two major games: Bejeweled and Candy Crush.
Check out the examples below and note how the designers used these techniques to help users differentiate the pieces:
- Unique shapes
- Colors that vary in lightness, not just hue
Though the pieces are different, they are still unified in their illustration style, color scheme, 3D perspective (if any), and light source.
Creating a Match-3 Game in Figma
Just for Fun
Want to see how well you can differentiate colors? There's a test for that.
Take the X-Rite Color Challenge