Fundamentals of design: Balance Monday March 17, 2008, 2 comments

The simplest way to visualize the concept of Balance is to imagine a child’s see-saw or teeter totter. Such apparatus were routinely found in children’s play-parks across North America and Europe.

See-saw

Formal (symmetrical) balance

Balance can be achieved by putting two equally weighted items at equal distances from a balance point. This is called formal balance (or symmetrical balance), and is the simplest sort of balance to achieve. In a visual composition, formal balance can be achieved by imagining a line through the center of the piece, and placing two identical objects at equal distances from and on either side of this imaginary line.

In terms of the see-saw metaphor, this is equivalent of two equally heavy children on either end of the see-saw.

A balanced see-saw

Informal (Asymmetrical) Balance

But what if the elements of a visual composition are inconveniently of different sizes and shapes? If there are no identical objects, formal symmetry cannot be achieved. Enter informal symmetry.

If there are two children of different weight on the see-saw, the heavier one can move closer to the fulcrum. The laws of leverage come into play, and at some point as the heavier child approaches the center of the see-saw, balance is again achieved.

A balanced see-saw with different sized riders

By putting one heavy weight closer to the balance point on one side of the see-saw, and a lighter weight further away from the balance point on the other side, a balance can be achieved. This also applies to larger items one one side and multiple smaller items on the other side.

A balanced see-saw with multiple different sized riders

Graphic design rarely involves only two page elements, but by moving objects closer or further away from the imaginary center line, an informal balance can be achieved in a visual composition. There are some rules that govern balance in visual composition. These touch on some of the elements of graphic design, to be covered in future posts, but in general:

  • Objects closer to the balance line are heavier than objects further away (Position)
  • Objects that imply a direction (such as triangles, lines or arrows) toward the balance point are heavier than objects which imply a direction away from the balance point (Direction)
  • Darker objects are heavier than lighter objects (Value)
  • Larger objects are heavier than smaller objects (Shape)
  • Objects with more detail are heavier than less detailed objects (Texture)

Radial Balance

The least common kind of balance, and the only type that does not easily lend itself to the see-saw metaphor is called radial balance. Instead of using an imaginary line as the balance point, radial balance uses a single point. Despite radial balance often being the easiest type of balance to identify (think spokes of a bike wheel, or the propellor of an airplane, or even the petals of a flower), it is likely the least implemented type in terms of composition. It can be both formal, like the bike wheel or propellor, or informal, like the uneven size and shape of the petals of a flower or a child’s mobile hanging from the ceiling.

Imbalance

Imbalance is also part of the designers repertoire.

An unbalanced see-saw

Imbalanced composition can impart tension and emotion into layout. The designer can create tension and activity on a page by manipulating balance in both the large scale (the entire piece) and the small (individual sections of the piece). By using imbalance creatively, the designer can create an emotional mood with layout alone. In the hands of an experienced designer, imbalance can be used as effectively as balance to enhance the message.

Conclusion

Balance is one of the most important fundamentals of composition. By understanding and creatively using the principles of balance, the designer enhances the message and improves the clarity of the content.


Comments

Jonathan E Thursday March 27, 2008


Hey man, great post. I also wanted to let you know that while reading it, I was once again impressed again by your new (it’s still new, right?) design for Rain. The simplicity shines.

Adrian Thursday March 27, 2008


Ah Jon, you’re too damned good to me. I am loving my site, though, I really have to say that.

I enjoyed the design article. I had written it a few years ago, but this is a wholly new and rewritten edition, complete with some (if I might say so!) nifty illustrations.

Hope all’s well with you.

Commenting has ended for this post, but I'd still love to hear from you.

The website of Adrian Lebar

A Rain of Frogs is written, designed and built by Adrian Lebar, a twenty(!) year veteran of web design and development. He is currently managing web and mobile development teams at Canada’s largest and most beloved classifieds site, Kijiji!

He is a father, sailor, snowboarder, skier, cyclist, writer, artist, graphic designer, classically trained musician and afraid of heights.

Adrian is not currently available for freelance and contract work. Learn more.

A complex system that works is invariably found to have evolved from a simple system that worked. The inverse proposition also appears to be true: A complex system designed from scratch never works and cannot be made to work.”
- John Gall

Twitter

  • Who'd have thought Star Wars would make the cover of Vanity Fair? The geek truly has inherited the Earth. t.co/jEJJH5lvYc via @io9 Tuesday May 23, 2017
  • I think I just reached peak first world problems when I finished vacuuming my back patio... Saturday May 20, 2017
  • @"And I thought I knew what diversity in tech was" t.co/MetOuQGCR1 on @LinkedIn Monday May 15, 2017
  • Watch “Klementhro” on #Vimeo t.co/8EIbNLFMQc Wednesday May 10, 2017
  • ‘…once a "good practice" becomes mainstream we forget how it came to be, its benefits, and the cost of using it.’ t.co/z2B4AUpMDu Tuesday May 9, 2017
  • Sometimes the universe dents back. Monday May 8, 2017