42

Is there a way to test if a GUI is usable for color blind person?

I know that it has many degrees and I guess that's why simply doing a screenshot in black & white is not the best way to test the usability of a GUI for a color blind person. What is the best way or best tool to do it?

Jon Seigel
  • 12,251
  • 8
  • 58
  • 92
Patrick Desjardins
  • 136,852
  • 88
  • 292
  • 341
  • 12
    You could ask me to take a look. – John Gietzen Oct 05 '09 at 14:39
  • 2
    This is an important subject for all developers to consider. In the US, most businesses producing software are subject to Section 508 regulations. Even in industiries that have exemptions (i.e. military), there is still a lot of value in considering UI accessibility. – James Schek Oct 05 '09 at 15:43
  • 2
    As a color blind person, I just want to say thank you for bringing this up. My disability really kills my ability to read certain things (in my line of work particularly plots and graphs distinguished by color.) Your choice of colors in apps can potentially destroy any usability for 1/20 of us! – temp2290 Oct 07 '09 at 19:41

11 Answers11

25

Search for color blindness simulation tools on the net. You will find for example

f3lix
  • 29,500
  • 10
  • 66
  • 86
  • From you 15 tools the program called "ViSolve" is very interesting because you can use it in all application and not only webpage. Very nice. – Patrick Desjardins Oct 05 '09 at 14:54
10

you can change the color of your screenshots using this website: http://www.vischeck.com/daltonize/

Gregoire
  • 24,219
  • 6
  • 46
  • 73
  • Nice, that is pretty slick. I was actually planning on creating something like that. – John Gietzen Oct 05 '09 at 14:44
  • 7
    Note that this tries to produce images that a color-blind person can perceive in a similar way to one with normal eyesight. It doesn't simulate how a color-blind person perceives the original image. There is a different tool for that: http://www.vischeck.com/vischeck/ – Joey Oct 05 '09 at 14:46
5

Remember that a colorblind person doesn't necessarily see the world in black and white but rather some colors change their appearance. There are several different kinds of color-blindness out there and each looks different. Here are some images illustrating the different variants. For the most part it's either reddish or greenish tones that are affected, while most of the time blue colors remain what they are.

You can try out how your UI looks to various color-blind persons with this tool for example.\

The Windows User Experience Guidelines also cover color with respect to color blindness.

Joey
  • 344,408
  • 85
  • 689
  • 683
  • Exactly what I said in the question ;) This is why I am asking for a tool or method. See the second sentence in the question "I know that it has many degree..." – Patrick Desjardins Oct 05 '09 at 14:41
  • Eep, sorry. Memo to self: Read questions more thoroughly. – Joey Oct 05 '09 at 14:48
  • 4
    +1 Windows User Experience Guidelines: "While color is the most obvious attribute of many designs, it must always be redundant." – Jon Seigel Oct 05 '09 at 15:02
  • Jon: The whole guidelines are a good read, imho. It's just the sad fact that no-one reads them :-( – Joey Oct 05 '09 at 15:04
3

I was told by one of my users that his sight disability requires him to use the High Contrast Black setting. So what I do to test that my program will appear fine to sight impaired people (including various types of color blindness), is to temporarily change to that setting.

Sample of High Contrast Black http://www.digitalexpedition.com/main/assets/images/HighContrastBlackTheme.jpg

To do so in Windows XP, go to Accessibility Options in the Control Panel. On the Display Page, click "Use High Contrast" and from the Settings button select: "High Contrast Black (large)".

The procedure is similar with Windows Vista.

I found a number of colors needed adjusting when I did this. When going back to normal viewing mode, the result was slightly higher contrast but not too noticeable changes for normal sighted viewers, but better contrast for color blind and other vision impaired users.

If this still doesn't help a person with a particular form of color blindness, I would then recommend they try using High Contrast Black as their normal option, since they're missing out on more than just my program.

lkessler
  • 19,819
  • 36
  • 132
  • 203
2

To test a web page for colorblindness accessibility, you can try out:

http://colorfilter.wickline.org/

Anthony
  • 36,459
  • 25
  • 97
  • 163
1

There are a number of tools listed on this site that provide a filter or a way of looking at your website/application/etc. as if you were colorblind. This is a very simple way to test and does not require you to find every color-blind type individual out there (as there are different levels of color blindness).

JasCav
  • 34,458
  • 20
  • 113
  • 170
1

Technically, there is really no way in which you could do this other than to use a black and white interface. There are many different types of color blindness and there are varying degrees to each of those types (I happen to have Tritanomaly, which means that I have difficulty with the entire spectrum of Blue). There is a decent Wikipedia article about clorblindness(Color blindness)that describes the differences. There are plenty of websites that offer different ways of designing for the color blind, but in actuality, it is difficult to make something look good to color normal people that would also be visible to color weak/blind people. Go with Black and white and it will look good for everyone (think I-tunes).

Michael Brown
  • 2,221
  • 2
  • 17
  • 34
1

Color Oracle

It's for Win/Mac/*nix. It takes the image that is currently shown on your screen and applies a colorblindness filter, so that you easily can see how it looks, without having to capture screenshots and use photoshop to do the filtering. You can even assign a hotkey so that you instantly can see it. Best of all it's free.

Colorblind Vision

iPhone app for realtime simulation of colorblindness. I wrote it as my first iOS program.

neoneye
  • 50,398
  • 25
  • 166
  • 151
0

I just found from Futjusu "Color Doctor" that can display website in 4 modes of color blind: Color Doctor.

Patrick Desjardins
  • 136,852
  • 88
  • 292
  • 341
0

There is a cool iPhone app called Simulate that will allow you to take a screen-shot or a photo to see how things look. It also includes sample images that really let you see how things might appear to a color-blind person.

meme
  • 11,861
  • 2
  • 19
  • 20
0

I've been using Color Oracle on OS X but just bought xScope today because it's on a 30% discount and also has a ruler, guides and a color picker among other tools.

Kris Khaira
  • 132
  • 11