E-Tabs

Tag Archive: enclosure

  1. You and Gestalt should be friends

    Leave a Comment

    Without even knowing it, your brain quite likely functions according to gestaltism. Sounds scary but it’s not! No need to consult a medical professional.

    In an earlier post, we mentioned the “gestalt” of design in passing.  We thought we would explore that a little more in-depth.

    The gestalt (German for “shape” or “form”) theory of psychology holds that the human mind is naturally and unconsciously governed by self-organizing tendencies. To put it more simply, think of the maxim, “the whole is greater than the sum of its parts.” (This saying is actually a variation on German psychology pioneer Kurt Koffka’s original, and perhaps more universal, “the whole is other than the sum of its parts.”)

    “What is a pre-war, German psychological theory history lesson doing in a dataviz blog?” you may rightly be asking. What does gestalt theory have to do with creating effective data visualizations? Well, quite a bit, as it turns out.

    Because before even one byte of data is processed to display on the dashboard, the overriding goal of dashboard design should be to make it as user-friendly as possible for the target audience. It frankly doesn’t matter how relevant or important the underlying data is: if a user cannot find what they need, it defeats the very purpose of having the dashboard at all.

    In fact, good designers – and this is not even limited to the dataviz realm – probably use some aspects of gestalt design principles without doing so consciously. It’s pretty fundamental to how the human mind naturally organizes things. The following are the gestalt principles (or laws) most relevant with respect to dataviz design and design in general. Most of these are pretty common sense and likely already do without thinking about it.

    Closure: Not necessarily related to dataviz design, Closure is still an interesting insight into how our mind works on a subconscious level.  Closure is illustrated by the graphic at the top of this post.  Even though the letters don’t appear as you normally would see them, you have no problem with “closing the gaps” and mentally completing the word.

    Continuity: Very generally, the Continuity principle has to do with how objects are arranged to facilitate a logical and natural workflow. In the context of dataviz design, this obviously is a key consideration for making your users’ interface as “friendly” as possible. For example, if on a multi-page dashboard you feature similar hierarchical data filters with which the user can interact, it’s probably easier for the user to grasp what to do if they’re set up in a similar way across all the dashboards.

    Enclosure: Enclosure is using visible boundaries or borders to group objects. For example, you can section a dashboard canvas into quadrants showing grouped objects by explicitly placing line borders around (or differently-colored backgrounds behind) each quadrant. However, as an alternative, you could also utilize the Proximity principle (see below) by clustering each group of objects closely, while leaving more whitespace between the clusters without explicitly bordering off the quadrants.

    Proximity: When you perceive a collection of otherwise random objects, you perceive those closest to each other as being in some way related, or forming a group. In the image below, there are 72 circles. But by virtue of their spatial relationship, most people “see” the collection as a group of 36 circles, and 3 groups of 12 circles.
    Gestalt_proximity

    Similarity: Rather than mentally grouping objects in proximity to one another, the viewer might also group objects which are similar to each other. In the image below, 36 circles are arranged into a square. However, most people perceive not an overall square shape, but 3 rows of light circles interleaved with 3 rows of dark circles.
    Gestalt_similar

    Symmetry: When two symmetrical elements appear as seemingly unconnected, the mind perceptually connects them to form a coherent pair. The grouping of characters below shows a configuration of various bracket types. We tend to perceive three pairs of symmetrical brackets – even when the individuals are separated by whitespace – rather than six stand-alone brackets.
    [        ] {        } (        )

    Law of Good Gestalt: This overarching principle explains that element objects tend to be perceptually grouped together if they form a pattern that is regular, simple, and orderly. On a subconscious level, the viewer eliminates extraneous stimuli which are unfamiliar or overly complex and the mind perceives meaning which may be prioritized over spatial relations. The law of good gestalt focuses on the idea of conciseness, on which all of gestalt theory is essentially based. This law has also been called the law of prägnanz, a German word that translates to “pithiness” and suggests the concepts of salience, conciseness and orderliness, which are pretty good goals to which dataviz designers should aspire.