Discuss A CRAP way to improve usability

Brilliantly simple and simply brilliant. Great article

Excellent post!! :) love the acronym!

An interesting article with some good principles explained, however I wanted to make a point regarding alignment.

Good usability design isn't always as simple as aligning everything on a grid.

When designing a form, ideally each field should only be as wide as the text that will entered into it. Most of the time you can use a standard width for your fields keeping them all nicely aligned, but there are some instances where it's not that simple.

For example a credit card number is 16 characters but the security code is only 3 or 4. You don't want an input field for your security code to be the same width as your credit card number field as it will never be same number of characters.

The same is true for date pickers fields which will only ever need to display 8 characters. You wouldn't want to make them the same width as other longer field to keep them all aligned on the grid.

So, how do you manage to align to a grid but also keep input fields the appropriate width? Through experience it takes a certain amount of finessing and head scratching, and a willingness to adapt the use case within the context of the task you're designing for.

@ Sam Gracie

I think you might be missing the principle. In those cases, break the fields down into the common denominator. All the text fields will be the same width, while credit card fields will be the same width, following the "R" principle. All are also following the "A" principle and are left aligned. Just because he says alignment, doesn't necessarily mean everything, including the widths need to be aligned, regardless of their function. :)

Great article with solid foundations for improved usability.

A seasoned UX professional would have insight that a visual designer generally wouldn't. For example, a UX person would put the Cancel button to the left, and the default action ("Add to Basket", "OK", etc.) on the right ... a visual designer wouldn't necessarily know to do this.

Excellent article! I loved the knife metaphor. Simple things like alignment of controls make such a difference yet are still sometimes overlooked.

Very well articulated. I echo all your points, especially about the argument of "Contrast" principle; I have spent an inordinate amount of time with "established" designers on this subject, repeatedly - striving for them to buy into the concept.

Also, a creative take on arriving at a catchy acronym - well done!

Excellent discussion about design and usability. I can't believe that the voting card in Florida's 2000 election was so confusing, and the example from Germany in 1933 is downright chilling.

I have often seen pop-up screens when leaving a page that make it very confusing (on purpose, of course) as to what button I want to push in order to get rid of the pop up. Somehow I always figure it out :)

Great job!

Great piece. One minor quibble: italic, not bold, is the opposite of roman. Text can be bold in either an italic or a roman font.

This is complete plagiarism from Robin William's "Non-Designer's Design Book." She identifies the four principles of design as Alignment, Contrast, Repetition, and Proximity. She even makes a reference to the fact that "CRAP" would be a poor acronym.

You simply reorganized the principles, and that's dishonest. I'm going to alert the author in a few days if you don't credit her or take this down. www.amazon.com

These arguments were already clearly explained by Luke W on his book on web forms.
It would have been wonderful to see this article take it to the next level, yet if feels like I am re-reading the book.

Is there more information on the repetition subject?

@Sam Gracie Agree with you regarding width of text fields.

@Allen I disagree. Clearly they are showing the right alignment of text fields as the difference between the two, and it's stated "The two forms are identical except that the form fields have been properly aligned in the example on the right. "

It doesn't really matter because it's a very poorly designed form in terms of grouping, placement of items, and amount of fields. Name could replace title, first name, and last name.

Thanks - a very enlightening article. Some usability aspects reminded me of the early days of VDU screen layout design which are still relevant today (I'm glad to see). Also, I was very interested in the article about an Experience Map which as a tester I would have found very useful as a basis for creating testing scenarios.

Keep up the good work

John Loney UK (retired IT person)

Simple and very well explained. Thanks a lot for the article.