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.

If you are ten years out of high school and you say, "damn, those were the best years of my life," I don't want anything to do with you. You scare me.”
- Stephen King

Twitter

  • How the hell is the new Tesla Roadster accelerating faster than 1G? What am I not understanding? Friday November 17, 2017
  • “Why software engineers don’t get jobs: Three horror stories” — Iwan t.co/Zrtpia4hgz t.co/lHuOvwndOJ Tuesday November 14, 2017
  • Slaughterbots t.co/578dddG5kE via @YouTube Tuesday November 14, 2017
  • Kenny Holland - Can't Help Falling Over The Rainbow ft. my sister Capri t.co/Fp1imZNgFB via @YouTube Tuesday November 14, 2017
  • Happy birthday Matthew G, wherever you are. Tuesday November 14, 2017
  • “‘Make relationships, not things.’” — @stevebryant t.co/deMwdrUX8x Wednesday November 8, 2017
  • Today’s web is probably much more useful than the web of ten years ago. But it’s a lot less fun too. Wednesday November 8, 2017
  • “...focus of Silicon Valley used to be innovation with the bonus of money but those priorities seem to have flipped” t.co/rS5k3ZASeU Wednesday November 8, 2017
  • t.co/AgjK0K3xBC Wednesday November 8, 2017
  • Watch “I AM HERE - short film” by @EoinDuffy on #Vimeo t.co/QjStS1zEUk Tuesday November 7, 2017