The Rule of Thirds in Design

What is the Rule of Thirds?

The rule of thirds is a design guideline that involves dividing an image into nine equal parts using two sets of parallel lines, one vertical and one horizontal that intersect at four points. The rule is used to place the important elements along these lines or their intersections. John Thomas Smith, an 18th-century painter, and writer, first used the term “rule of thirds” in 1797 in his book Remarks on Rural Scenery. Smith acknowledged the power of this grid technique to maximize the effect on the viewer’s eye.

The rule has been used for over 200 years and is related to the Golden Ratio. The rule of thirds is also known as the golden grid rule. Designers, photographers, and artists commonly use the rule of thirds. The rule of thirds is often used to create points of interest.

Rule of Thirds

How is the Rule of Thirds used for Design?

The Rule of Thirds is applied in the following manner:

1) Divide the design area:

The rule of thirds is a design concept that involves dividing a design area into a 3×3 grid, creating nine equally sized quadrants.

2) Position the most compelling elements:

Position the most compelling elements in a design area along one of the intersecting points, also known as crash points, on the grid. For example, in a portrait photo, put one of the eyes on a crash point.

3) Top to Bottom approach:

Look at design elements from up and down to see which third of your design area you want to place the heaviest visual elements.

4) Align subjects diagonally:

Instead of placing the horizon line at the center, align it with one of the grid lines.

5) Create a strong focal point:

For frame-filling wildlife or pet shots, align their heads with the upper or lower power points. For close-up shots, consider placing the animal’s head along an upper power point, while aligning their body along a lower power point

The Rule of Thirds in UX Design

The Rule of Thirds is a compositional rule used in photography and other visual arts.

• Placing Key elements: It is used to arange the elements in an image. it involves placing important elements on one or more of the four gridlines created by dividing your image into nine equal sections (three rows and three columns).
• Hierarchy: The rule of thirds can help establish a hierarchy of elements within the interface. More critical elements can be placed at the intersections to draw attention, while less important elements can be placed along the lines.
• Visual Flow: By aligning elements with the grid lines, designers can create a natural flow for users’ eyes as they navigate the interface. This can improve readability and guide users through the content more effectively.
• Whitespace Management: The grid created by the rule of thirds also helps in managing whitespace within the interface. Proper spacing between elements contributes to a cleaner and more organized design.
• Responsive Design: The rule of thirds can be particularly useful in responsive design, where elements need to adapt to various screen sizes. By following the grid system, designers can ensure that key elements remain properly positioned and maintain visual balance across different devices.

Examples of the Rule of Thirds

1) Photography: In Photography, important elements are placed in left and right third of an image, with other two thirds more open. This is possible using the Rule of Thirds. It creates visual balance and flow, and helps photographers and editors how much background and foreground are necessary for a visually appealing photograph. Professional and Portrait Photography is done by following this rule.

2) Cinematography: Objects are aligned in such a way that it interests the users to watch the film. One of the exapmle is in the 2021 movie Dune, Denis Villeneuve draws the viewer’s eye to the top third of the grid where the emperor’s entourage disembarked from their ship. He slowly pans down as the emperor’s messenger progresses down the carpet, keeping them in the top one-third of the shot.

3) Painting and Drawing: Artists use the Rule of Thirds to create balanced and vitually apealling compositions in their paintings and drawings. By placing key elements off-center, artists can guide the viewer’s eye around the artwork and create a sense of movement and depth.

4) Graphic Design: Designers often use the rule of thirds to arrange elements within a layout. Whether designing a website, poster, or brochure, placing important elements along the imaginary lines or intersections can create a sense of balance and visual interest.

Conclusion

While the rule of thirds is a valuable guideline, it’s important to recognize that it’s not a strict rule but rather a flexible tool that can be adjusted and interpreted based on artistic intent and context. In practice, the rule of thirds serves several purposes. It helps draw the viewer’s attention to the focal points of the image, creates a sense of balance and harmony, and adds visual interest by breaking away from symmetrical compositions.

The rule of thirds is a fundamental principle in visual arts that guides the composition of images, films, and other visual media. By dividing the frame into nine equal parts with two horizontal and two vertical lines, this rule encourages placing key elements along these lines or at their intersections. This technique fosters dynamic, balanced, and visually engaging compositions.