Skip to content

Because some people cannot distinguish colors reliably, we use redundant cues to ensure that any color-encoded information is also accessible through some other modality.  For example, in most countries, traffic lights are stacked vertically, with red on top and green at the bottom so that even people who cannot tell red from green know how what to do.  In GMail's "Message blocked" automated reply, the red light is shown at the bottom.  People with normal color vision will get the message: "Stop!"  But people with some color vision deficiencies will see it as a "Go"!  This is an example where redundant cues instead of reinforcing the color-encoded information, contradict it instead.

red traffic light next to Google's "Message blocked" message, in which an icon in the shape of traffic light shows a red light at the bottom
In Google's "Message blocked" reply, people who cannot see color will get the opposite meaning from those who can. Photo credit: Kevin Payravi, Wikimedia Commons

Modern design uses color to communicate both information and mood.  Several research tools exist that will automatically recolor web sites on the fly to make the color-encoded information content accessible for individuals with color vision deficiencies (CVDs). Unlike all prior tools, our SPRWeb system recolors web sites in a manner that preserves both the color-encoded information and mood.

...continue reading "SPRWeb: Automatically recoloring web sites for people with color vision deficiencies"

The menu board at a local cafe provides a fun example of the failure to apply the mapping principle:

...continue reading "Which is bigger, small or grande?"

A while ago, if you wanted to get vitamin C from Boots (a British pharmacy chain), you would be presented with choices like these:

It is hard to see (and not just because the image is low resolution) that in one of these containers you would find orange-flavored tablets, while those in the other would be blackcurrant-flavored.  Many customers failed to notice these flavor labels and brought home a product that was not what their loved one wanted.  This design failed to prevent customers from making a mistake.

...continue reading "“I hate blackcurrant!”"

The handles for operating the sink and the shower valves in Statler Hotel bathrooms use nearly identical design language:

But they do different things!  In the sink, the two handles control the amount of hot and cold water, respectively.  In the shower, however, the left handle controls the volume of water while the right one is used to control the temperature: ...continue reading "Statler Hotel bathroom"

Great dishwasher, very quiet, too.  But once you close the door and start the cycle, you have no way of telling whether the washing is still in progress or finished:

...continue reading "Are the dishes clean yet?"

On Flickr, the user interface for adding a tag to an image is just a simple text box:

As a result, people make spelling mistakes entering their tags and do not even realize it.  Consequently, for easy to miss-spell concepts, like Massachusetts, the photos are scattered over many miss-spellings of the tag:

...continue reading "Tagging interface on Flickr still fails to prevent errors"