Top 10 Usability Mistakes Not to Make, Thanh Ngyuen, Senior Website Usability Analyst, BusinessOnline


Published on

Top 10 Usability Mistakes Not to Make

Apply the Known Truths of Usability to Drive Website Effectivenes: This is an overview session which will help define user-experience and demonstrate how the user’s perspective should be taken into account when developing all the components of your site – from navigation, to image placement and calls-to-action. She will discuss the Top 10 elements affecting users’ website experience and conversions, and provide useful information on best-practices, minimum standards, and learned conventions in website usability.

Published in: Technology, Business
  • Be the first to comment

No Downloads
Total views
On SlideShare
From Embeds
Number of Embeds
Embeds 0
No embeds

No notes for slide
  • <number>
  • UCSD: The first university to develop a department specifically made for human computer interaction, usability, and cognitive designUsability Testing: Conducted interviews, surveys and observations studies on social networks, websites, online blogging, and the usability of a triangulation module for the shuttle operations at UCSD
  • <number>
  • <number>
  • Today, we will be discussing usability only on the internet. Many of the same principles apply to software and application design, but today we will be specific on focusing on online marketing.What does ease of use really mean? <number>
  • - Setting expectations correctly on web site<number>
  • 62% of customers leave a Web site because they cannot find what they are looking for...and the main reason is poor Web site information architecture.  —Boston Consulting Group  Information architecture, specifically to the web, is 80% of usability<number>
  • Using controlled vocabularies and the right nomenclature for your user audience<number>
  • Using best practices, we can minimize these annoyances. On top of that, sometimes, we have to annoy the user. Sometimes, we have to keep that promotion. Sometimes, we need to display that banner ad for the sake of our business or our partner’s etc. But how do we display it so that it doesn’t annoy the user?
  • <number>
  • website built to satisfy management, not users- “branding” becomes the focus, site is treated as an advertisement, visual design overrides usability- it takes an act of corporate bravery to put up a relatively austere, simple site engineering owns too much responsibility for UI designend result: the UI reflects implementation technologies, developers’ back-end design modelmany product mgmt teams can’t escape featuritis:“competitor A has these 5 features, competitor B has those 10… we’d better put them all in our next release.”<number>
  • \"In short, it appears, as many suspect, that distrust of the Internet undermines e-commerce. Specifically, those who perceive greater risks on the Internet are less likely to shop online. In turn, perceptions of risks are associated with bad experiences online\". Trust in the Internet: The Social Dynamics of an Experience Technology. (PDF) by William Dutton and Adrian Shepherd, Oxford University 40% won’t return to the physical store after a negative experience online (Boston Consulting Group)One of our clients, after implementing 3 of our changes (include header tags, get rid of redundant navigation, re-organize search), saw a 63% increase in conversions online<number>
  • <number>
  • The rule of thumb in many usability-aware organizations is that the cost-benefit ratio for usability is $1:$10-$100. Once a system is in development, correcting a problem costs 10 times as much as fixing the same problem in design. If the system has been released, it costs 100 times as much relative to fixing in design.\" (Gilb, 1988) - Many are in the negative zone: Garage analogyFewer last-minute design changes Usable, appealing, and effective designs Simple, less costly documentation Credible marketing claims Compelling product demonstrations Increased sales Reduced need for customer support Longer market life
  • <number>
  • <number>
  • Things we do as cognitive beings
  • <number>
  • Left: The topmost “Buy Now” button is actually for the item above the first item shown here. If you line up the top/bottom of the photos of each product, you can tell which buy button goes with which product. However, it’s still very confusing due to the close proximity and the fact that each item is grouped between two lines with the wrong buy button!Right: Each city is way too close to each other. Space them out and separate them!<number>
  • Obviously, these are just the same pictures with very minor changes. However, they add a lot of value. This is the absolute minimum that should be done, a lot more can easily make these things more readable and aesthetically pleasing.The right could still use a lot of spacing and listing of the dates can be handled better. I could also point out that the US is the only country that uses Month/Day/Year, using this format is potentially confusing for the non-US people who are scheduling an exam.
  • Top 10 Usability Mistakes Not to Make, Thanh Ngyuen, Senior Website Usability Analyst, BusinessOnline

    1. 1. Top 10 Usability Mistakes NOT to Make
    2. 2. Who Am I? • Thanh Nguyen Senior Usability Engineer BusinessOnLine • Education – Degree in Cognitive Science Specializing in Human Computer Interaction – Computer Science Degree – HFI Certified – Featured C.U.A of the Month for April • Specialty: Information architecture, interface design, ethnographic research, user testing, contextual inquiry, accessibility, persona development © 2009 Online Marketing Connect Institute
    3. 3. Agenda • What is Usability? • Why is Usability Important? • Top 10 Mistakes • Questions © 2009 Online Marketing Connect Institute
    4. 4. TWITTER @xylandaria #OMS
    5. 5. What is Usability?
    6. 6. Definitions • “Usability is the measure of the ease with which particular people can employ a particular tool or other human-made object in order to achieve a particular goal.” - The Wiki, • “Usability is a quality attribute that assesses how easy user interfaces are to use.” - Jakob Nielsen, Alertbox, • “After all, usability really just means that making sure that something works well: that a person of average (or even below average) ability and experience can use the thing - whether it's a Web site, a fighter jet, or a revolving door - for its intended purpose without getting hopelessly frustrated.” - Steve Krug, Don't Make Me Think, 2000, p. 5 © 2009 Online Marketing Connect Institute
    7. 7. What Does Usability Mean? • Many definitions but same idea: Ease of Use © 2009 Online Marketing Connect Institute
    8. 8. It Means… • Having the right info I want I’ve clothing got music © 2009 Online Marketing Connect Institute
    9. 9. It Means… • Making that info easy for users to find (important) Somewhere Where is in my it? navigation © 2009 Online Marketing Connect Institute
    10. 10. It Means… • Displaying that info in a way that makes sense to the user ? Lorem ipsum dolor sit amet © 2009 Online Marketing Connect Institute
    11. 11. It Means… • Helping the user accomplish the goal without annoying them too much Don’t you like the @!%#* rotating, jumping, flashing monkey on the right side of my screen? © 2009 Online Marketing Connect Institute
    12. 12. Why is Usability Important?
    13. 13. Reason 1: Analytics only tells half the story
    14. 14. Reason # 2 – The Site Was Built With Business Objectives First Web site created with business Investment ‘A’ concerns first: • Limited Resources • Biggest Payback (ROI) • Fastest Payback BUSINESS • Shareholder Concerns • Customer Impact Investment ‘C’ Investment ‘B’ • Engineers • Competitive Landscape (# features)
    15. 15. Reason # 3 – Need For Increased ROI • Usability can: • Improve customer trust and loyalty – More return visits = increased traffic – More brand loyalty – Less shopping cart abandonment • Increase customer satisfaction and productivity • Increase sales and conversions © 2009 Online Marketing Connect Institute
    16. 16. Reason # 4, #5, #6, ∞ - Other Fringe Benefits • Usability saves time, money and increases sales: • Increases operational efficiencies. The number of resources needed to rework (recode/ rewrite) a product is much greater than to make changes during the original development process. • Increases adoption. The more usable a product, the more customers use it. The more usable the extranet, the more customers will be enticed to use it. • Increases productivity. The more usable a product, the less time it takes to train users and the more quickly they become productive using the product. • Reduced development time and costs. If usability is taken into consideration at the beginning of a design process, it will reduce the time to develop the system, therefore, reducing the cost. © 2009 Online Marketing Connect Institute
    17. 17. Think Usability Sooner Than Later Hig h De s ig n Fle xibility Dis c o ve ry • Requirements Definition Elabo ratio n • Competitive Analysis S ite Launc h • User Centered Analysis • System Flow • Information Architecture • Persona Development Co ns truc tio n • Card Sorting • Design • Coding • Documentation • Beta Test Mainte nanc e Time Lo w © 2009 Online Marketing Connect Institute
    18. 18. Top 10 Usability Mistakes Not To Make
    19. 19. #1 Do not make your website look like it was made by a used car salesman
    20. 20. #2 Do not wrongly use the principle of proximity
    21. 21. Principle of Proximity
    22. 22. © 2009 Online Marketing Connect Institute
    23. 23. © 2009 Online Marketing Connect Institute
    24. 24. #3 Not using the principle of color
    25. 25. © 2009 Online Marketing Connect Institute
    26. 26. © 2009 Online Marketing Connect Institute
    27. 27. Color • Use color to draw attention to important elements on websites • Things that share the same color are perceived to belong in a group © 2009 Online Marketing Connect Institute
    28. 28. #4 Not creating a clear starting point
    29. 29. © 2009 Online Marketing Connect Institute
    30. 30. Universal Cognitive Behaviors • Scientific research indicates the eyes tend to move from: Larg e to S mall Irre g ular to re g ular Dark to lig ht S aturate d to Le s s S aturate d © 2009 Online Marketing Connect Institute Source: Hum Factors International, 2007 an
    31. 31. #5 Not using lines to separate content
    32. 32. Without Lines © 2009 Online Marketing Connect Institute
    33. 33. With Lines © 2009 Online Marketing Connect Institute
    34. 34. #6 Not dividing information into 5 - 9 meaningful chunks
    35. 35. Good Example:
    36. 36. #7 Not denoting what is clickable and what isn’t
    37. 37. © 2009 Online Marketing Connect Institute
    38. 38. #8 Not saving data in forms when user hits the back button
    39. 39. #9 Not allowing users to control their own experience
    40. 40. #10 Not doing user testing
    41. 41. Usability is not one size fits all, it’s creating what is right for YOUR user
    42. 42. Questions?
    43. 43. Thank You • Thanh Nguyen Senior Usability Engineer, C.U.A. BusinessOnLine • Blog: • Usability Labs – Free 15 one-on-one usability evaluation of your website • White Paper – Summer 2009 – More Top 10 Usability Mistakes © 2009 Online Marketing Connect Institute