10 Usability Heuristics

 

Read the “10 Usability Heuristics” document (in attached file).  Choose an E-Commerce site and test it against the 10 heuristics.  Report on your findings. How do you think the usability of the site you chose will affect the parent company’s business?

 

– Deadline: 24 hours

 

– Just do like examples in the attached file!

Ten Usability Heuristics (Nielsen, 2004)

1. Visibility of system status The system should always keep users informed about what is going on,

through appropriate feedback within reasonable time.

2. Match between system and the real world The system should speak the users’ language, with words,

phrases and concepts familiar to the user, rather than system-oriented terms. Follow real-world

conventions, making information appear in a natural and logical order.

3. User control and freedom Users often choose system functions by mistake and will need a clearly

marked ”emergency exit” to leave the unwanted state without having to go through an extended

dialogue. Support undo and redo.

4. Consistency and standards Users should not have to wonder whether different words, situations,

or actions mean the same thing. Follow platform conventions.

5. Error prevention Even better than good error messages is a careful design which prevents a problem

from occurring in the first place. Either eliminate error-prone conditions or check for them and

present users with a confirmation option before they commit to the action.

6. Recognition rather than recall Minimize the user’s memory load by making objects, actions, and

options visible. The user should not have to remember information from one part of the dialogue

to another. Instructions for use of the system should be visible or easily retrievable whenever

appropriate.

7. Flexibility and efficiency of use Accelerators – unseen by the novice user – may often speed up

the interaction for the expert user such that the system can cater to both inexperienced and

experienced users. Allow users to tailor frequent actions.

8. Aesthetic and minimalist design Dialogues should not contain information which is irrelevant or

rarely needed. Every extra unit of information in a dialogue competes with the relevant units of

information and diminishes their relative visibility.

9. Help users recognize, diagnose, and recover from errors Error messages should be expressed in plain

language (no codes), precisely indicate the problem, and constructively suggest a solution.

10. Help and documentation Even though it is better if the system can be used without documentation,

it may be necessary to provide help and documentation. Any such information should be easy to

search, focused on the user’s task, list concrete steps to be carried out, and not be too large.

Example

1

The E-Commerce site I chose is Best Buy website (www.bestbuy.com).

1. Visibility of system status

The Best Buy let users know what’s going on and where the users are in process. There is always a clear label that appears in the top of the page, not matter which process the users are. For example, if the users create an account on Best Buy website, there is a label “create a bestbuy.com account” will show up on the top of that page. The users will clearly know they are in “create an account” process.

2. Match between system and the real world

The Best Buy E-Commerce system understands user’s language. It not only understands the user’s vocabulary, but also can know users’ expectations from context. For example, if I type “Camon camera” on the search engine of Best Buy website, the system can understand and automatically correct is as “Canon camera”. The system will provide the products that users want although they spell wrong.

3. User control and freedom

The users can easily go back and continue to next step if they need undo or redo their operation. The Best Buy give the users freedom to explore and see content in anywhere on its site. Best Buy provides users the option to compare different products by price, function and feature. It helps users find appropriate products for themselves.

4. Consistency and standards

The Best Buy website use same labels for things that do the same thing. It uses the same words to guide users to the next process. No matter which kind of product you want to buy, you just have to click the “shop now” button. If you want to see the details of the products or new service, you just have to click “see details”. Everything in Best Buy website is consistent and standard.

5. Error prevention

If the users want to buy a product, they will choose the option “add to cart”. Subsequently, there is a confirmation page will pop up. It lets users make sure and review their choice before committing. The users can check what product they have in cart at any time. Best Buy do this can prevent a lot of mistakes for users.

6. Recognition rather than recall

The Best Buy provides users all the information of products, such as overview, specifications, ratings&reviews and accessories. If users put their mouse on this information for a second, the tool tips will show on the right and give users extra information.

7. Flexibility and efficiency

The Best Buy search engine can memory users’ search record. If we search same products many time, the process will be much effective than the first time we search. However, I didn’t find keyboard shortcuts on the site that like other companies do, such as apple iTunes.

8. Aesthetic and minimalist design

