Law Of Common Region - Gestalt Laws of Perceptual Organization
The law of common region is a powerful principle of visual perception that can improve your web design. Find out how to use it with real examples.
The law of common region is one of the Gestalt principles of visual perception that explains how we perceive elements that are enclosed within a common boundary or region as a group. It is based on the idea that our brains tend to organize information in a way that is regular, orderly, and recognizable. By applying the law of common region in web design, we can create clear and effective user interfaces (UI) that enhance the user experience (UX).
In this article, we will explain what the law of common region is, why it is important for web design, and how to apply it in UX and UI. We will also provide three real examples of web design that use the law of common region to create intuitive and engaging websites.
What is the law of common region?
The law of common region was formulated by Gestalt psychologists Stephen Palmer and Irvin Rock in 1999. It states that we see elements placed within the same visual container as a group. We also assume that elements of the group share something in common, such as a characteristic or function.
For example, if we see a collection of symbols scattered randomly on a page, but some of them are colored and separated by a border, we will perceive the symbols within the border as a distinct group separate from the rest. We will also infer that the symbols within the border have some relation or meaning.
The law of common region is based on the principle of Prägnanz, which means that our minds prefer simple and organized patterns over complex and chaotic ones. By grouping elements within a common region, we reduce the cognitive load and make it easier for our brains to process the information.
Why is the law of common region important for web design?
The law of common region is important for web design because it helps us create websites that are visually coherent, structured, and easy to navigate. By applying the law of common region in web design, we can:
- Establish visual hierarchy: The law of common region helps us prioritize and emphasize the most important elements on a web page. By grouping related elements within a common region, we can create contrast and distinction from other elements. This helps users focus on the main content and actions.
- Organize content: The law of common region helps us organize content in a logical and meaningful way. By grouping related content within a common region, we can create sections and categories that help users understand the structure and flow of the website. This also helps users find the information they need quickly and easily.
- Improve usability: The law of common region helps us improve usability by making our websites more intuitive and user-friendly. By grouping related elements within a common region, we can create clear affordances and feedback that help users interact with the website. This also helps users avoid confusion and errors.
How to apply the law of common region in UX and UI?
The law of common region can be applied in UX and UI by using various visual techniques to create boundaries and regions for related elements. Some of these techniques are:
- Borders: Borders are one of the simplest and most effective ways to create common regions. By adding a border around an element or group of elements, we can visually separate them from other elements and indicate their relationship. Borders can be solid, dashed, dotted, or any other style that suits the design.
- Backgrounds: Backgrounds are another way to create common regions. By adding a background color or image behind an element or group of elements, we can visually group them together and create contrast from other elements. Backgrounds can be flat, gradient, textured, or any other style that suits the design.
- Shadows: Shadows are a subtle way to create common regions. By adding a shadow effect to an element or group of elements, we can create depth and dimension that make them stand out from other elements. Shadows can be drop shadows, inner shadows, box shadows, or any other style that suits the design.
Conclusions
The law of common region is one of the Gestalt principles of visual perception that helps us create clear and effective user interfaces. By applying the law of common region in web design, we can group related elements within a common boundary or region that indicates their relationship and function. This helps us create visual hierarchy, organize content, and improve usability. The law of common region can be applied in UX and UI by using various visual techniques such as borders, backgrounds, and shadows.
Other Gestalt Laws
Check out the other five Gestalt laws in our following articles:
Bibliography
1: S. E. Palmer and I. Rock, “Rethinking perceptual organization: The role of uniform connectedness,” Psychonomic Bulletin & Review, vol. 6, no. 1, pp. 29-55, 1999.
2: A. Nothdurft, “Gestalt theory: An essay in philosophy,” Gestalt Theory, vol. 32, no. 2, pp. 133-158, 2010.
3: J. Sauro and J. Lewis, Quantifying the user experience: Practical statistics for user research. Morgan Kaufmann, 2016.
4: L. Busche, Lean branding: Creating dynamic brands to generate conversion. O’Reilly Media, Inc., 2014.