C.R.A.P. Design: Proximity

Strap yourself in for the exciting conclusion to my series on C.R.A.P.!

That is, the four elements that go into creating a remarkable and memorable piece of art/design. If you’ve yet to read up on the preceding three parts of this series, then check out part one, part two, and part three.

Let’s cozy up, get close together, and talk about proximity in this post. This is the closing letter to the acronym we’ve been discussing this entire last month. It may be a cliché to say it, but I’m going to anyway — proximity may be last in the list, but it’s certainly not least.

As a final recap before we get started, let’s remember that C.R.A.P. stands for:

  • Contrast
  • Rrepetition
  • Alignment
  • Proximity

Each of these basic building blocks of design combine to transform a piece of work into something worth seeing and appreciating. It takes a skilled hand and a keen eye to harness all four qualities, but the results can be astounding.

Principle #4: Proximity

Proximity refers to the distance between elements in a work of design.

The definition is simple enough, but there’s a lot of depth to the idea of proximity. It’s not just about putting things together or throwing them far apart. What you’re doing with the proximity of elements is creating an apparent connection between them.

For instance, say you’ve got a headline on a main banner image in a website. That headline reads something like, “The Secret to Immortality Is Puppy Kisses.” Aside from that being a pretty eye-catching headline, you’re probably left wanting to see evidence to back up this ridiculous (yet pleasing) claim.

You’ve got a link to a page with all of your scientific evidence ready to go. It reads, “Learn More ->”. The clear place to stick that link is immediately following the headline. You need to put that link to your evidence page in close proximity to the headline for visitors to know where they need to click.

Sticking that link a couple sections down on the website, far away from its headline, wouldn’t make any sense. What is the visitor going to learn more about now?

Not only do you have an astounding headline with no clear evidence to back it up, but you’ve got an errant link floating around with no connection to anything.

Conversely, the idea of proximity can be used to separate elements into clearly understood sections.

To use that headline example again, you shouldn’t stick a contact form directly underneath a website with the headline, “The Secret to Immortality Is Puppy Kisses.” What in the world does a contact form have to do with immortality?

Instead, it makes more sense to put that contact form down in a clearly defined contact section of the website. That way the headline is highlighted and the contact form has its own distinct place.

How does proximity work?

Here are some examples of proper proximity in design and websites to help cement this point in.

The proper use of proximity in design helps create and reinforce meaning in the elements being used. Putting opposing elements next to each other takes away the point of all the elements. Products on a website probably shouldn’t be placed on the same page as an extensive bio about the executive team.

Group similar items together. Separate opposing items.

Managing this simple idea helps to make navigating a work of design much easier.

Through each of the four posts in the series, I’ve written about the basic ideas that go into the creation of every compelling piece of design work.

It’s no accident that, for example, the best websites employ each of the elements of C.R.A.P. in every page.

You don’t ever luck into good design. It’s a process that takes concentration and dedication. In fact, good design can be such a technical process that creating great works can appear more scientific than creative.

Inspiration and a good knowledge of art plays a key role, sure, but so do the fundamental principles I’ve talked about in each of these four posts.

All it takes is time and effort to ensure that proper contrast, repetition, alignment, and proximity are all used in the creation of your work. In fact, I’d be so bold as to say if you follow each of those four principles, then you’re most of the way there to creating something worth noticing.

So keep C.R.A.P. on your mind. I know you’ll be thankful you did.

Rock it, cats.



Get the Medium app

A button that says 'Download on the App Store', and if clicked it will lead you to the iOS App store
A button that says 'Get it on, Google Play', and if clicked it will lead you to the Google Play store