Look at the website of Best Buy, the full page is very colorful and fancy. Many new products and advertisings take users’ focus. The Best Buy carefully designed each element of whole page. This information is rich but not messy. The users can easily find where the important information is. The search engine appears on the top of the whole page, the users can use it to search products that they look for after they understand the information on home page.

9. Help users recognize, diagnose, and recover from errors

If the users miss some personal information when they register their account or fill in the purchase form on Best Buy website, the system will point the mistake out and tell users which information is missed. The users type a wrong products’ name, the system will automatically correct it into a right name like I told about early.

10. Help and documentation

On the top right corner of Best Buy website, there is a customer service option. After click, we can find customer help area. It lists many common problems the user can meet. The users can easily find the solution of their problem. If they still cannot solve their problem, they can directly contact the Best Buy by phone or online. The Best Buy left users enough contact information.

How do you think the usability of the site you chose will affect the parent company’s business?

I think Best Buy expand its E-Commerce business can effective increase its profits, because eliminate the limit of distance. We can imagine that we just can go shopping at store which closes to home before we can shop online several decades ago. The company has to open many chain retails in order to get more market share. It will waste many operating costs. Right now, more and more companies have their own E-commerce and the people are getting lazier and lazier. The customers can shop online to buy any products from any shop. The company will increase its profits and reduce the cost.

COMMENT

Personally, i don’t like shopping to the the Best Buy from online store. Because when i ope the side that i always feel like dizzy from there pictures, as like product models in category, colors in category, function in category and etc. Normally, i perfect to go the store to take choose the product i want. But after after i read your analysis that i went the Web and found interesting about weekly deals. And i found most of them products with low price for dealing. so, i think The Best Buy online store is much more easier to find a great prices than to the the entity store.

Example 2

Staples.com

1. Visibility of system status

Staples.com clearly informs the user of what is taking place on the site. The pages load quickly, and when the user is idle, there is a flashing cursor to let them know where they have stopped I never had the feeling that the site was not responding to y commands.

2. Match between system and the real world

The terminology used at staples.com was easy to understand and direct. “Add to cart” “continue shopping” “product details” etc. are all terms that cannot be misinterpreted by novice internet shoppers.

3. User control and freedom

Staples.com displays a prominent red “X” at the top right corner of item descriptions. If this is not the desired product it is clear how to opt out from the item. They also have the “home” button on the top left of each screen. If at any time a user feels they have traveled to an incorrect page, it is very easy to leave and return to the home page.

4. Consistency and standards

Staples.com is consistent throughout the site. The same terminology is used in the shopping mode as the check-out mode. It was clear to me what items I was putting in my cart, the cost of each product, and total amount I spent.

5. Error prevention

Staples.com offers a complete review of your shopping cart prior to completing the order. This review would provide some degree of error prevention so a shopper could identify the actual items being purchased, and the quantity in the cart. Although I couldn’t find the site I was thinking of, I recently visited a site that had a pop up to question every move I made. “You’ve placed item B in your cart” “Is this correct?’. I recall being quite annoyed by the constant pop ups every time I selected something, but apparently they were going a little overboard on the error prevention. If I find the site I’ll add it on later.

6. Recognition rather than recall

Staples.com has your shopping cart displayed at the top of each page. It lists how many items are in the cart as well as the dollar value. This allows users to see exactly how much they are spending and hopefully give them some indication of what they have already entered into the cart. Staples.com also has a pop-up that comes after about 3 minutes of inactivity that offers assistance in finding products and help with the site.

7. Flexibility and efficiency of use Accelerators

Staples.com offers frequent users the ability to sign in under an account. It provides a history of purchases, frequently purchased products and quick reordering of your pre-entered shopping lists. Although the occasional shopper would not find this useful, return customers could same time in the long run by utilizing the features.

8. Aesthetic and minimalist design

Staples.com provides simple command boxes that are very direct and offer picture icons so they can be understood by all. They use a brightly colored shopping cart icon, red “x’s for deleting things from carts, camera icons to take a closer look at a product, and arrows for moving forward or backward. A user could almost be illiterate and still manage easily to navigate the site.

