The Gestalt principles

Gestalt principles and laws are widely used in design in order to convey grouping among items in a visualization. Here we will discuss them in order to understand how to leverage them in dataviz.

I found many versions of the Gestalt principles online, and I collected and reorganized all of them as best as I could.

Proximity

Nearby objects are perceived as a group.

By looking at the above figure, in the first case you will probably see a grid, in the second one a collection of columns and in the third one a collection of rows.

When labelling objects in a figure, you can leverage this principle and use proximity to let the reader easily understand to which object is associated each label.

This principle is also the one which let us identify clusters in a scatter plot, as we are naturally led to perceive close points as belonging to a common set.

Similarity

Similar objects are perceived as a group.

In this case, even if our objects are equally spaced, we naturally perceive two groups of objects, and each group has a different color.

The similarity principle can be used to make objects belonging to the same category appear connected by encoding the category into a non-spatial channel (e.g. color, shape).

Connection

Objects which look connected are perceived as a group.

In the above figure, according to the Gestalt principles, you should perceive the two squares in the first line as connected, as well as the two squares in the second line.

This principle is used in many charts, like the parallel coordinates plot as well as the line chart, to enforce the idea that to each line is associated one single object.

Also when drawing networks, we exploit this principle in order to convey the message that the network is composed by all the linked objects.

Enclosure

Objects which are enclosed within a perimeter are perceived as a group.

In this example, the objects enclosed within the gray lines are perceived as grouped together.

We can use this principle to enforce the connection between different objects in our plots.

Closure and continuity

We see complete figures even if part of the information is missing.

In the above figure we see a triangle, even if there are pieces of its perimeter which are missing.

The same principle also applies to lines, but in this case it is often called continuity principle.

In this figure this principle is applied twice: we both perceive many small circles even if the lines are dashed, and we perceive one big circle even if there is no circle drawn.

Some author consider the following corollary of the above principle as an independent principle:

When two or more objects are intersecting we perceive each of them as uninterrupted.

We perceive the above objects as a blue bar and a red bar, despite the fact that what we actually see are a blue bar and two red bars.

This fact has, as immediate consequence, that we tend to draw conclusions by using this principle even if we do not see the data...

...but these conclusions may be wrong

Figure-ground

When we look at objects in one image, we wither instinctively identify them as foreground or as background.

The Rubin vase is a common example of this principle, where one either identifies two faces or a vase, and switching between one idea and the other is rather difficult.

This fact is related to the following principle

Multistability

When an image has more than one interpretation, we cannot see more than one simultaneously.

Switching between different interpretations is called multistability.

Invariance

We are able to recognize objects even if they are deformed or rotated.

This principle is the one leveraged by captchas, and it’s what makes the human brain the best pattern recognition machine on Earth, at least for the moment.

In fact, thanks to the invariance principle, we can easily identify patterns which are only approximately realized, while this is a rather hard task to implement in a general form in an algorithm.

Symmetry

When there is a lack of symmetry, our attention is attracted by it.

In the previous image, your eye will probably fall on the green square, as it looks different from the other squares.

By using this principle we can draw the attention of the reader on some specific objects in our visualization.

Of course you can do the same by breaking any symmetry.

Simplicity

We favor simple interpretations to complex ones, and we prefer symmetry and balance to disorder.

In the above picture we naturally see a face rather than a series of circles and lines.

Common fate

Objects that point to (or appear to be moving in) the same direction at the same speed are perceived as a group.

In the above example, one can clearly distinguish a group as the circles moving together around a same point.

Notice that we don’t need them to actually move.

This principle does not belongs to the original Gestalt principles, but it is sometimes used in web interfaces, and it finds applications in dashboard design too, so I decided to include it here for the sake of completeness.

Conclusions

The Gestalt psychology is a powerful tool when designing a visualization, as we can leverage it to convey a sense of grouping among items.