Principles of Design: Value
So far in this series we’ve looked at Balance, Proximity and Contrast as principles of design. You’ve seen how applying these concepts can help you organize your information and make it eye catching. Today we’re looking at Value. Value and color as design principles are related to each other but not every design will have color, but every design will have value. So what is value?
Value, also sometimes referred to as tone, is the relative lightness and darkness of an object. It has nothing to do with the price of the design! As soon as you place an object on your blank canvas (whether for print or web) that element has value. In the image below, the value of each of the silhouetted dogs gives a different impression about the dog. Does the dog on the left have blonde hair? Is he in fog?
Value is relative
Every element in your design has a value from 1% black to 100% black. You’re not always going to be working with a white or grey background though. If you’re working on a black background the value will be 1% white to 100% white. This suggests another quality of value. Value is relative.
As you can see in the example above, the value of each dog is relative to the other dogs and also to the background they’re placed on. The greater the difference in value between the object and it’s background, the greater the Contrast. Value is a very powerful tool when creating the look and feel of a design.
Value and color
Although color is incredibly important in design (and we’ll be looking at color next week), the best designs do not rely solely on color to make an impact. A successful design should work well in black and white to begin with, and this is where value comes into play. Let’s take the example of a couple of logos. I’ve taken two logos from Logopond and desaturated them. The first logo looks good in color but the effect partially disappears in black and white and the logo looks weak.
This second logo, while maybe not looking quite as vibrant in grayscale as in color still holds up well.
You could argue that perhaps the first logo was designed to only be used on a website, and if that’s the case, fine. But you should always think (and experiment with) how your design might look in just one color. Does the design fall apart if it appears in a newspaper or a fax?
Value can be used for emphasis. The poster for Jungle Fever shows two hands clasped together with the value of light and dark skinned fingers providing contrast. I’ve mentioned in the previous design principle posts, that these principles rarely work in isolation. This poster also uses balance and repetition to create and eye-catching design.
The Howard Wing website is simple and elegant and uses values very effectively. The large dark-valued photographic backgrounds used throughout the site work well with the light text.
As we’ve seen in the examples so far, value is most often used to create contrast. However, if you want to create a completely different mood, use values to create a lack of contrast. The White Album by The Beatles uses white embossed text on a white background. You can’t really get more subtle than that. The value comes from the hint of shadow cast by the embossed letters.
Image Credit: Beatles Bible
So to sum up, things to think about when using value in your designs.
1. Value occurs in every design. Just by placing an element on a page, value is created. Have you chosen the values or is it an accident?
2. If you want to achieve contrast, are the values of each element different enough?
3. Are the values you’re choosing eye-catching? Do they help move the viewer’s eye through the design.
4. Have you created the right mood with the values you’ve picked. Should the design be subtle or in your face?
Next week I’ll finish this series by looking at color. I hope you can join me.
