|
|
 |
| |
roportions are mostly about sizes; contrast is (by
contrast :-) about nearly anything. You can't name a thing that
could not be contrasted to some other thing based on any of its
aspects: color, size, shape, font, texture, etc. Contrast is an
immensely powerful concept, probably the most powerful among the
design tools. Once you start analyzing, you will be surprised by
the number of compositions where contrast is responsible for the
overall arresting impression.
At first sight, contrast may seem to you a pretty simple,
probably even primitive, concept. You may even consider it a
"binary" characteristic---i.e., either there is an outspoken
contrast in the composition or there is none. In reality, however,
contrast relations represent a continuum with the infinity of
intermediate "shades," or levels, of contrast. One of the most
important design skills is to choose the level of contrast that's
necessary for your case. |
|
![[Fig.5]](fig5.gif) |
| Fig. 5
An example of purest possible contrast |
| When it comes to practice, this recommendation reveals what may
be considered a paradox. It turns out that contrast is the
strongest when only one aspect is opposed in contrasting
objects---only their size, or shape, or color, whereas all other
aspects are equal or similar. For instance, the two squares on
Fig. 5 have contrasting colors, but their shape and size are the
same. This is the sort of "pure," amplified contrast which is
recognized as such by everybody who knows the very word "contrast."
For a designer, however, this sort of contrast is too
straightforward and even boring to be useful. |
|
| | Thus, the first thing that you
should do is to "soften" the contrast relation by opposing
multiple aspects of objects. Often the best approach is
to have nearly all characteristics contrasted, leaving just a few
common traits which will serve as a bridge between the members of a
contrasting pair. This is important, however, to have some
features left in common, or the contrasting pair will be broken into
separate unconnected objects and any contrast will be lost.
It's an excellent exercise for a designer to investigate contrast
relations and to practice adjusting the level of contrast at
wish.
|
![[Fig.6]](fig6.gif) |
| Fig. 6
Now contrast in color is accompanied by contrast in size |
|
![[Fig.7]](fig7.gif) |
| Fig. 7
One more aspect: contrast in position (inside vs. outside) |
| Let's see how this works. Imagine we've started from the
arrangement of Fig. 5 and would like to weaken the contrast and make
it more pleasing for the eye. The first step is to accompany
contrast in color by contrast in size (Fig. 6). This looks better,
but the composition still looks rather artificial. We should add
one more contrasting aspect, and this one may be a bit surprising to
you---it's the position of the objects. Indeed, on Fig. 6 both
squares stand on the same horizontal level---they are "on equal
terms" regarding their position. But the move illustrated by Fig. 7
introduces another contrasting aspect: now one square is inside
while the other is outside. This certainly does well for the
thing, looks like it starts to breathe! |
|
| | We can make one more step in the
same direction. It may be argued, however, whether changing
the inner square to its opposite, a disk, serves to further enhance
the contrast or weakens it instead below the acceptable level.
But as we don't yet have anything except these two objects, we can
go on and destroy one more tie between them without the fear of
irrevocably breaking them apart. The result might become a
visual for an interesting logo composition (Fig. 8) provided
that you keep the reserved approach and do not overencumber it with
distracting details.
|
![[Fig.8]](fig8.gif) |
| Fig. 8
A contrast-packed logo |
|
![[Fig.9]](fig9.gif) |
| Fig. 9
Contrasting background and foreground |
|
Another real-world example is presented on Fig. 9. Note how the
two text layers, both containing the letters "RWC," are opposed: The
background is big, faded, and blurred, while the foreground is less
in size, dark, and crisp; in the background, the letter W is raised
while in the foreground it's lowered; finally, the background
letters are lowercase while the foreground are uppercase. Such a
consistent contrasting helps to establish a tense dynamic
interrelation within the composition. |
|
| | Now let's find out how the
contrast can be expressed in various materials (from those we
discussed in Part I). In the
realm of form, one may count
such contradistinctions as big vs. small, horizontal vs. vertical,
rectangular vs. circular; the multitude of choices is almost
unlimited. With colors,
we can oppose hue, saturation, or brightness; among these,
contrasting brightness is the most natural choice for the reasons
I've explained in Part I. |
|
| | Probably the most tricky business
is contrasting fonts. The
widely known opposition of serif vs. sans serif fonts is of little
help, since these two varieties of fonts are simply too
different, not contrasting, and it's extremely difficult to
create a balanced logo containing both serif and sans serif
letters (although they can work happily together in a bigger composition
such as an entire page, e.g. used for contrasting headings and body text). For the same reasons, marrying all-lowercase and
all-uppercase styles in one logo is not recommended. Probably
the only meaningful opposition that can be made with fonts is the
contrast of different styles within one font family, such as normal,
italics, and bold (an example of contrasting extra-bold and
extra-light font varieties is shown on Fig. 10).
|
![[Fig.10]](fig10.gif) |
| Fig. 10
Contrasting font styles |
|
| | Lastly, with finishes
contrast is not frequently used. A good logo must tolerate
having all its finishes removed without much damage; this contradicts
the function of contrast which often lies in the foundation of the
entire design and thus cannot be sacrificed freely. You can,
however, decorate a contrast already expressed in form or color by
applying contrasting textures (e.g. polished vs. rough or raised
with a drop shadow vs. flat). |
|
    
|