in colours, shader, tutorial, Unity3D

Accessibility Design: Color Blindness

Share Button

This tutorial will teach you how to create and use post-processing effects which simulate how colour blind players might experience your Unity game. One of my most anticipated games is The Witness; since it uses so many vibrant colours, it will be used as an example in this tutorial. This is how a player affected by red-green colour blindness (protanopia) might see it:

The image effect provided in this tutorial will help you understand which parts of your game are harder to see for color blind users.

Introduction

Colour blindness is a umbrella term that groups pathological variations in the perception of colours. Despite what the name suggests, the complete inability to see colours (achromatopsia) is an extremely rare condition. Almost three percent of the population has deuteranomaly, the most common form of colour blindness which affects the perception of green tones.

Normal rgb_n
Protanope (red) rgb_p
Deuteranope (green) rgb_d
Tritanope (blue) rgb_t
Anachromatope (all) rgb_a

When a particular colour receptor is missing entirely, we have protanopiadeuteranopia and tritanopia. When instead they are present but defective or in reduced numbers, we have protanomalydeuteranomaly and tritanomaly.

Testing your game

The first step is to download the ColorBlind Unity package specifically created for this tutorial. Once imported in your project, drag the script called ColorBlindFilter onto your main camera. You can change the Mode to alter colours according to the different types of colour blindness.

filter

There is also an additional option, called Show Difference. When enabled, it shows the game in black and white, adding a red tone to the areas that are more affected by the selected type of colour blindness.

The picture above shows which parts of the game are more affected by protanopia

Accessibility design

For most colour blind players, games that strongly reply on green and red can add an extra layer of challenge and frustration. It’s getting more and more common for developers to include a special option for colour blind users. FTL, for example, does this very nicely by ensuring that “no essential information is conveyed by a colour alone” (from Game accessibility guidelines):

faster-than-light-cbmode

This is possible even in games which are entirely based on colours, such as Hue. This upcoming 2D puzzle platformer has a colour blind mode which matches symbols to colours.

hue_cb

Support this blog! ♥

In the past two years I've been dedicating more and more of my time to the creation of quality tutorials, mainly about game development and machine learning. If you think these posts have either helped or inspired you, please consider supporting this blog.

PatreonBecome a Patron Oo4th_patreon_name
PaypalDonate on PayPal
Twitter_logoFollow on Twitter

Don't miss the next tutorial!

There's a new post every Wednesday: leave your email to be notified!


Write a Comment

Comment

  1. This is great, but I think there is some additional brightness being included in the colour-blindness conversion.

    I’m red-green colour blind and normally when I see the Before/After images they are indistinguishable for me, however with the Before/After screenshot of The Witness I can see the brightness changing, particularly on the trees on the left.

    It’s not that I’m seeing any extra information, but it is easily distinguishable from the original.

    Have you included the correct sensitivity weightings for red/green/blue light in the human eye? Perhaps it is slightly too low for the green component.

    Really great work though! I’m wondering now if I can make a plugin that sort of does the opposite, takes a game that I’ve made and shows me the information a non colour-blind person would see, kind of remapping the similar colours onto a part of the spectrum I can distinguish.

    • Is it brighter or darker to you? Those transformations do not preserve brightness and my intuition says that result will be usually darker than what a colour blind person would see.

      Interesting! 🙂

  2. This is a very commendable Enterprise you got going on here, keep up the awesome work!

    As to color matching symbols you could check out this labeling system developed by a great group of people from my country that started as a helper for clothes matching and has been widely implemented here in Portugal coloradd.net. Cheers!

Webmentions

  • Desenvolvedor criar efeito para simular Daltonismo | December 30, 2015

    This is a very commendable Enterprise you got going on here, keep up the awesome work!

    As to color matching symbols you could check out this labeling system developed by a great group of people from my country that started as a helper for clothes matching and has been widely implemented here in Portugal coloradd.net. Cheers!

  • How to make games work for colorblind players - GeekTechTalk December 30, 2015

    This is a very commendable Enterprise you got going on here, keep up the awesome work!

    As to color matching symbols you could check out this labeling system developed by a great group of people from my country that started as a helper for clothes matching and has been widely implemented here in Portugal coloradd.net. Cheers!

  • Making Your Game Accessible to People Who Are Color Blind | GBGames - Thoughts on Indie Game Development December 30, 2015

    This is a very commendable Enterprise you got going on here, keep up the awesome work!

    As to color matching symbols you could check out this labeling system developed by a great group of people from my country that started as a helper for clothes matching and has been widely implemented here in Portugal coloradd.net. Cheers!