Archive for February, 2008

Interactive Explaining, Great Value For Users

Explaining something through graphics is a great thing that could help users, but you can improve that even more if you make that interactive. We all learn in an interactive way through life, so why don’t we do that on the web? Keep in mind that a clear explanation could improve the overall website usability and could persuade users to use [and buy] your services.

Let me play, Google. I was playing with the AdWords configuration and think that the Google advertisement configuration website could be a little bit improved. I’m new there but still I think the whole interface is a little bit messy. But there is one [more] thing that Google is making in a great way, they are using an interactive graphic to teach users about the AdWords settings. You might think that this is obvious, but unfortunately not everybody is using this kind of simplicity to explain things. Have a closer look:

 

As the user selects between Lower Budget and Higher Budget the primary and the secondary effects change, in this case the number of impressions and the clicks. The graphic also makes clear that the ad position does not change.

Budget Interaction A

Budget Interaction B

 

Same as before, the user plays between Lower and Higher CPC to see what the primary and secondary effects are.

CPC Interaction A

CPC Interaction B

 

This interactive graphic tries to explain something a little bit complicated, the use of keywords, but it is very successful giving clear examples.  

Keywords Interaction A

Keywords Interaction B

Popularity: 4% [?]

Designing a Checkout Process, 4 Examples

This is a longer than usual article. I wanted to present you a better usability example, so I decided to publish one long article for Wednesday and Thursday.

Designing a good checkout process is worth, if it is not easy customers might get confuse and leave without buying anything. This is dangerous. Some key points for a good checkout process design:

 

- A checkout process should be simple

- You should avoid distractions (like flashy advertisement that could drive customers to other pages)

- Checkout button should be highly visible

- Your checkout process is probably a secure one, make the user notice that, e.g. placing a secure connection notice, that gives a feeling of trust

- Shipping and total price should be clear

- The process should be short, potentially only 4-5 steps; coming from the shopping cart the process should include shipping, billing, summary and a confirmation.

 

I would like to analyze the beginning of the checkout process. Here I present 4 websites with some examples you shouldn’t do. This is not an extended website review but I would like to point out some usability problems I have found. 

The NFL Shop is great because it has a lot of products, the shopping cart is unfortunately not well design. Notice here the great amount of information surrounding what is important for the user, it also has too many red flashy buttons that don’t let users notice what is the important stuff. Recommended products are almost falling into the shopping cart, creating even more confusion (maybe a separating line or box would make same order).   

NFL Shop Design

 

The Subside Sports checkout process begins with a huge usability problem, all the important buttons are placed at the bottom of the shopping cart. On the example there is only one item in it, but if you have more, the "Place Order" button will be hidden under the fold. A lot of users might never find that important button.  

Subside Sports Checkout Design

 

Big Soccer is performing a horrible example, this guys don’t know about the existence of usability tests (or common sense?). After I added a t-shirt, the shopping cart was shown empty and I got an error message telling me that the t-shirt was not available. I additionally got an error saying that the system was not able to determine the quantity I wanted to order. So, this guys display on the catalog products that they don’t actually have and the user notice it after adding the product to the shopping cart. This what we call bad user experience

Big Soccer Checkout Process Design

 

Skate America is also doing something bad. When I added a pair of snickers to the shopping cart, a t-shirt was automatically added for me. How nice, right? Well, actually not. Trust is also something you can communicate through a good design and adding products automatically to the shopping cart is not going in that direction. This is probably a marketing decision but interaction designers and usability experts (if they do have any) should warn about this kind of obscure tactics, trust is something highly desirable in online websites.  

Skate America Checkout Process Design

Popularity: 19% [?]

« Previous PageNext Page »