Proximity: Why It Matters

A hundred years ago, when the science of psychology was very new, Austrian and German psychologists developed a handful of principles for how we see and interpret visual information. These are called Gestalt principles, and Proximity is my favorite.

We humans are pattern-seeking beings. And the Gestalt principles explain how the eye perceives visual experiences and how the brain organizes them — especially in the context of their surroundings. Designing with the these principles in mind contributes to clean, clear, reader-friendly design by going with the natural tendencies of your (presumably human) viewer.

According to the Proximity principle, objects that are close together are seen as being associated or linked with one another. The closer the objects appear, the more likely we are to perceptually group them.

SO WHAT? Artful grouping of design elements on a page, whether text or graphics, creates a bond between them, a relationship, a cohesive whole. We see a family of related objects, a visual ‘unit’ that we can mentally batch process. No sorting required.

In page layout, a few well-defined clusters of information communicate more clearly than content scattered to the four corners of the page. If you have a lot of verbiage, consider combining your information into two or three (maximum five) distinct clumps, allowing enough white space between the clumps to set them apart.

Resist the temptation to use lines to separate elements or boxes to group them, as this just adds noise to the page. Try letting the space between the elements (proximity) tell the story of their relationships.

NATURAL CLUSTERS or groupings might include:

• multiple bits of contact information packaged together

• a heading with the paragraph close below it

• the date, time, location and RSVP information for an event

• a photo or illustration with a caption and/or credit

• a pull quote with the author’s name, affiliation and/or credentials

• a logo with a tagline, web address, physical location, or date of establishment

• a business person’s name with company, title, and/or thumbnail photo

For Western readers, who read left to right, there is an even closer association perceived between objects when they are side by side than when they are above and below each other. So placing a news story beside a photo rather than under it goes with the (visual) flow of most readers.

Once you have your clusters, use alignment (with margins, the center line, or other elements) to hold the groupings together in a balanced, integrated page layout. Squinting at your layout can tell you in an instant whether it’s unified or scattered, clear or confusing, focused or distracting. Start with a single, strong focal point whenever possible and tie the rest of your content to it for a cohesive, organized whole.

DESIGN CHALLENGE

1) As you look at samples of graphic design in your everyday world, notice which ones feel clean, clear, and easy to navigate. Observe how related pieces of information are clustered together on the page (or not) and how this contributes to clarity and ease in digesting the content.

2) On your next graphic design project, think through how you can group images and text with other related elements to create cohesive clusters or 'families' of information. Let the fun begin!