Design Principles

Signal vs. Noise Ratio (SNR) is a principle of design that focuses on the ratio of relevant elements to irrelevant elements. A design should be balanced, purposeful, and without clutter. 

In other words, less is (usually) more. 

When a design is filled with irrelevant elements, it becomes straining to the viewer. It results in cognitive overload. Therefore, to prevent this, it is important to make sure all elements of a design are presented in the most effective manner. Images should be directly relevant to the message. The text should focus on only the information that must be read (key phrases, quotations, etc.); other verbal information should be presented through narration. 

The graph on the right is not crowded with unnecessary images, 3D elements, or busy text. It presents exactly what is needed—and nothing irrelevant. 

The Picture Superiority Effect is self-explanatory. This principle of design refers to the idea that pictures (photographs, graphics, and other images) are more effective design elements than written text. Pictures are simply more memorable. In terms of education, a learner is more likely to remember the information if the information was presented through images. 

The slide on the left comes from a presentation called "The power of digital assessment." On this particular slide, the designer is comparing technology from the years 2000 and 2015. While the designer could have chosen to describe these evolutions using words (i.e., "computer," "smartphone"), he instead chose to use a more memorable format: minimalistic graphics. 

The next principle of design encourages one to utilize empty space in a design. By creating negative, white space in a presentation or other graphic design, the designer brings more attention to the important elements. This relates back to the SNR principle: less is more. Designs that include properly placed negative space come across as more sophisticated and professional. They don't feel cluttered; instead, they feel intentional and purposeful. 

The design on the right is a slide from the presentation, "Critical pedagogy: education in the practice of freedom." It presents a title and image. However, it also includes a significant amount of empty space. The empty space allows the viewer to focus solely on the important elements. Therefore, the empty space is not pointless; its purpose is to enhance the design.

Contrast is another design principle that allows a designer to emphasize the more important elements of a design. Contrast creates differentiation. Contrast can be created using different fonts, colors, sizes, or shapes. 

The textbook cover design on the right is a prime example of contrasting elements in a design. For one, the background color is very dark. However, the title of the book and the corresponding images are brighter (white and silver). These elements stand out. If the background were a lighter color, the important elements would not stand out as much. 

This designer also uses contrasting fonts for emphasis. The title is larger and uses a more distinguishable font. The other textual elements ("volume - 1" "Department of School Education," etc.) are written in a smaller, more basic font. 

Repetition is the use of repeating elements to make a design feel and look cohesive and professional. If every slide in a presentation utilized different fonts, colors, and styles, the presentation would feel incoherent. It is important, however, to find a balance of repetition. Presentation slides should not look exactly the same, or they will become boring to viewers.

Consider these slides from a presentation called "Document 4 Learning." Although not every slide looks identical, the presentation conveys a coherent message and utilizes cohesive elements. For example, the color blue is consistent. The stylistic watercolor elements occur on each slide, even though they look different. Additionally, the fonts remain the same, and the designer uses one artist's drawings; therefore, the drawings follow a consistent art style. Overall, no slide feels out of place. Everything belongs. 

Alignment refers to how elements of a design are lined up. When elements are misaligned or randomly placed, it can be difficult for the viewer to follow the natural progression of the design. Elements can be aligned symmetrically, to the right, to the left, or in the center, for example.

In the poster to the right, all of the text is aligned neatly to the left. Although there are different textual elements, there is an "invisible line" that connects them. The learner can easily read through the text naturally, without bouncing around to different parts of the poster. It would be more difficult to consume the elements of this poster if they were randomly placed throughout the design. 

Proximity is important in any graphic design. Proximity is the principle that elements of a design that go together should be placed together. In other words, images, graphics, and text should not be placed far apart if they are related. This is a similar concept to alignment. However, while alignment focuses on how objects are lined up, proximity refers to how they are grouped.

Consider the poster to the left that features three forms of bullying. Instead of clumping all of the information together, the designer chooses to physically separate the types of bullying into three distinct sections. Within these sections, the titles, graphics, and labels are placed in close proximity. This allows the message of the design to be comprehended easily.