CRAP Design: Part 3 - Alignment
January 28th, 2007 — VyomaThis is the the third post in the CRAP Design series. In the last post we looked at the Proximity principle. In this post, we will look at the ‘A’ in the CRAP - the Alignment Principle.
The Alignment design principle states that no element in a design/layout must be placed arbitrarily. All the elements should be aligned with one of the elements in a page. This principle applies to both the actual placement of each element, and also the property of the elements like justification in terms of text or paragraph.
We see the natural world, and see that there is nothing much in alignment; it is all chaotic. But if you observe carefully, you would find one element aligned to another. The birds are aligned to each other when they fly in formation. The strands of a fern are aligned to each other. Where you see something that is aesthetically pleasing in nature, most of the cases, you would see that there is some aligning between the elements.
This seems to have been replicated in the design principles. By aligning the different elements in your page, you would form a harmony and create an appealing design.
Let us again take an example of the business card of our beloved Desin Uncrap.
As you can see, it does not speak well of Desin as a designer. It does not look professional, and does seem to look like it requires some heavy work.
On the contrary, it does not require much work. All that is required, is to align the different elements with respect to one another.
As you may see, the proximity principle too has been applied to group the related elements together. But to understand the alignment principle at work that gives the elegance to the above design, see the same card with guide lines shown in red:
The edge of the card forms the primary guideline off which I have chosen secondary guidelines and placed each elements lined to them.
Another point you may notice is that, I did not go for a center aligned text for any of the elements. Robin, in her book, The Non-designer’s Design Book, says that we should avoid going for a center aligned text in most cases. You may find good designs that are center aligned, but it takes an exceptional designer to make it work. You may though use a center aligned text in specific cases like greetings, invitations, and similar cases, where the center aligned text itself forms a spine of guide line.
Hence, it is prudent to choose the proper alignment for each of the elements in a web-page or document, and see to it that all the elements are aligned to one another.
In the next post of this series, we would look at the ‘Repetition Principle’.
Update: This blog post is a part of series.