Design Principles: Balance

Become a Subscriber

There are quite a few concepts in design that have a foundation in physics. Even when dealing with only digital products, balance is intuitively expected by the end user to follow the rules of the physical world.

Balance provides structure to a design often implementing symmetrical, asymmetrical or radial characteristics.

With balance, it is important to first look at the physical world and find various definitions of balance. Consider the following images and think about what holds these objects in balance:

Rocks balanced vertically Egg balanced on intersecting forks

With the rocks, the balance is center-aligned force that applies downward pressure proportionately with a single, linear alignment. The egg balances on the forks because of a downward force that is upheld in two even and opposite directions. Balance in design can take on many forms. Let’s take a look at some popular products in both the digital and physical world and look at how balance plays a part:

Apple Watch examples of Balanced and Unbalanced design

In the illustration above, you will see an illustration of the original first version of the Apple Watch on the left. On the right, the band has been shrunk down significantly. Visually, both of these watches look fairly balanced symmetrically. However, if you were to put the watch on the right on your wrist, chances are that the face would flop around and would feel less comfortable on your arm. Balance here is not just a visual aesthetic, but a physical property as well. Can you imagine how annoying it would be if the watch band was thicker on the top than it is on the bottom, or if the band connected to the face slightly askewed?

Balance is not just a matter of following symmetry either. Asymmetry can still have balance while also creating a very organic feel to a design. While symmetry conveys an obvious structure, strength, and uniformity it can also be quite dull when compared to the movement and contrast of asymmetry. Pictures say a thousand words, so consider the following:

Examples of Symmetry and Asymmetry

From a digital standpoint, it becomes quite clear where symmetry and asymmetry have their strengths. In the context of copy, symmetry really matters and should be the dominant force. Graphical elements, logos and other visual callouts can really benefit from asymmetry. In design, it is safest to follow a strict adherence to rigid symmetry and slowly find your asymmetrical deviations to break up the more mundane aspects.