Exploring Gestalt Principles of Design
Designers have long been preoccupied with the way psychology impacts their trade. A general summary of some of the most important aspects of design psychology, the Gestalt principles are several rules that summarize how our minds process visual information.
Building with these design fundamentals allows for a more intuitive design and lessens the cognitive load on the user, meeting their needs in an easier way and enticing them to use the product again in the future.
Many designers have come across Gestalt principles before but many have a narrow view on how they can be applied. Read on for a full rundown of the Gestalt principles and how they’re used to build beautiful, effective designs.
Where Did Gestalt Principles Come From?
No, there wasn’t some design genius named Gestalt who first identified all these design principles. These rules are based on the work of three psychologists named Max Wertheimer, Wolfgang Köhler, and Kurt Koffka. Beginning around 1912, these psychologists strove to identify how the different parts of an idea are linked together by the human mind into a single whole.
The school of psychology that predated these men, called Constructivism, held that human thought and ideas are built up of small pieces just the way that elements are built up of atoms and molecules. As such, constructivists were trying to break down thinking into its smallest pieces.
Gestalt thinking sought to do the opposite. After observing that people naturally made order out of elements and created a whole new idea as a result, Gestaltists sought to lay out the mechanisms used to do so.
As an example, think of a film or a piece of music. While there are thousands of individual frames and countless notes used, we naturally perceive a whole – the film or the song – from the disparate parts. Aristotle’s maxim that “the whole is greater than the sum of its parts” indicates that extra something that is added when we humans create a story out of disparate pieces.
The 4 Essential Gestalt Psychological Principles
These rules are based on the structure of stimuli. Our minds group individual stimuli and then make associations about the resulting whole objects based on their relationship to other whole objects.
For instance, 12 lines on a sheet of paper might not mean anything at all, but if they’re grouped the right way we’ll recognize them automatically as a transparent three-dimensional cube. From a young age, we learn that this cube has a fundamental relationship with the square, a smaller group of its parts that has different possible uses than other shapes such as a sphere.
Broadly speaking, the most important design fundamentals you can derive from Gestalt psychology are as follows:
To reify something abstract is to make it into something more real or physical. In the context of Gestalt psychology, it has to do with the negative space around the stimuli. If you have four 90° angles facing one another on a white background, the negative space in between them will be perceived as a square.
This principle operates based on our brains’ natural tendency to look for the contour of objects to determine what they are. Cover three of the angles and you’ll see just the remaining L, but it will be hard not to see the square when everything is uncovered.
For a more physical example, think of the thousands of pictures that have been posted all over social media with two hands in the shape of a kind of compressed C shape. Each hand means nothing on its own, but together they make the shape of a heart.
Similar to the reification principle, emergence is the creation of a complicated scene from smaller pieces. To clarify the difference: reification is the construction of a shape from negative space while the smaller pieces or negative space can cause emergence.
There are two kinds of emergence. Weak emergence occurs when there is a larger shape or image created but the individual parts retain their characteristics while in strong emergence the combination of the parts is so thorough that they no longer appear to exist.
Compare traffic flow on a highway and a running river. You can still see the cars as individual parts on the highway but you cannot see the individual molecules in the river.
Returning to the 12 lines that make a transparent cube, we can also see multistability at work. While the 12 lines make the cube, each of the 4 lines forms a square. It’s also possible to see the whole cube from separate angles.
This ability to kind of toggle from one perception to another is called multistability. An interesting aspect of this multistability is that our brains can perceive these different shapes and angles without losing the cohesiveness of any one of them. Lots of optical illusions rely on this fact, but copying this kind of object design will likely confuse users.
Even when we can’t actually rotate or resize them, we can recognize objects shown from different angles. Our brains can readily discern that two objects are the same even if they’re distorted by different lighting, stretching, or resizing. We can also tell when objects are physically different from one another even when they’re similar and presented with different distortions.
Repeating patterns feature the same object exactly the same, but we can see invariance illustrated by rotating patterns, which alternate between an image and a rotated or flipped variant. While we do understand the difference, we also don’t have any trouble accepting that both of the shapes represent the same object.
The 7 Prägnanz Design Principles
The psychological principles just discussed are applied to design through something called Prägnanz, which describes how humans organize our perceptions into a simple, symmetrical, and regular order. This application results in Gestalt Laws that are applicable to all sorts of design work.
- Law of Closure
Our brains will see an entire object even if parts of its shape or outline are missing. We also tend to complete shapes that have pieces missing. This tendency is called closure.
Gestaltists believe the human mind completes gaps in objects this way to promote more regularity. Without closure, the slightest aberration or missing piece would render a given object completely meaningless and unreadable for our brains.
- Law of Proximity
Objects that appear to be near to one another form into groups automatically in our minds. This is handy for counting things quickly and also for sorting groups of different objects without having to reorder them. The objects that are grouped together can also form shapes that are immediately recognizable to us such as rectangles or squares.
Representing numerical information and organizing lots of options into a digestible format are both made easier thanks to the law of proximity.
- Law of Symmetry
Our minds love symmetry. Groups containing an even number of similar objects allow us to make groups of two, which in turn gives us a sense of order. Though they might not be connected in any way, two objects facing each other are likely to be grouped in our minds to form a pair.
The law of symmetry applies even when the two objects are a significant distance apart. While this can also help count slightly faster, you can also use this design principle to highlight information that is in between the two objects that have perceived symmetry.
- Law of Similarity
Whenever similar objects appear on the same plane, we tend to group them together. For example, a scattering of multicolored dots can make a shape if all the red dots form a square because our brains automatically see all the red dots as connected.
Although they frequently work simultaneously depending on the design, the laws of proximity and similarity will also form a hierarchy when they exist at the same time. Either one can override the other – meaning the proximity of objects or their similarities can be more readily apparent.
- Law of Common Fate
The most dramatically-named of the Gestalt principles by far, the law of common fate describes the way we group together objects that seem to be traveling along the same path and toward the same destination.
In the real world, you can think again of traffic flow on the highway. Northbound cars and southbound cars are viewed as two distinct groups. Flocks of birds are also seen as a collective unit because of this principle.
- Law of Continuity
We can perceive an entire object even when another object overlaps it because of the law of continuity. Just like our brains can fill in gaps, it can also fill in parts of objects that are hidden from view. This law also states that we are less likely to view parts of an object as a whole if there is a sudden or sharp change in direction.
Interruption in continuity is one of the most common ways to frustrate a user. Frequently, not being able to see part of an object will look like the design has broken down and not like a purposeful choice.
- Law of Past Experience
Humans are learning animals, which means we base our knowledge on what has happened to us in the past. In abstract terms, this means we start to build an opinion of an object as soon as we see it and expect it to have a set of unchanging characteristics.
In terms of design fundamentals, we can think about web design. In the early days of the internet, there weren’t very many rules and webpages looked fairly cluttered in a way that looks insane to us today. But past experience also helps us build stereotypes that make new designs easier to use.
For instance, we all look for the home button in the upper left and most people have become accustomed to pinching and swiping on their touchscreens because they have used that technology enough before.
Design Fundamentals & Gestalt Principles
While they are incorporated in various ways across web design and product design, these Gestalt principles aren’t a step-by-step guide to producing a design. Rather, they’re guidelines for the way our mind works to collect information. Since designers are always aiming to create products that users can understand immediately and use without issue, understanding how to apply these principles is key.
One bit of good news is that these guidelines are broadly applicable, meaning the designers and the users should have a common understanding of them. Many designers can just spot when something doesn’t work or just looks a bit off because the design is violating one of the Gestalt principles.
It’s always best to stay innovative and work to find new ways to manipulate these laws to make an even better product. As designers work through user research on specific products, they tend to invent new ways to apply design thinking to graphic layouts. Here are a few of the ways design principles and Gestalt laws work together:
1- Logo Design
From the detailed logos of the 19th century to the slimmed-down minimalist ones that are so popular today, logos are one of the most apparent ways Gestalt principles are applied. Consider the IBM logo, which has horizontal sections removed. What better way could you illustrate the law of closure?
2- App Development
UX/UI designers who work on apps often have tons of information to display. The law of past experience allows them to rely on things like the hamburger menu which many people have already seen before.
Popular apps that feature photographs and user posts usually take advantage of the law of proximity by displaying a photo overlaid on the background. The user perceives the image floating on top of the original feed because they can still perceive the whole feed.
All designers want to guide the user to some kind of focal point, usually an important piece of information or a call to action. If you want people to find the button that allows them to purchase or subscribe to a product, then you have to build a design that intuitively brings them there.
A bad example of this is pop-ups or hanging banners that pester the user and actively interfere with their use of the page. Past experience teaches us to minimize or close these windows immediately. But product or service comparison tools that separate information using color-coded boxes use the law of similarity to reduce the mental load on the user.
4- GIFs & Infinite Animation
The law of common fate is constantly at play in the infinite animations that have been such a huge graphic design trend lately. These animations are frequently quite playful, leading the viewer to separate the content into multiple groups based on their probable destination, only to have the perspective change to reveal that all the pieces come together to form a single item, usually a logo.
5- The Infinite Scroll
Social media sights seeking to increase the time users were spending on their sites turned to the infinite scroll, which is when the news feed never seems to end. The law of continuation is at play in this design feature because the news feed, however far down you manage to get, is still perceived as one flowing object even though it’s constantly disappearing at the top of the page and reappearing at the bottom again.
6- New Product Design
Companies that were once eager young startups are now aged, in some cases by as much as two decades. This calls for a redesign of their products. But as users have built up brand loyalty and expectations based on the original, changing things too much can be a disaster.
Using the law of past experience, it’s possible to recreate the feeling of the original product while still innovating. Certain standout features can be left how they were or updated but left in the same place, depending on what the product is.
Gestalt principles are need-to-know information for any kind of visual designer. They are the bedrock for tons of design fundamentals and essential for understanding how the human brain takes in new stimuli and converts them into useful information.
There are many more design principles in addition to the ones discussed in this guide, but the Gestalt principles are some of the most basic ones. Hopefully, this guide has illustrated what they are and how they can be used to build more intuitive designs.