Usability: Amazon style
My stepfather is a pretty simple man. Whenever it’s time to buy any of us kids (I’m 31 now) a gift, he asks simply “Where do you want your gift certificate from?” I like this trait because I’m a pretty simple man myself. This year I suggested Amazon.ca.
There’s one problem - I thought to myself - my stepfather is going to have trouble ordering this thing online. He has a computer and likes to manage his stocks online - but that’s where his online experience ends. When talking to him he sounded a little intimidated but I told him he could always call me if he was having trouble.
I was amazed when I received his email gift certificate and a note that said… “Hope you get this… boy that was easy.” Easy! Did he say easy? I think this is how we want our customers to feel whenever they’re trying to spend a little money. My goal is always to design with ease of use as priority number one. Amazon can teach us a little in that regard.
Check out their gift certificate form - by clicking here. Here’s what I love about it:
No clutter
Amazon have replaced their extensively linked header with just an image of their logo. If you look closely, it’s actually pretty hard to navigate away from this page. This reduces the visual clutter and focuses the user on the form. Now is not the time to suggest a great new book or video - when someone is ready to buy - let them buy. Design the form to encourage the purchase decision.
Clear Instructions
Over each form element there are explicit instructions on how to complete it. My guess is that some of us probably think this is a bit of overkill. I think it is unwise to fall into that trap. Whenever I’m designing, I try to think how each phrase could be misconstrued. If there’s a chance your phrase can be misunderstood - reword it. If there’s a form element that could use an explanation - provide one. Think of the most easily confused person you’ve ever met - and design with them in mind.
Number Your Steps
Your user is never going to ask “Did I miss something?” if you number your form elements. It’s simple but crucial because it helps to relax the user by providing a clear roadmap to follow.
Directed Navigation
Amazon doesn’t give the user a “Back” or a “Cancel” button. Instead the user is only prompted to “Continue”. This guides the user through the process. The user is reassured that she can cancel the order in the future. Amazon moves the user through the process - and doesn’t give them a choice.
***
What’s amazing about this page is just how simple it is. I’m sure there are a lot of companies out there who wouldn’t dare put a page with so little polish (graphics) on their site. I can hear the graphic designers talking about how ugly it is. Nonetheless, this is a great example of interface design because it is focused squarely on the user. It’s almost impossible, even for my stepfather, to screw up.
For a more general look at how to design forms, check out this great article from the good folks at A List Apart.
Technorati Tags: usability, customerexperience, marketing, amazon, interfacedesign
One of the striking things here (which you touched upon) is the lack of navigation. It was one of the things I learned when we observed customers purchase a Fantasy Football game at ESPN. Folks smarter than I call it “intelligent inconsistency”. It pisses of designers and programmers (who often have a need for order), but it makes sense from a business and customer perspective: you don’t want anything distracting the customer from purchasing a product, and it’s easier for the customer to accomplish what he’s there to do. It’s win-win!