CRAP Design: Part 2 - Proximity

This is the second part in the CRAP Design series. In the last post we looked at the four different principles to be used while designing a document or web page. In this post, we will look at one of them in depth.

Proximity in terms of design principles is about the relationship different elements get when they are placed together. It also states that if the groups of elements are separated then those elements are dissimilar. We will look at some examples and understand as to how we may apply it to make the documents and web pages better organized as well as look better than an average page.

For illustration purposes look at the following list:

Now look at the following lists:

As you can notice just by placing the two lists closer to each other, an immediate association is drawn between the elements - the different list items.

Let us look at another practical example. Here is a layout of a fictitious business card:

Now let us have a look at a business card that has the proximity design principle applied to it:

As you can see, just by grouping the associated elements, the name of the person, the designation in a company, and the email address is made clear.

Of course, it does not seem like much, but it is just one of the CRAP principles of designing that would enhance the document/page. We would look at the other principles in the posts that would follow.

Update: This blog post is a part of series.

  1. CRAP Design: Part 1 - Make documents and pages look good
  2. CRAP Design: Part 2 - Proximity
  3. CRAP Design: Part 3 - Alignment
  4. CRAP Design: Part 4 - Repetition
  5. CRAP Design: Part 5 - Contrast
  6. CRAP Design: Part 6 - Finale

Add new comment