9. Help users recognize, diagnose, and recover from errors

I spent about 30 minutes on the staples.com site and received no “error” messages. The closest I came to was an out of stock item. Although I don’t constitute that as an actual error, staples.com did provide alternative suggestions to the product I attempted to put in my cart.

10. Help and documentation

Staples.com provides a “help center” tab in the top center of each page. The help topics are easy to understand and all clearly labeled, including such things as how to make a return, warranty policies and price match policies. They also provide an 800 number to reach a representative and a chat box for assistance.

Overall, I was impressed with Staples.com’s ability to meet the usability heuristics. I have used the site numerous times in the past, but never noticed how much effort they put into making the site user friendly. Obviously there was a lot more thought put into the construction than I would have thought before.

COMMENT

Staples has clearly put alot of thought into their site.  A couple of things you mentioned impressed me:  The offer of help that pops up after about three minutes of inactivity.  This is a good feature for a user who is “stuck” about what to do next as well as a good inducement for a user who has maybe lost interest.  The offer of an alternative when something you ordered was out of stock.  I like that they did that rather than just inform you that your choice was unavailable. 
At first I found the menu on the left (with all of its items) a little overwhelming.  Then I realized it is set up in the same way as the aisles in its stores.  This maintains a consistent “feel” between the brick and mortar store and the e-store.

Example 3

1. Visibility of system status

– When we are using www.expedia.com to search for hotels, flights, car rentals and etc., the website will respond by showing the full page feedback. For example, I try to search for a roundtrip ticket from Manchester to Los Angeles then the website shows a full page feedback that says “searching for the best roundtrip flights”. This is to let the users know that the website is working hard to find the results they are looking for.

2. Match between system and the real world.

– During the searching process, you can type only just the first few letters of your destination on the provided search box and the website will immediately pop up the full name of your search destinations.

3. User control and freedom

-There will be the search box on almost the top left of the page, when you are not satisfy with your first search result you can easily start the search process all over again.

4. Consistency and standards

-Expedia website is consistent for the whole website. No matter you are trying to search for flights, rental cars, hotels, destinations information or etc., the words and terms that the website is using will be the same everywhere.

5. Error prevention

– Before customers proceed to the next step by clicking on the “continue booking” button, there will be a small white box with the text “free cancellation within 24 hours!” next to that button for customers to choose in case they change their minds. I find that this is a very helpful feature which can help making sure that we are satisfy with our orders.

6. Recognition rather than recall

-The full detail trip summary box on the top right of the page is always telling what selection the customers have been made so far. This enables customers to easily view their trip summary.

7. Flexibility and efficiency of use Accelerators

– The website will automatically show users’ previous searches clearly on the first page, this help eliminating the need to type in the destination name every time.

8. Aesthetic and minimalist design

– I find that the design of the website is too complicated, not in the minimalist style and there are also a lot of advertisements showing on each page. I had a difficulties navigating on their website because there were too many details to see but since expedia.com is a travel website therefore I can understand that it’s hard to cut down on most of the content.

9. Help users recognize, diagnose, and recover from errors

-The error messages are stated clearly in red color alphabets every time the users forget to type in any information. For example, when the website requires users to type in their names, last names, phone numbers and etc. and if users forget to fill in the information, the website will promptly display the easy to understand error messages with red color alphabets.

10. Help and documentation

– When users are dealing with complicated application forms, where the information that they provide has to be exact, it is a good idea to provide them with detailed instructions. Users can click on the “customer support” link that located on the top right of the page. This feature allows users to type in their questions or search for similar topics with their problems.

COMMENT

Expedia is a site I have not yet used but while viewing the page I like the deals they have for every category, they do a great job with highlight the areas of focus on the site, the search area is great because During the searching process, you can type only just the first few letters of your destination on the provided search box and the website will immediately pop up the full name of your search destinations with many cues that will help users not make errors, and if that happens they allow you the ability to fix errors with the option of free cancellation which I think is really good. And they make it clear that they want to save you money all throughout your navigation of the site, showing the strategy of low cost. You did a good job of presenting this site because i found these same things you discovered