Let`s see it in action. If you have a piece of paper handy, draw seven or eight circles in a row next to each other. Place a small arrowhead on two of them. Now note that these two circles are different from each other, but in the same way. The others remain in place, but the circles of “arrowheads” go somewhere (in the same direction); They share a common destiny. There are six individual principles commonly associated with Gestalt theory: similarity, continuation, completion, proximity, figure/ground, and symmetry and order (also called conciseness). There are also other more recent principles that are sometimes associated with the figure, such as common destiny. Gestalt perceptual theory attempts to explain how the human brain interprets information about relationships and hierarchies in a design or image based on visual cues such as proximity, similarity, and closure. The figure-reason principle is similar to the closure principle in that it uses the way the brain processes negative space. You`ve probably seen examples of this principle in social media memes or in logo frames (like the aforementioned FedEx logo). No matter who came up with the ideas first (there are essays dating back to 1890), Gestalt principles are an important set of ideas that any designer can learn, and their implementation can greatly improve not only the aesthetics of a design, but also its functionality and usability. In the 30s and 40s, Gestalt psychology was applied to visual perception, especially by Max Wertheimer, Wolfgang Öhler and Kurt Koffka, who founded the so-called Gestalt approaches to form perception.
Its aim was to study global and holistic processes of structural perception in the environment (e.g. Sternberg 1996). Specifically, they tried to explain human perception of groups of objects and how we perceive parts of objects and form whole objects on their basis. Investigations on this subject crystallized in “the Gestalt laws of the organization of perception”. Some of these laws, often cited in the HCI or interaction design community, are as follows. Your brain distinguishes between the objects it looks at in the foreground of an image (the figure or point of focus) and the background (the area on which the figures rest). It gets interesting when the foreground and background actually contain two different images, like this one: Of course, you can do things differently if you want to make them stand out from the crowd. For this reason, call-to-action buttons are often designed in a different color than the rest of a page – so they stand out and draw the visitor`s attention to the desired action. In the simplest case, Gestalt theory is based on the idea that the human brain will try to simplify and organize complex images or drawings composed of many elements by unconsciously arranging the parts in an organized system that creates a whole rather than just a series of disparate elements.
Our brains are designed to see structures and patterns so that we can better understand the environment in which we live. The law of similarity captures the idea that elements are substantially grouped together when they are similar to each other. In the “Settings window” of the Opera browser (Figure 2.A), the user is led to group menu items by their background color. The gray background of the first four menu items “binds them together”. Figure 2.B. is a typical example of the principle of similarity, where we see circles and triangles as four horizontal rows (or at least a configuration in which triangles and circles are grouped according to shape). Similar objects therefore tend to be considered as a unit. The law of common destiny states that we perceive shapes as lines that move along the smoothest path. For example, we look at grouped items and see that they move in a similar direction. And in this article, you learned the laws of figure/floor, pregnancy, closure and common destiny. As we`ve seen, we have many exciting ways to reach our users with designs. Are you ready to apply them? As with any psychological principle, learning how to incorporate the visual perceptual principles of the figure into your design work can greatly improve the user experience.
Understanding how the human brain works and then tapping into a person`s natural tendencies creates a more seamless interaction where a user feels comfortable on a website, even if it`s their first visit. Classical principles of Gestalt`s visual perception theory include similarity, continuation, closing, proximity, figure/ground, and symmetry and order (also known as conciseness). Others, such as the “common destiny”, have been added in recent years. The law of closure postulates that we perceptibly close or complete objects that are not complete. In the above case, we perceive the letters “I”, “B” and “M”, although the shapes we see are in fact just lines of white space of different lengths floating on top of each other. Similarly, we see the figure in Paul Thagard`s book (Figure 5.B.) as a three-dimensional box, when in fact we only see 24 different red shapes (count yourself!) on a dark red background. Figure 5.C. is a typical example of the closure law; We perceive a circle and not 8 individual circles.