This chapter is from the book
This chapter is from the book
This chapter is from the book
Using Color
A lot of the basic principles of using color are implicit in the color harmonies we've just examined—these color harmonies represent basic organizing principles.
Beyond the harmonies, one begins to enter areas of aesthetics that are, unfortunately, outside our scope. Is red sexy? Is blue calming? Yeah, well, sometimes. And sometimes pink is romantic, and sometimes it's funky.
Realistically, the only useful advice I can give you is to look at stuff. Art galleries are wonderful, of course, but magazines, and restaurants, and the people you see walking down the street are also sources of color ideas.
Most importantly, if you work for a company, look at their marketing materials. Even small companies probably have brochures, or at least business cards, and the colors used there are de facto standards for the company. Think of IBM blue, UPS brown, or Martha Stewart green.
In choosing your color scheme, you should also remember the basic principles we studied in Chapter 1, Interface Design. Alignment and proximity don't really apply, of course, but contrast, consistency, and focus and flow certainly do.
To learn to use color, look at stuff.
At the beginning of this chapter we talked about the three dimensions of color: hue, saturation, and value. Any combination of these qualities can be used to establish contrast.
Obviously, you must have sufficient contrast between elements for visual clarity. That said, color schemes with greater contrast, or contrast in multiple dimensions, tend to be brighter and more casual, while color schemes with less contrast tend to be more formal. There are exceptions, of course, but think of a page in several bright primary colors compared to one with, for example, navy blue type against a pale blue background.
Contrast in color is one of the two primary methods for controlling focus and flow. (The other is size.) The one red item on an otherwise beige page will invariably have the most visual weight.
Red is often used to indicate danger, and we're conditioned to pay attention to it. But that principle has less weight on a computer screen than it does in the physical world—the single beige item on an otherwise red page will also be the first to draw the eye. It's the contrast that attracts the viewer's attention, not the color's conventional meaning.
Red is one of the best examples of conventional color uses. Green and yellow are others. The conventional meanings of these colors—stop, go, caution—are constantly reinforced. As always, it's best to comply with the convention unless you have compelling reason not to.
There's a reason warning icons are yellow. Make yours purple, and you're just going to confuse people. The exception, of course, is if your color scheme is predominantly yellow. In that case, purple's not a bad choice, since it's yellow's complement, and thus stands out strongly. (But I'd probably use red, myself.)
One final note on using color: Color is useful for distinguishing things, but not particularly good for coding them. We all do it of course, and color-coding doesn't do any harm; just don't rely on it exclusively. In the first place, a surprising number of people are color-blind. But even among those who can distinguish colors easily, you can't just assume that people are going to remember that the green Contact Details screen is used for customers while the otherwise-identical Contact Details screen is used for employees. (Yep, I've seen it.)
Think about it—when you were a baby, somebody (presumably) taught you that red things were often hot. But unless you're a prodigy, it's unlikely you got it the first time up, and I'd be willing to bet that you've burned yourself once or twice since then. And "red means ouch" is a lot more compelling than "yellow means employee." So use multiple cues—color by itself is insufficient.