This document discusses the principles of contrast, repetition, alignment, and proximity (CRAP) in design. It provides definitions and examples of each principle. Readers are asked to pick two online designs that illustrate one of the principles and email them to the instructor. The document also assigns homework of completing initial design work for a print project and reading about type from recommended books and chapters.
4. As funny as it is…
… making CRAP jokes, it really is a foundational premise of
design, and it’s deeply important (and thanks to our sense of
humor usually quite memorable). The letters, of course,
stand for:
Contrast
Repetition
Alignment
Proximity
5. You read about it
So I’m going to give these to you in my
words, along with a few quick examples, so
you can get a good sense of how it works.
6. Contrast
Basically stated, contrast means that things that are
similar look similar but things that are different look
clearly different. This keeps your reader from becoming
confused and creating relationships that aren’t present.
It comes, of course, from literal contrast, the light-to-
dark or black-to-white of an image. In design it often
ends up being about color values.
7. This image is a
great example,
and it is also a
hyperlink to a
great blog entry
on contrast, if
you want to learn
more.
8. Repetition
Maybe the easiest of these four concepts to
define, repetition is, just as you’d guess,
repeating something– a color, a logo, a
typeface, a type style.
It unifies and organizes.
9.
10. Alignment
Alignment is about positioning on a page.
Nothing should be put on haphazardly. There
should be a reason and a measurement that
guides where things are placed in relation to each
other.
11. The image to the right links to
a post that has some cool
reflection on alignment.
And there’s all
kinds of
alignment
going on with
the new
Windows 8
start page.
12. Proximity
Proximity is very similar in theory to
alignment, but it’s more about grouping and
use of white space.
Basically: similar things are grouped
together, different things require space.
13.
14. In your teams…
I want you to pick two designs (online,
obviously) you feel illustrate good use of at
least one of these criteria. Email them to me,
then we’ll pop them on the screen and
discuss.
15. Discussion
Having spent a little bit of time thinking about the
project, what is it that you need to collect in order to be
successful? What can I help you with at this point?
Let’s talk about it.
16. Homework
The major homework, obviously, is to
coordinate with your team and get the first
portion of your design work done for the print
project.
You also need to read: Williams non-designers
design book Chapters 9-11, Kimball & Hawkins
Chapters 5 and 6
All the readings are about type. :)