Color is a visual cue in design can be used to create hierarchy, mood, and continuity. It is defined as the hue, lightness, and brightness of an object.
In interaction design, it can also mark importance, provide feedback, and provide directional cues.
- In the United States, importance or required information might be marked in the color red
- Buttons might change color to provide feedback on what’s clickable, when a cursor is hovered over the button, when the button is pressed, when a button is clicked, and when a button (or, more often, a link) has been visited
- Color might provide a pathway to a preferred action, like having the call-to-action action being a colored button
- Color might also be used to separate information: Having text in boxes of color to distinguish one type of information from another, like sidebars.
- Typically green is used to confirm or to advance. Icons are greyed out to indicate they are unavailable. Red used to highlight missing information. Green to indicate submit or accept. Colors can turn from dull to bright as the user makes good progress.
- When recording a video, a red light indicates that the recording is in progress.
- When items are missing from a submitted form, highlighting missing fields with a color
- Color feedback (like the above) can tell user where they have been and can go in a process.
It is common knowledge that colors convey symbolic meaning for in different cultures around the world. For instance, in the United States black is worn ceremoniously to funerals, while in China white is usually worn. The repeated use of these colors creates connotations for colors. Additionally there have been many studies on the psychology of colors.
And in interaction design green, yellow, and red are tied to stoplight color and usually refer to actions that a user can do (green light), can’t do (red light), and/or neutral actions (yellow light).
The cymbolism project builds off of the idea that there are shared cultural associations for words by asking in visitors to indicate which colors they most associate with a word:
Color in cultures infographic:
- Seeing too many colors could be overwhelming to the user. Seeing many red highlights could feel discouraging.
cover image: “Boutet 1708 color circles” by C. B. (probably Claude Boutet) – Traité de la peinture en mignature (The Hague, 1708), reproduced in The Creation of Color in Eighteenth-Century Europe. Licensed under Public Domain via Wikimedia Commons – http://commons.wikimedia.org/wiki/File:Boutet_1708_color_circles.jpg#mediaviewer/File:Boutet_1708_color_circles.jpg