Elements that are visually connected are perceived as more related than elements with no connection.

Elements that are connected by uniform visual properties, such as colour, are perceived to be more related than elements that are not connected.


The principle of uniform connectedness is the most recent addition to the principles referred to as Gestalt principles of perception. It asserts that elements connected to one another by uniform visual properties are perceived as a single group or chunk and are interpreted as being more related than elements that are not connected. For example, a simple matrix composed of dots is perceived as columns when common regions or lines connect the dots vertically and is perceived as rows when common regions or lines connect the dots horizontally.

There are two basic strategies for applying uniform connectedness in a design: common regions and connecting lines. Common regions are formed when edges come together and bound a visual area, grouping the elements within the region. This technique is often used to group elements in software and buttons on television remote controls. Connecting lines are formed when an explicit line joins elements, grouping the connected elements. This technique is often used to connect elements that are not otherwise obviously grouped (e.g., not located closely together) or to imply a sequence.

The principles of grouping (or Gestalt laws of grouping) are a set of principles in psychology, first proposed by Gestalt psychologists to account for the observation that humans naturally perceive objects as organized patterns and objects, a principle known as Prägnanz. Gestalt psychologists argued that these principles exist because the mind has an innate disposition to perceive patterns in the stimulus based on certain rules. These principles are organized into five categories: Proximity, Similarity, Continuity, Closure, and Connectedness.

Use uniform connectedness to visually connect or group elements in a design. Employ common regions to group text elements and clusters of control elements, and connecting lines to group individual elements and imply sequence. Consider this principle when correcting poorly designed control and display configurations.

 

The use of common regions and connecting lines is a powerful means of grouping elements and overwhelming competing cues like proximity and similarity.

Common regions are frequently used in software interfaces to group related controls.

The proximity between unrelated words (e.g., Chisos and South)
on this rendering of a sign at Big Bend National Park lends itself to misinterpretation. Grouping the related words in a common region would be a simple way to correct the sign.

References & Further Readings About Uniform Connectedness

  1. Andy Rutledge :: Gestalt Principles - 3: Proximity, Uniform Connectedness, and Good Continuation

    3 of 5: An examination and explanation of the proximity, uniform connectedness, and good continuation principles of Gestalt Principles.

    www.andyrutledge.com

  2. Laws of Proximity, Uniform Connectedness, and Continuation – Gestalt Principles (Part 2)

    Examine the Law of Proximity (another Gestalt principle) which is especially useful as it deals with how our eyes and brains draw connections with design images.

    www.interaction-design.org

  3. Design Principles: Visual Perception And The Principles Of Gestalt — Smashing Magazine

    Gestalt principles are important to understand. They sit at the foundation of everything we do visually as designers. They describe how everyone visually perceives objects. This article is part of a new series about design principles that can serve both as a refresher for seasoned designers and reference for newcomers to the industry. Hopefully, the content covered here isn't too obvious and self-explanatory, but it's always great to have a nice quick refresher every now and again, isn't it?

    www.smashingmagazine.com


  4. Warning: fopen(http://people.sunyit.edu/~lepres/thesis/principles/247_pdfsam_POD.pdf): failed to open stream: HTTP request failed! HTTP/1.1 404 Not Found in /home/crtivo5/4i.design/wp-content/themes/4id/single-directory.php on line 60