Monday, April 29, 2024

The Rule of Thirds in Design: 11 Great Examples

how is the rule of thirds used in design

Photography can definitely benefit from the rule of thirds, whether it’s a landscape, portrait, architecture, or action image. A strong image is about composition, so at its heart, the rule of thirds is a way to design your photo so it’s visually compelling. Position key components of your design on the lines and intersections themselves.

How to Add a GIF to Your Instagram Comments: Step-by-Step Guide

As users and designers, we generally scan an image visually in an F-shape. This is why the grid is so valuable, and it applies to what we do as designers, too. In web and app design, we can place the call to action or a key element on a sweet spot, since we know that the eye will automatically fall towards the four intersection points. It’s important to note that these four sweet spots differ in their appeal to the eye, underlining the fact that going for symmetry in your design is not always the best option. We’ll look at how these sweet spots differ in more detail a little later. The rule of thirds is a handy design tool that creates balance and adds interest to your work.

The Principles of Beautiful Web Design, 4th Edition - Section 1 - SitePoint

The Principles of Beautiful Web Design, 4th Edition - Section 1.

Posted: Thu, 25 Mar 2021 04:10:13 GMT [source]

Gestalt Psychology and Web Design: The Ultimate Guide

The Rule of Thirds Needs to Die a Slow and Painful Death - Fstoppers

The Rule of Thirds Needs to Die a Slow and Painful Death.

Posted: Wed, 11 Jul 2018 07:00:00 GMT [source]

You can create a beautiful design and find a highly functional one. Now that you understand the Rule of Thirds a little better, you’ll be able to easily apply it to your design work. Place your subject on one side in two of the grids and face them toward the other. This draws the eye from one side to the other to see if there is anything of interest. Their website design places the focus on one of their products by placing it in the left middle grid.

How to Use the Rule of Thirds in Photography

Just like we did using columns, another way to break the rule of thirds grid is to focus on using the rows. Start by choosing just one sweet spot, and anchor your design to that. Imperfectly designed elements that ooze depth, layering, and uniqueness. The reading pattern of left to right and top to bottom in the Western world conditioned our eyes towards a diagonal scan from top right to bottom left. The idea behind our design is that viewers scan across the page reading the call to action on the bottom right and move over to the left to find the contact information, which is what they need to take action. New York University law professor Trevor Morrison also pushes back at Trump's claim that his actions surrounding the 2020 election were part of a president's official duties.

In the realm of photography, any subject in the camera frame is positioned in the left or third right of an image, leaving the other two-thirds more open. Most smartphones today come with a similar viewfinder feature shaped like a rule of thirds grid which helps you envision your final capture according to the lines on the screen. On the other hand, this image feels more dynamic and the more you run your gaze through it, the more details you tend to find.

Step 2: Choose a Template or Custom Size

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. In graphic design, the rule of thirds helps designers arrange more complex compositions with multiple elements. Using the boxes and grid lines, you can place objects and text according to their importance. This helps to create space and avoid a cluttered design or visually overwhelming your audience. By placing key subjects off-center according to the rule of thirds, we avoid placing them smack dab in the middle, which can create a static and uninteresting composition.

how is the rule of thirds used in design

How to Use the Rule of Thirds for Powerful Designs & Photos

It’s often not just the quality of the pictures, the object in the photos, or even the colors in them. But more often than not, it is a good composition and strategic placement of elements to make it more appealing to the eye. As CEO of CompanyFolders.com, Vladimir is a knowledgeable authority in print marketing and graphic design for businesses. With his team of designers and experts, he helps customers put forth the best possible impression with high-quality collateral. Learn more about Vladimir’s history and experience, and connect with him on Twitter. So how could an example of the rule of thirds in film translate to print design?

Graphic Design Principles: Balance and White Space

The rule of thirds also improves the overall composition of your design. This strategic placement captivates the viewer’s attention, making your designs stand out from the crowd. One of the significant benefits of the rule of thirds is its ability to create visual interest.

how is the rule of thirds used in design

This image's alignment and compositional elements teach more than just the rule of thirds. Here, the photographer has used the rule of thirds loosely, almost breaking it. If you want to click a picture where the subject is too small, the rule of thirds breaks here. If you want to highlight the subject, keep the rule of thirds aside and place it at the center of the image. In this image, the buildings, along with their reflection, form one unit, thus making the rule of thirds tricky to implement. That said, even with the image split neatly into two, where does your eye focus on?

Now that we’ve started covering the topic of proportion in design (beginning with the Golden Ratio article), let’s look at another vital subject. Getting a firm grasp of the Rule of Thirds will empower you to fine-tune your eye to bring out the best of the elements in your design by placing them where they belong best. The latter will help the viewer ultimately feel that they are more immersed in the space, moving physically through it, as opposed to head-on shots that can feel like staring at a TV screen. Usually designers will place important images, links, text, or calls to action near the four points of the grid so users can quickly get an idea of what they are looking at and how to proceed with main tasks. The rule of thirds can be found in photography, web design, architecture, cinema, and more.

In looking at it, we’ll understand how the Golden Ratio was once applied to grid design. Like the Golden Ratio, the Rule of Thirds is ever-present, and the results of its application surround us. Speaking of the Golden Ratio, let’s see how it relates to the Rule of Thirds in our quest to make the best layout designs. Help create a more inclusive world and earn royalties when you share your photos on Noun Project.

While the rule of thirds is a valuable guideline, it’s not set in stone! The key is to be intentional with your composition and understand why you’re choosing to deviate from the rule. For example, in this web design, the main focus is on the shoes. When you perceive this image at first, your eyes immediately fall to the call to action placed on one of the top right sweet spots.

In this image, the object (the building) has been centralized to achieve a strong sense of symmetry. Although quite beautiful, this image feels dead, empty, and stagnant. There is no place for the eye to move because the center of the photo retains a strong focus.

No comments:

Post a Comment

A complete guide to the rule of thirds in UX UI

Table Of Content The Visual Palette – Depth of Field Eye-Catching Fonts to Grab Attention on Your YouTube Thumbnails ( Best NHL Hockey Logos...