Chapter 4

Balance…

Objectives• Learn more about balance and appreciate its importance.

• Understand the effect of balance in a design.

• Identify the two main types of balance: symmetrical balance and asymmetrical balance.

• Discover what visual weight is and how it affects the balance of a design.

• Analyze how color works with the principle of balance.

What is Balance and Why Use It?• A balanced design is one in which the visual weights of all of the elements are equally dispersed throughout the layout.

• People find pages with good balance more comfortable and functional than poorly balanced pages.

• Balanced designs seem more resolved than an unbalanced design.

Visual Weight (1 of 2)

• Visual weight is the illusion of physical weight of a visual element on a page.

Visual Weight (2 of 2)• Size, color, boldness, and texture of a visual element contribute to its visual weight.

• Images carry more visual weight than body copy, as people tend to look at images before text.

• In determining balance the visual weight of each element must be considered and counterbalanced with other elements on the page.

Symmetrical and Asymmetrical Balance

• There are two types of balance:

- In symmetrically balanced layouts visual elements are mirrored from side to side or from top to bottom

- In asymmetrically balanced layouts visual elements are arranged unequally, yet balanced, on the page

Symmetrically Balanced Layouts (1 of 2)

• Are easy to create

• Convey a formal, dignified, and historical feeling

• Lack dynamic movement and are often static

• Are a safe solution

Symmetrically Balanced Layouts (2 of 2)

• Symmetrical layouts are identified by drawing an imaginary axis line through the center of the page.

Asymmetrically Balanced Layouts (1 of 2)

• Are more challenging to create

• Convey a feeling of dynamic movement

• Are visually interesting

• Are energetic, informal and dynamic

Asymmetrically Balanced Layouts (2 of 2) • To identify an asymmetrically balanced layout draw an imaginary axis line through the center of the page.

• The two halves will be different, yet a successful layout will still be visually balanced.

Symmetrical vs. Asymmetrical

A Few Words About Proportion

• Striking a working balance depends on finding the right sizes and visual weights for the elements—words, phrases, and graphics—in the space.

• Finding a working balance depends upon practice. Formulaic approaches yield dull and dry results that appear amateurish.

Balance Example (1 of 3)• The balance on this page is awkward:

- Too much white space (space without visual elements) at the bottom of the page

- It shows weak emphasis

WHITE SPACE – Space on the page not filled by text, graphics, lines, or other visual elements

Balance Example (2 of 3)

• The balance in this version of the page is better, but still needs improvement:

- As the bugs and headline are about the same size, they seem equally important

- Color in just the headline leaves the page visually heavy

Balance Example (3 of 3)

• The asymmetrical balance on this page works better than the original.

- Type at an angle gives this page dynamic movement

- A new typeface and color in the headline and subheads add visual excitement and balance each other.

Taking It A Step Further

Figure 4-11: Positioning type so that it runs uphill has a positive, energetic connotation. The type seems dynamic, as if it is moving with energy into the future

Figure 4-12: Don’t stagger type. It looks awkward and is difficult to arrange gracefully on the page.

TIP:Adding a drop shadow behind an element adds a “dimensional” look, Skewing elements away from the horizontal and vertical adds dynamic energy to a layout.

Final Balance Example

Chapter Summary

• Unbalanced pages seem amateurish and may drive readers away.

• Balanced pages are more comfortable to readers and enhance communication.

• There are two types of balance: symmetrically and asymmetrically balanced layouts.

• The visual weight of elements must be considered to strike a working balance.

MINI QUIZ #4 - asymmetrical - dignity

- visual weight - white

- informal - symmetrical

- dynamic - formality

1. The illusion of physical weight of a visual element on the page is called ________ ____________.

2. There are two different kinds of balanced layouts ___________ and ____________.

3. Symmetrically balanced layouts convey a feeling of history, __________, and ____________.

4. Asymmetrically balanced layouts are more energetic, ___________ and ___________.

5. Space on the page not filled by text, graphics, lines, or other visual elements is called ________ space.

EXERCISE #1

DIRECTIONS: Make a symmetrically

balanced layout and an asymmetrically

balance layout. Feel free to add visual

elements such as rule lines, triangles, or

rectangles to enhance your page design.