gestalt principle of figure-ground relationship article banner

Gestalt Principle: Figure-ground Relationship (Differentiating Elements by Perception of Subject & Background)

Whether we have consciously realized this or not, most of us have come across situations in which our focus on a particular piece of information was enhanced by other information surrounding it.

By the same token, we have also encountered situations where we were distracted and confused by the noisy and irritating presentation of information.

In this section, we shall explore how to catch the eye of the viewer by presenting the necessary information in such a way that its surroundings enhance it through figure-ground psychology.

Figure-Ground Relationship Definition

The figure-ground relationship is one of the Gestalt Principles of Perception. It suggests that any designs or elements are always differentiated by our perception of figure and ground. The figure is the main focus of the design. The ground is anything besides the main focus like background.

When websites put an advert on a page and it shows up, they will make it the figure element. It may cover the whole website or positioned so that it is not overlooked by our eyes. Here most of the websites will become the ground.

Similarly, when YouTubers put a piece of background music while they talk or comment, their talk is the figure element. The music is the ground element to give a sense of calmness to their videos.

As the above examples make it clear, the figure-ground relationship can be represented by either a visual method or an auditory method.

Characteristics of Figure and Ground Elements

It is important to differentiate between figure and ground elements. Knowing what makes them figure or ground helps us clear the confusion between them.

Figure vs Ground Elements

Figure elements have proper dimensions and a well-defined shape. Ground elements usually don’t have any definite shape.

figure has definite form like the stones in the image while blurry background is the ground

In the above image, we can trace out the stacked rocks whereas the background is blurred out with no definite form.

Positioning elements lower in designs make users perceive the element as a figure element. Positioning elements higher in designs make users perceive the element as a ground element.

Let’s take a cityscape photo for example. Our primary focus is on the city. By positioning the interest-point in the lower portion, the buildings become our figure and the sky our ground.

figure-ground example: sky is the ground while the city is our focus i.e. figure
Photo by Alec Cooks on Unsplash

Let’s say we want the streets to be our primary focus. We would then pull the lower streets into the frame while shifting the buildings to the upper portion. This will result in the sky getting out of the crop.

Now, the streets with the center statue are our focus while the buildings are perceived as ground. We can see this on the cropped image below:

streets are our focus, i.e. figure while the buildings are perceived as ground if we crop into the image

When elements are positioned closer to the users, it is generally perceived as a figure element. When elements are positioned to look far away for users, it is generally perceived as a ground element.

In the image below, we have lots of stuff on the frame. But, we can differentiate which object is the focal point of the composition.

object placed closer to us is the figure, i.e focus which in this case is the stone in the picture
Photo by Michael Hirsch on Unsplash

Here, the rock which is placed closer to us is the figure. The rest of the objects in the composition are considered as ground.

Importance of the relationship:

When the relationship is clear and stable, our main features receive more attention.

Since our figure element is going to be our main feature, a stable relationship enhances our figure element to be more noticeable.

Figure elements have a higher probability to be recalled.

More spotlight on our main features means it is easier for people to remember what they used or were reading later on.
For example, in photographs, the focus is remembered way more often than the background.

If the relationship is unstable, our focus point becomes dubious.

When we don’t clearly differentiate our figure and ground elements, people would not know what they were supposed to look at. This would mean that our main purpose would not be recognized by users.

If the relationship is unstable, our product might be interpreted in the wrong way.

When people don’t clearly know what our figure element is, they’ll interpret our products in whatever way they see fit. It might be interpreted the way we intended, or it might not. But there is a high probability for misinterpretation. This might lead to a ground element getting more attention.

Summing Up

  • Figure elements are the main focus of the design and ground elements are the supportive background of the design.
  • We need to clearly differentiate between figure and ground elements so that people can give more attention to our main features.
  • If it is not clearly presented to users, confusion arises and people will be mistaken about the main purpose of our products.

Further Reading