The 5 Rules of Design Composition and Layout
Everyone knows to get better at any art form, you have to first understand the particular tools and procedures that form it. Design is no different from playing an instrument or even a chef making a meal. If the elements of graphic design (line, color, texture, shape) are the ingredients laid out in front of her and the principles of design (movement, rhythm, proportion, etc) are the recipe she uses to make the meal, then think of design layout and composition as the final plating.
1. The Grid
Most designers see an invisible grid running through all their designs. In modern web design, clean grid lines have become popular and almost impossible to avoid. There are a few simple reasons for this: grids make your designs cleaner, more efficient, and easier to adapt. Grids bring organization not only to the design but to the process of creating a design. Say you want to create a poster for a lecture series. Create a strong grid and if the dates, times, images, and colors all change, your basic designs will feel related. Instant consistency and less time updating and adjusting. Baseline grids also give you a great road map when working in a team. Every designer knows the feeling of relief that comes with opening someone else’s design composition & layout and seeing a clear grid to follow!
2. Emphasis and Scale
The eye generally needs a place to rest or something of interest to hold it, otherwise, people will look at your design and quickly move on. Say you take a photograph of your mom at a family reunion. Your purpose is to bring attention to the moment and the joy of the gathering by making your mom the subject and focal point of your composition. To communicate the message to the viewer that your mom is the focal point, you want to use scale and emphasis.
Isn’t everything in life a search for balance? Design is no different. Designers must constantly juggle different elements to find harmony in their design. Imagine an invisible set of scales in each design and make sure you don’t tip the scales by cloistering elements on one side of your grid. The website design above does this cleanly by marrying large type elements (“What We Do” “Our Works”) with smaller, equal-sized paragraphs of longer explanatory copy.
Keep in mind that in terms of composition, white space (or negative space) is also an element. White space gives our eyes paths to follow through the design. Give each element on the page some space to breathe and balance between positive and negative space will emerge organically. You can see how moving the elements in the web design above closer together (thus shrinking the negative space and disrupting the balance of the piece) makes the design claustrophobic and ultimately unsuccessful.
4. Rule of thirds
The Rule of Thirds is inescapable in design. It’s a fundamental guideline that’s so simple and effective, it often feels like a cheat: divide your design into three rows and three columns. The points where the vertical and horizontal lines meet form natural guidelines for where you should place your subject and supporting elements. Struggling with finding balance in your designs?
5. Rule of odds
The Rule of Odds says that pleasing compositions seem to often have an odd number of elements placed in the foreground, most commonly three. The two objects on the outside both balance the focal point in the center, creating a simple, natural balance. (If you’re a wedding photographer this is probably the most difficult rule to follow.) This is often true in logo design, where a centered mark might be offset on either side by the company name, like in Needle Records’ logo.