What is the Law of Proximity, and why does it matter in UX design?

When trying to solve a design problem, the question “What is the law of proximity?” comes up a lot. The law of proximity comes into play because designers have to make websites, devices, and products that please a lot of different people.
And you, as a designer, know that the choices you make can change the world.

What is the Law of Proximity, and why does it matter in UX design?

Every person who uses your designs will be affected by the choices you make about color, shape, and space. But you don’t have to depend only on what you see.

You may also like: How Big Companies Change Their Supply Chains For Customers

What is the rule of closeness?

The law of proximity is a Gestalt psychology principle that says that the human eye sees things that are close together as being more related than things that are farther apart. This rule is true even if the parts are different in color, shape, size, or some other way.

Based on this idea, the three rows of shapes on the left will look like they belong to the same group, even though some of them are different colors.

And even though they are the same size and color as most of the shapes on the left, you will see the row of shapes on the right as a separate group.

This is because the three rows of shapes on the left are close together, while the row of shapes on the right is farther away.

User experience (UX) design is based on Gestalt laws like the lay of proximity. They can help your visitors understand what they are seeing, find what they are looking for, and take action.

Let’s look at all of these laws together.

  • Gestalt Laws

Gestalt laws are a set of psychological rules that are based on the idea that people tend to see patterns in the world around them.

Max Wertheimer, Wolfgang Kohler, and Kurt Koffka, all psychologists, said that this was a natural way for the human mind to work. Based on this basic idea, they came up with a set of rules to explain how people organize and understand visual data.

  • Proximity

The law of proximity says that when things are close to each other, they are seen as a whole rather than as separate parts.

For example, the logo for Univer has 25 different icons. But because they are close to each other, you can see the whole “U.”

  • Similarity

The law of similarity says that if two things look the same, people will think they are the same thing or belong to the same group.

The logo for Sun Microsystems is a great example of how the law of similarity works. Instead of seeing eight separate U-shaped shapes, you see the word “sun” four times, with the letter “S” split in half.

  • Closure

The law of closure says that people fill in missing information or gaps to get a full picture of something.

For example, when you look at the logo for the World Wildlife Fund, your brain will see a panda in the group of black shapes on a white background.

  • Continuity

The law of continuity says that things that look different but are lined up in the same way will be seen as a single unit. For this to work, the eye must move smoothly from one thing to the next without anything breaking the flow.

The Mastercard logo is a great example because the overlapping orange area makes it easy for the eye to move from one circle to the other.

  • Figure-ground

The law of figure-ground explains how the human eye can tell an object from its background (or ground). This idea was used in the FedEx logo to emphasize both the company and what it does.

In the FedEx logo, the figure is the word FedEx, and the arrow between the E and the x points forward. This use of figure-ground brings attention to both the FedEx brand and the fact that they deliver quickly.

Why is it important to know the law of proximity?

If you understand the law of proximity, it will be easier for you to see how your website looks to other people.

There are a lot of ways to make something that looks good. But making a website that anyone can use well takes understanding, time, and knowledge.

For example, you might have perfect vision, but what if 60% of the people you want to reach don’t? They will find it easier to use a site with clear layout, color placement, and high contrast.

Another example: When looking at a website, 38% of people first look at how the page is laid out or at the links that help them get around.

The way you group and organize this information on your website makes it easier for people to find what they are looking for.

Knowing about distance can help you become a better designer because it helps you organize information. If you use the law of proximity well, you can:

Make your site easier to read.

Reduce visual clutter

Add more life to your site.

Help you give your site the right balance and shape.

Let’s look at how this law applies to UX design in more detail.

Law of Nearness UX

It is easy to use the law of proximity when designing user experiences. Remember to put things that go together close together and things that don’t go together far apart. The key is to use whitespace to group or separate things.

Labels should be close to the input field on web forms, for example, so that the user can see how they are related.

But it’s harder to understand the form below. This is because there is a lot of empty space between the email address input field and the label.

Most users will probably be able to figure it out and fill in the text field correctly, but they will need to spend more time thinking before they fill out the form.

By using the Law of Proximity

The law of proximity is an important part of good web design. It applies to everything from navigation menus to web forms and everything in between. When you design, think about how close things are to each other. This helps people understand how things are connected. This can make it easier for them to read your content or take action on your site.

A well-designed website makes the people who visit it feel seen, valued, and in control. With the right skills and tools, you can make the site of their dreams.

UX Laws – The Law of Proximity – Learn UX / UI with Alexis Solomon

Leave a Comment