Pattern 69: Support colour with spatial metaphor
AKA:

Back to Diagram 1 - Getting started Back to Diagram 2 - Useability Back to Diagram 3 - Adding detail Back to Diagram 4 - Workflow/security

View sensitizing image - tbd

You predict that THE HALT AND THE LAME (51) may visit your site and you understand the need to display WORDS BEFORE ICONS (57) and use NATURAL METAPHORS (56).

How can you ensure that colours that you have attached meaning to will be interpreted in the way you intended?

Therefore

Use spatial images to reinforce and disambiguate colour codes that you want to display. Ensure that the images and metaphors will resonate with the intended users and remember that images can mean different things in different cultures and contexts.

This pattern is terminal within this language.


Discussion - forces - known uses

Perhaps the user is colour blind. Perhaps (though it’s unlikely) they have a monochrome display. Perhaps you choose stylized hand gestures. Beware that an outstretch palm is an offensive gesture to a Greek and the number of fingers you need to put up for offense varies between Europe and the USA. Perhaps red, and checkered flag would support the ideas of starting or finishing a task. If sound is an available option, perhaps a closing door sound is useful.

Even if you support your icons with words the visual image will reinforce their meaning and get it over to the user more quickly. Also sometime the words are covered by a graphic that downloads into the same hot-spot after them. The image should carry meaning that distinguished the colours in some spatial way.

Example
One application we encountered needed to show how recently its data had been updated. The designers decided that data that were fresh (less than five minutes old) would be shown in green and data older than two hours would use red. Data with an age between these values would shown in yellow. In this case they were exploiting a common convention that red stands for danger and green for its absence. However, the presence of the middle range suggested the metaphor of traffic lights. This gave them the chance to reinforce the signals they wanted to send to the users with a widely understand visual image and, incidentally insert a finer distinction (read and amber) if it were needed in the future. This would work well in monochrome in countries where traffic signal were standardized as ‘red is at the top’. In this case the users were all in Britain or perhaps the USA so the image would work. In fact it became a much-praised feature of the system.

Browse the language What is Wu? Look at an example pattern sequence Structure of the patterns
Comment on Wu Contributors Return to TriReme home page Links to related sites