Which of the gestalt principles states that we tend to perceive objects in groups?

Continuity

The Gestalt principle of continuity states that we are more likely to construct visual entities out of visual elements that are smooth and continuous, rather than ones that contain abrupt changes in direction. [See Fig. 6.6.]. The principle of good continuity can be applied to the problem of drawing diagrams consisting of networks of nodes and the links between them. It should be easier to identify the sources and destinations of connecting lines if they are smooth and continuous. This point is illustrated in Fig. 6.7. A graph drawing method known as a confluent diagram [Bach, Riche, Hurter, Marriott, & Dwyer, 2017] combines link bundling with the principle of continuity to make paths between nodes clear and unambiguous [Fig. 6.8 illustrates].

Gestalt Principle: Proximity

The Gestalt principle of Proximity is that the relative distance between objects in a display affects our perception of whether and how the objects are organized into subgroups. Objects that are near each other [relative to other objects] appear grouped, while those that are farther apart do not.

In Figure 2.1A, the stars are closer together horizontally than they are vertically, so we see three rows of stars, while the stars in Figure 2.1B are closer together vertically than they are horizontally, so we see three columns.

The Proximity principle has obvious relevance to the layout of control panels or data forms in software, Web sites, and electronic appliances. Designers often separate groups of on-screen controls and data displays by enclosing them in group boxes or by placing separator lines between groups [see Fig. 2.2].

However, according to the Proximity principle, items on a display can be visually grouped simply by spacing them closer to each other than to other controls, without group boxes or visible borders [see Fig. 2.3]. Many graphic design experts recommend this approach to reduce visual clutter and code size in a user interface [Mullet and Sano, 1994].

Conversely, if controls are poorly spaced [e.g., if connected controls are too far apart] people will have trouble perceiving them as related, making the software harder to learn and remember. For example, the Discreet Software Installer displays six horizontal pairs of radio buttons, each representing a two-way choice, but their spacing, due to the Proximity principle, makes them appear to be two vertical sets of radio buttons, each representing a six-way choice, at least until users try them and learn how they operate [see Fig. 2.4].

Gestalt Principle: Continuity

Several Gestalt principles describe our visual system’s tendency to resolve ambiguity or fill in missing data so we perceive whole objects. The first such principle, the principle of Continuity, states that when visual elements are aligned with each other, our visual perception is biased to perceive them as continuous forms rather than disconnected segments.

For example, in Fig. 2.9A, we automatically see two crossing lines—one blue and one orange. We don’t see two separate orange segments and two separate blue ones, and we don’t see a blue-and-orange V on top of an upside-down orange-and-blue V. In Fig. 2.9B, due to the vertical alignment of the pieces and the fact that they are spaced to match the curvature of the visible pieces, we see a sea monster in water, not three pieces of one. If we misaligned the pieces or spaced the pieces further than the curvature suggests, the illusion of continuity would disappear.

A well-known example of the use of the continuity principle in graphic design is the IBM logo. It consists of disconnected blue patches, and yet it is not at all ambiguous. The blue rectangles are stacked vertically with horizontal space between the stacks, so we see three bold letters, perhaps viewed through something like venetian blinds [see Fig. 2.10].

Slider controls are a user-interface example of the Continuity principle. We see a slider as depicting a single range controlled by a handle that appears somewhere on the slider, not as two separate ranges separated by the handle [see Fig. 2.11A]. Even displaying different colors on each side of a slider’s handle doesn’t completely “break” our perception of a slider as one continuous object, although ComponentOne’s choice of strongly contrasting colors [gray vs. red] certainly strains that perception a bit [see Fig. 2.11B].

Gestalt Principle: Figure/Ground

The next Gestalt principle that describes how our visual system structures the data it receives is Figure/Ground. This principle states that our mind separates the visual field into the figure [the “foreground”] and ground [the “background”]. The foreground consists of those elements of a scene that are the object of our primary attention, and the background is everything else.

The Figure/Ground principle also specifies that the visual system’s parsing of scenes into figure and ground is influenced by characteristics of the scene. For example, when a small object or color patch overlaps a larger one, we tend to perceive the smaller object as the figure and the larger object as the ground [see Fig. 2.16].

However, our perception of figure vs. ground is not completely determined by scene characteristics. It also depends on the viewer’s focus of attention. Dutch artist M. C. Escher exploited this phenomenon to produce ambiguous images in which figure and ground switch roles as our attention shifts [see Fig. 2.17].

In user interface and Web design, the Figure/Ground principle is often used to place an impression-inducing background “behind” the primary displayed content [see Fig. 2.18]. The background can convey information—e.g., the user’s current location—or it can suggest a theme, brand, or mood for interpretation of the content.

Figure/Ground is also often used to pop up information over other content. Content that was formerly the figure—the focus of the users' attention—temporarily becomes the background for new information, which appears briefly as the new figure [see Fig. 2.19]. This approach is usually better than temporarily replacing the old information with the new information, because it provides context that helps keep people oriented regarding their place in the interaction.

Static Links

When text is integrated into a static diagram, the Gestalt principles discussed in Chapter 6 apply, as Fig. 8.24 shows. Simple proximity is commonly used in labeling maps. A line drawn around the object and text creates a common region. A line or common region can also be used to associate groups of objects with a particular label. Arrows and speech balloons linking text and graphics also apply the principle of connectedness.

[G8.20] Use Gestalt principles of proximity, connectedness, and common region to associate written labels with graphical elements.

Gestalt Laws

The first serious attempt to understand pattern perception was undertaken by a group of German psychologists who, in 1912, founded what is known as the Gestalt school of psychology. The group consisted principally of Max Westheimer, Kurt Koffka, and Wolfgang Kohler [see Koffka, 1935, for an original text]. The word Gestalt simply means “pattern” in German. The work of the Gestalt psychologists is still valued today because they provided a clear description of many basic perceptual phenomena. They produced a set of Gestalt laws of pattern perception. These are robust rules that describe the way we see patterns in visual displays, and, although the neural mechanisms proposed by these researchers to explain the laws have not withstood the test of time, the laws themselves have proved to be of enduring value. The Gestalt laws easily translate into a set of design principles for information displays. Eight Gestalt laws are discussed here: proximity, similarity, connectedness, continuity, symmetry, closure, relative size, and common fate [the last concerns motion perception and appears later in the chapter].