KPI Icons neatly designed for colour blindness

I was talking with one of our customers about SharePoint branding the other day. They’ve got some neat icons for displaying the status of things. However, the guy I was talking to wasn’t keen on them as they were the same colour (although their shape differs). This sort of led around to a discussion of the use of colour (or ‘color’) in web development.

One of my ‘neat tools to have around’ is the Color Contrast Analyzer (which I think you can get here -I must confess, I’m not sure who exactly wrote it or where exactly you’re supposed to get it from). This little tool lets you check the contrast of colour schemes so that your users will be able to use the site, even if they’re colour blind. Fair enough. The really exciting bit, though, is the ability to take screenshots and then simulate the different types of colour blindness.

I used this to look at the SharePoint KPI icons. Similar icons to this are available in Excel 2007 for conditional formatting. I thought this was pretty interesting. For a start, it turns out that colour blindness is more complicated that just “red-green-blue” colour blindness, not least because the photoreceptors for the different colours overlap in their response to different frequencies of light. Still, this tool give a good view of the effects of the main conditions. For a full description, read this article at Wikipedia.

KPI - Normal
KPI - Greyscale
KPI - Deuteranopia (Red-Green Colour Blindness)
Deuteranopia (Red-Green Colour Blindness)
KPI - Protanopia (Different Form of Red-Green Colour Blindness)
Protanopia (Different Form of Red-Green Colour Blindness)
KPI - Tritanopia (Blue-Yellow Colour Blindness)
Tritanopia (Blue-Yellow Colour Blindness)

What this shows is pretty obvious – that the icons from red and green are pretty similar for red-green types of colour blindness (what a surprise), but that the shape of the icons still gives a good visual cue to the state of the KPI. Given that (according to Wikipedia) 7-10% of men are Red-green colour blind, this is important. It’s worth noting that women are very rarely colour blind, and that this probably explains my Dad’s dress sense and my Mum’s opinions on it…

KPI Icons neatly designed for colour blindness

3 thoughts on “KPI Icons neatly designed for colour blindness

  1. Yup, it’s interesting given how common colour blindness is how little attention is paid to it! Still, shape changes do appear to be a good cue – witness your mouse pointer, for example.

    The really bizarre thing, though, is that the guy who does our prettiest web pages designs and graphics is himself colour blind. How he manages to do it so well mystifies me.

Leave a Reply

Fill in your details below or click an icon to log in: Logo

You are commenting using your account. Log Out /  Change )

Facebook photo

You are commenting using your Facebook account. Log Out /  Change )

Connecting to %s

This site uses Akismet to reduce spam. Learn how your comment data is processed.