Gestalt. Common region principle for designing interfaces – | Blog

In previous posts we already talked about other Getalt principles applied to interface or UI design. Two very important principles for UX are that of and that of .

Gestalt principles capture how people make sense of the world around them and the images they perceive. They define how humans simplify and organize complex images that are made up of many elements, ordering each part to create a whole.

Gestalt principle of common region applied to the digital interface or UI

The Getalt common region principle can be summarily defined in that elements within the same boundary are perceived as related within an interface. or in the visual design of the content of a screen.

Therefore, we can say that, the common region principle explains how elements within a boundary are perceived as a group and are assumed to share some common feature or functionality.

Shapes or colors can be used to divide the interface into regions or parts, thus delimiting the visual content.

Usually in UI and interface design, different background colors are used to delimit and designate what is part of the menu, the footer, a panel or left handle to navigate through different parts or categories, etc.

1. The English Court

On the new website of El Corte Inglés, we can see how the principle of common region is applied in the head or header of the site.

Placing a gray background to this container, the user perceives that everything it includes is used to navigate through the different parts of the site and find or search for the products in which they are interested.

See also  Wireflows, what they are and when they are used - | Blog

2. Fnac Spain

Fnac España, using various background colors, delimits each part or section, making the user assimilate or perceive that everything found within each part has a common functionality and is related to each other.

In this way we can check how the buttons that link to each category inside the yellow container belong to the campaign that is in force at that moment.

The navigation menu and the header of the site are clearly differentiated, which are used to access each of the parts of the web or search and find products.

And finally, the added values ​​that Fnac wants to highlight behind the darker colored background are differentiated.

3.Amazon

For example, in Amazon, as in many other sites, we can see how to use a distinctive color for the footer or footer that helps to indicate that all the links in this area belong to a group and in this way the user unifies the visual content.

The Gestalt common region principle can be found almost everywhere in digital interface design. Grouping items in a container is a strong visual cue to use when white space alone isn’t enough.

credits

Loading Facebook Comments ...
Loading Disqus Comments ...