Blog

The Power of Similarity: Enhancing UX and Legal Design with the Law of Similarity

Discover how the Law of Similarity improves the user experience. Learn how using color, shapes, and sizes creates a cohesive visual experience and prevent users from overlooking important information in contracts.

Introduction

The human eye perceives similar elements in a contract (design) as a complete picture, shape, or group, even if those elements are separated. Human eyes are good at filling in “gaps” or connecting “dots.” It happens naturally. The similarity principle can vary from element to element, such as colors, shapes, and size.

When you design your contract by applying legal design principles, you should ensure that these ‘gestalt’ principles are practical. You should be aware that people are seizing colors, shapes, and sizes similar in a group if they behave similarly.

Color

What do we mean by that? Let’s look at an example below:

Contact box with send, save, and cancel options
We usually expect the “send” box to be on the far right in the reactions to sending a message. Also, the fact that the “cancel” button is the same color as the “send” button and is on the right side can be a huge problem for many users over and over again. The correct order would be “cancel” as a red button, an uncolored save, and a green “send” button.

You must have immediately realized that something is wrong here. Any design that looks out of the ordinary is generally, but not always, lacking in design. Because they do not appeal to the user, the “cancel” button should usually be red on the far left or elsewhere. Canceling something is an action that requires negative effort and is decisive to avoid irreversible mistakes.

Shape

If elements have the same shape, we might think they are identical and miss important details such as labels, small text inside the shape, or slight differences in their form.

Think about creating a leasing contract. To highlight essential items or information, you can use a rectangular box.

When reading these clauses, the contracting parties will automatically perceive that the clauses in the rectangular box are essential after a certain period of time.

Contract clauses named "important contract"

So what can go wrong?

If you violate the “Law of Similarity” and leave the most critical clauses in the contract inside the rectangular box without indicating that they are essential, you can be sure that the contracting parties will most likely skip reading that clause.

Size

Size can also be a way to indicate a relationship between objects. Objects of similar size are often perceived as being related and having similar levels of importance.

The Guardian cookie consent pop-up
The Guardian cookie consent pop-up.

If items with a standard size are of a different size elsewhere, or if they are irregular, this may cause users to hesitate.

Conclusion

In order to ensure a smooth legal design process for both tangible and digital contracts like cookie policies and privacy policies, it’s crucial to correctly and effectively apply legal design principles. The law of Similarity is one of the Gestalt principles that is one of the most significant design rules that annoy users when not implemented properly.

The Importance of Clear Language in Legal Services: Improving the User Experience
The Importance of Clear Language in Legal Services: Improving the User Experience

Discover how UX writing principles can improve the user experience in legal designs. Learn how to create clear, concise and usable content that builds trust and increases usability. Apply these principles to create products that sound human and resonate with your audience.

href=/en/learn/articles/clear-language-in-legal-services class="text-primary hover:underline inline-flex items-center gap-1" >
Laws of UX and Legal Design: Serial Position Effect
Laws of UX and Legal Design: Serial Position Effect

Discover the impact of the Serial Position Effect on user experience and legal design. Learn how strategically placing information in contracts improves recall and enhances the overall experience.

href=/en/learn/articles/laws-of-ux-and-legal-design-serial-position-effect class="text-primary hover:underline inline-flex items-center gap-1" >
Tesler's Law: Understanding the Laws of UX and Legal Design
Tesler's Law: Understanding the Laws of UX and Legal Design

Explore Tesler's Law and its impact on legal design in this insightful article. Learn how complexity and simplicity intersect in user experience and contract design

href=/en/learn/articles/teslers-law-understanding-the-laws-of-ux-and-legal-design class="text-primary hover:underline inline-flex items-center gap-1" >