Design Better with CRAP
The power and ease-of-use of today’s computer applications has raised the bar drastically on the quality of design expected in the documents we produce. As recently as ten years ago, it was typical to produce business letters, memos, and other documents using a courier-like, monospaced typeface, often with only underlining available for emphasis of key passages or section headings. The only options for correcting typos and other mistakes were white-out, pencilled-in marks, or re-typing. Our documents looked boring, but they were expected to look boring.
Today that’s all changed. Word processing and desktop publishing software are everywhere, and offer dozens (if not hundreds) of fonts ranging from the simple and elegant to the downright bizarre. Style sheets on the web and easily accessible styling options in our desktop software allow us to easily create section headings, pull-quotes, bulleted lists, and text columns — giving us the potential to greatly enhance the layout and delivery of information.
The result, of course, is more likely to be a mish-mash of difficult-to-read fonts, seemingly random italics and boldfaced text, extraneous sidebars, and awkward layouts. In unskilled hands, the tools available to us can very quickly produce messy, over-designed documents that are far less readable than the plain typewritten documents of old.
Applying a few basic design skills can help avoid those mistakes, instead allowing the features we often regard as “extras” to take their rightful places as means of enhancing the readability and impact of our work. While design is a skill — equal parts art and science — that can take years to develop to a professional level, the core ideas are quite simple, and applying them can produce a marked improvement on your day-to-day work.
All design starts from four basic principles, abbreviated as CRAP (they come in no particular order, so the more squeamish can rearrange them to form “CARP”, if you like. I’d advise against “PCRA”, though…). These are Contrast, Repetition, Alignment, and Proximity.
- Contrast: Contrast refers to any difference of size, shape, or color used to distinguish text (or other elements, though here we’re focusing on text) from other pieces of text. The use of bold or italics is one common form of contrast — the difference in shape makes the bolded or italicized text stand out from the surrounding text. Increasing the size of headers and titles, or using ALL CAPS or smallcaps are other ways of distinguishing text. These techniques only work if used sparingly; a document typed in all capital letters has less contrast than one typed normally, so is harder, not easier, to read.
- Repetition: Repetition in your text is bad; repetition of your design elements is not only good but necessary. Once you’ve decided on a size and typeface for second-level headers, for instance, all second-level headers should look the same. For most documents, two or maybe three fonts — leaning heavily on one for all the body text, with the other two for headers and maybe sidebars — are enough. The same bullets should be used on every bulleted list. Information that appears on every page should appear in the same place on every page. Design elements — like horizontal rules between sections or corporate logos — should appear the same whenever they are used throughout the document. Repetition of design elements pulls the document together into a cohesive whole, and also improves readability as the reader comes to expect text that looks a certain way to indicate certain qualities (e.g. the start of a new section, a major point, or a piece of code.
- Alignment: Alignment is crucial not just to the cohesive appearance of your document but to the creation of contrast for elements like bulleted lists or double-indented long quotes. Your document should have a couple of vertical baselines and all text should be aligned to one of them. Unaligned text floats mysteriously, forcing the reader to figure out its relation to the rest of the document. Centered text is particularly bad (and is a novice’s favorite design trick). One immediate step you can take to vastly improve the appearance of your documents is to remove the “center” button from your software’s toolbar (or, less drastically, just ignore it). It is rarely self-evident what centering is meant to communicate, and too much centered text creates a sloppy, undisciplined look.
- Proximity: Pieces of information that are meant to complement each other should be near each other. One great offender here is business cards and ads in local newspapers, where the name, address, and phone number are all scattered around the ad or card (for example, in the corners). Your reader shouldn’t have to seek out the next logical piece of information; rather, use proximity to make sure that the next piece of information a reader sees is the next piece of information they should see.
None of these principles stands alone. Repetition and alignment together create the “normal” state that allows changing the shape or position of a piece of text to produce contrast; repetition and proximity go hand-in-hand to create useful formats like bulleted lists — the repetition of the bullet adds force to the proximity of the points. In fact, the bulleted list above uses all four of these principles to work: it contrasts with the body of this article by being aligned to a different baseline than the rest of the paragraphs; each principle is in boldface, providing contrast, and is also directly followed by its explanation, providing proximity; the bullets, the boldfaced text, and the alignment are repeated in each new point on the list.
Almost all design builds on the foundation laid out above. Asking yourself how well each element of your layout satisfies these basic principles is a good way to make sure your work remains readable to your audience while also communicating a bit of your organization’s or business’ character. You may already unconsciously use these principles in your work, but knowing the principles and recognizing their use will help you make better, more conscious decisions in the future.
Ultimately, the goal is for the work you put in to designing a document to disappear, to become invisible, leaving your reader or viewer with unfettered access to the points you are trying to convey — both directly in your text and, ever-so-subtly, in your choice of design elements. In this respect, it’s a thankless job, because only rarely will anyone comment on (or even notice) the quality of design — but they will notice, and act on, the message. And that’s what’s important, isn’t it?
NOTE: The principles outlined above are developed in full in Robin Williams’ excellent book The Non-Designer’s Design Book, which I recommend to anyone who wants to further develop a solid sense of design to improve their day-to-day written work. This post is intended as an introduction to Williams’ concepts and deeper explanation of their use.
Tags: 
Get your own Avatars at 
Loading ...
Comments
Rick L says on July 30th, 2007 at 11:50 am
I once believed that design was about making things pretty. So, my utilitarian sensibilities rejected it as being frivolous.
Then I read about C.R.A.P. from a well-written little book called The Non-Designer’s Design Book, which I spent a few minutes browsing through in a local bookstore about ten years ago. Those few minutes have greatly improved every resume, business card, web page, and document that I have created since.
What I have realized since then is this: Design is not about making something pretty. It is about making something easier to use. This is exactly what the four CRAP principles do for you: They make information in a document easier for a person’s brain to process. If done properly, the presentation usually becomes pretty as a natural side effect.
Dustin Wax says on July 30th, 2007 at 12:07 pm
Yes, that’s *exactly* the point — design makes things easier to use. In print layout, they make text more readable and make your point clearer. I don’t know how well these principles apply to, say, designing an office building, but for print, they really do enhance writing.
I believe I first read about CRAP in the same book, actually. I’m kind of a “design groupie” and tend to pick up books on design when I come across them and they’re not expensive (a big “if” where design books are concerned) and read quite a few design websites, so I might have seen CRAP mentioned elsewhere first, but I definitely remember it from the Non-Designer’s Design Book. I heartily recommend the book to anyone who wants to go a couple steps further than a short post can take you.
Chanpory says on July 30th, 2007 at 4:23 pm
Hey Dustin, great post. I was just about to write about C-R-A-P this very week, but you beat me to it!
Meng says on July 31st, 2007 at 4:17 am
I was just thinking about the same topic this morning. I thought about my journey from a graphic designer to a user interface design and was wondering if the book “The Design of Everyday Things” should be made required reading for all design students, regardless of their chosen fields of specialization. Check out that book if you want to extend CRAP to other aspects of design.
Patrick says on July 31st, 2007 at 9:58 am
These are great ideas. I do design work for clients on a regular basis and will share these with the others on my design team.
Peter Cooper says on July 31st, 2007 at 10:36 am
I’ve been fond of using Situation, Heuristics, Intelligence, and Technology myself.
Bryan Gibson says on July 31st, 2007 at 11:06 am
Great article and very articulate. i have passed this on to many colleagues and lots of friends.
Now for my ranting :)
I came across these principles in a Visual Design course in my Information Studies program in college. We explored their roots in Gestalt psychology (http://en.wikipedia.org/wiki/Gestalt_psychology), defined their importance based on humans being mostly visual perceivers, and delved deeply into each of the principles (ways of breaking or using them). We had to bring examples of ads, sites, etc. that obey these principles or not. We also had to give presentations on these principles with personal examples across several mediums.
I am glad to hear that this messgae is broadcast in a public fashion for the reasons the author mentions, specifically the ubiquity of word processing/publishing capabilities. This has enabled “arm-chair” design that often results in horrible local ads, poor layouts in technical documentation, and, worst of all, what i call “myspace syndrome”.
As a note, one principle we added was Typography. My moniker of choice then became CRAPT (which i loved saying over and over during my presentation). All too often do people not understand the readability concerns with fonts. I initially disgreed with the readability issues, in terms of serifed and sans-serifed fonts, but ultimately accepted the truth; serifed fonts are easier to read (due to their serifs, or tails/tags, presenting subtle visual cues).
I work for an international software develoepr and all too often do i see engineers designing atrocious UIs. I have always made it my goal, starting as an Engineer and now as a Product Manager, to produce the most “usable” and intuitive interface designs. Often i repeat to myslef, “could a monkey use this?”. The tide has turned, however, now that we have finally hired a Usability team, tasked with designing UI with the user at the center. It is a culture change that we are still fighting, but will be won.
I implore anyone designing any visual entity that will be used/seen by an audience larger than yourself to utilize these principles. It may also help to look into their roots, which may provide insight not found at the surface of these concepts.
10668844 says on July 31st, 2007 at 11:08 am
I will never forget CRAP again.
John Payne says on July 31st, 2007 at 12:09 pm
This is a great article! twenty seconds into it I learn I have been comminting a cardinal design sin in creating my run sheets for the morning news show, presenting them in all caps, and had three people instantly agree that I should have been shot years ago for it.
Ozh says on July 31st, 2007 at 1:02 pm
ThinkVitamin last year’s article is much more complete on this: http://www.thinkvitamin.com/fe.....ite-design
Ross says on July 31st, 2007 at 1:23 pm
Robin Williams talks about this extensively in The Non-Designer’s Design Book:
http://www.amazon.com/Non-Desi.....1566091594
Robin Williams says on July 31st, 2007 at 1:29 pm
Gosh, several of the readers of my book, The Non-Designer’s Design Book, sent me this link. I love that you’re talking about these simple concepts and that they’ve made such an impact. I would, um, however, really appreciate credit. :-) I did put the concept together after teaching graphic design for years. It was so useful in my classes that it inspired the book.
Thank you, Dustin!
Dustin Wax says on July 31st, 2007 at 2:18 pm
Robin,
Thanks for dropping by! I promise I did not mean to slight you by not mentioning your work which, as I said above, I heartily endorse! I hadn’t thought of where I knew these principles from when writing the post, and it wasn’t until someone else commented with the title of your book that I remembered.
andrea says on July 31st, 2007 at 3:08 pm
This article is a rip-off of the first chapter of “The non-designer’s design book”. It would be nice to attribute the source.
bob says on July 31st, 2007 at 4:53 pm
C.R.A.P. is also Cancellation, Restriction and Punishment – a term coined by Richard Stallman
The Real World says on August 1st, 2007 at 6:57 am
“As recently as ten years ago, it was typical to produce business letters, memos, and other documents using a courier-like, monospaced typeface…the only options for correcting typos and other mistakes were white-out, pencilled-in marks, or re-typing.”
B O L L O C K S ! – 15 years ago AT LEAST! yeah, we were all using twink on those docos we produced with Microsoft Office 97…
Dustin Wax says on August 1st, 2007 at 10:21 am
Though Office 97 and Windows 98 were out 10 years ago, they were not in use in a lot of places. I worked for a major museum in New York City in 1999, where we used DOS and were expected to use courier for internal memos — and a number of documents were still expected to be typed on the honking big electric typewriter that took up half my cubicle’s desk. I’m sure that even today there’s workplaces where a kind of technological conservativism demands the use of typewriters or typewriter-esque documents.
Jeremy S says on August 1st, 2007 at 5:22 pm
There are two other principles which might come in handy –
Balance. Is the design balanced in weight, colour and space?
Hierarchy. Is there a focal point, and does the design lead your eye through it. Is it bleedingly obvious what you’re supposed to look at first?
From my experience, once you get a handle on what the principles mean, you can refer back to the list at any stage in a project and instantly see where you’ve gone awry and how to better the design.
I keep a small poster on my studio wall just for this purpose, and it has really made me a better designer all around.
syahid ali says on August 4th, 2007 at 6:38 am
for me, alignment works the best.
Ian says on August 9th, 2007 at 3:06 pm
Sounds a lot like the Gestalt principles to me… basic design stuff I learned in college.
Vuarnet says on August 9th, 2007 at 8:11 pm
Hi
I translated this article to spanish:
http://isopixel.net/archivos/2.....o-con-crap
Tiffany says on April 22nd, 2009 at 1:09 pm
hey this is very akward for me but i have no idea what CRAP is but i learned so thanks for teaching me what CRAP is i really apprecitate it. it was my dream to know what CRAP was and i thought i had to go to the bathroom so what ever it’s all good now!. Thanks for showing me the meanng of CRAP and maybe one day we can talk about PEE