Symmetry

Symmetry is when elements are arranged in the same way on both sides of an axis. Perfect symmetry is when elements are mirrored over the axis and exactly the same on both sides.

Balance

Symmetry adds balance to a design. When elements are the same on both sides of an axis, the design feels harmonious. If we design a street with five houses on one side and five on the other, walking down the street would feel comfortable because the arrangement of homes is balanced.

An example of symmetry is the arrangement of music covers in the Rdio app. Elements on both sides of the screen are the same format. This type of layout is easy to read top to bottom and left to right.

Asymmetry

Designs are asymmetrical if the arrangement of elements are different on both sides of an axis. If we design a street with five houses on one side and one on the other, the street will feel unbalanced and perhaps uncomfortable.

An asymmetrical design is the feed in the Pinterest app. Although the left and right columns are the same width, the height of elements in each column varies. The variances make it difficult to scan from left-right. Even the slightest bit of asymmetry can throw off the balance and comfort in a design.