Law of Proximity

Law of Proximity explained

Human perception is often biased. To make sense of the world, we are constantly extracting information from our environment. We tend to rely heavily on the arrangement or placement of objects to determine their relationship to one another. Objects close to one another seem to be part of the same group while separate objects are perceived as being unrelated.

This may sound intuitive, but this law is often overlooked. In fact, the law of proximity is one of the most powerful principles to indicate relatedness and association, even more so than colors or shapes. This graph says it all:

Whitespace is a crucial yet easy-to-implement feature to communicate groupings. While it is often used to give elements on screen some breathing space, it is in fact helping our brain to reduce our cognitive load by organising the information presented to us, without the use of hard borders or boxes. By manipulating the amount of whitespace used, we can either create relationships or separate elements.

Let's look at an example found on Uber Eats:

The whitespace around the headings indicates the categories under which the restaurants fall. Restaurants under the corresponding category are placed closer to the heading than the restaurants from the preceding category. Furthermore, by decreasing the white space between the images and their associated texts, users automatically group them together. This allows users to easily browse and compare the options to decide which one they want to click on.