1 / 34

Heuristic Evaluation

Learn about heuristic evaluation, wizard of oz technique, evaluation methods, and user-friendly design practices to enhance user experience. Helpful for designers seeking to optimize their interfaces.

ltarbell
Download Presentation

Heuristic Evaluation

An Image/Link below is provided (as is) to download presentation Download Policy: Content on the Website is provided to you AS IS for your information and personal use and may not be sold / licensed / shared on other websites without getting consent from its author. Content is provided to you AS IS for your information and personal use only. Download presentation by click this link. While downloading, if for some reason you are not able to download a presentation, the publisher may have deleted the file from their server. During download, if you can't get a presentation, the file might be deleted by the publisher.

E N D

Presentation Transcript

  1. Heuristic Evaluation November 3, 2016

  2. Hall of Fame or Shame? LG F7100 courtesy of Genevieve Bell, Intel Launched in 2004 in UAE, Saudia Arabia, North Africa, India, Malaysia dt+UX: Design Thinking for User Experience Design, Prototyping & Evaluation

  3. Hall of Fame! LG F7100 courtesy of Genevieve Bell, Intel Launched in 2004 in UAE, Saudia Arabia, North Africa, India, Malaysia Good • targeted at Muslim audience • need to pray 5x/day pointing towards Mecca dt+UX: Design Thinking for User Experience Design, Prototyping & Evaluation

  4. Hall of Fame or Shame? WhatsApp mobile messaging dt+UX: Design Thinking for User Experience Design, Prototyping & Evaluation

  5. Hall of Fame! WhatsApp mobile messaging Good • do not have to pay expensive SMS • can contact people on other phones • works on “feature” phones → led to rapid take-off in developing world dt+UX: Design Thinking for User Experience Design, Prototyping & Evaluation

  6. Heuristic Evaluation November 3, 2016

  7. Outline • Wizard of Oz • Heuristic Evaluation Overview • The Heuristics • Exercise • Team Break dt+UX: Design Thinking for User Experience Design, Prototyping & Evaluation

  8. Wizard of Oz Technique • Faking the interaction. Comes from? • the film “The Wizard of OZ” • “the man behind the curtain” • Long tradition in computer industry • e.g., prototype of a PC w/ a DEC VAX behind the curtain dt+UX: Design Thinking for User Experience Design, Prototyping & Evaluation

  9. Wizard of Oz Technique • Faking the interaction. Comes from? • the film “The Wizard of OZ” • “the man behind the curtain” • Long tradition in computer industry • e.g., prototype of a PC w/ a DEC VAX behind the curtain • Much more important for hard to implement features • speech & handwriting recognition • how would we do it for VR? dt+UX: Design Thinking for User Experience Design, Prototyping & Evaluation

  10. Wizard of Oz Technique • Faking the interaction. Comes from? • the film “The Wizard of OZ” • “the man behind the curtain” • Long tradition in computer industry • e.g., prototype of a PC w/ a DEC VAX behind the curtain • Much more important for hard to implement features • speech & handwriting recognition • how would we do it for VR? CarbonShopper dt+UX: Design Thinking for User Experience Design, Prototyping & Evaluation

  11. Evaluation • About figuring out how to improve design • Issues with lo-fi tests? dt+UX: Design Thinking for User Experience Design, Prototyping & Evaluation

  12. Evaluation • About figuring out how to improve design • Issues with lo-fi tests? Not realistic • visuals & performance Not on actual interface • can’t test alone Need participants • can be hard to find repeatedly dt+UX: Design Thinking for User Experience Design, Prototyping & Evaluation

  13. Heuristic Evaluation • Developed by JakobNielsen • Helps find usability problems in a UI design • Small set (3-5) of evaluators examine UI • independently check for compliance with usability principles (“heuristics”) • evaluators only communicate afterwards • findings are then aggregated • use violations to redesign/fix problems • Can perform on working UI or on sketches dt+UX: Design Thinking for User Experience Design, Prototyping & Evaluation

  14. Why Multiple Evaluators? • Every evaluator doesn’t find every problem • Good evaluators find both easy & hard ones dt+UX: Design Thinking for User Experience Design, Prototyping & Evaluation

  15. Heuristics H2-1: Visibility of system status H2-2: Match between system & real world H2-3: User control & freedom dt+UX: Design Thinking for User Experience Design, Prototyping & Evaluation

  16. Heuristics (cont.) H2-4: Consistency & standards H2-5: Error prevention H2-6: Recognition rather than recall H2-7: Flexibility and efficiency of use H2-8: Aesthetic & minimalist design H2-9: Help users recognize, diagnose, & recover from errors dt+UX: Design Thinking for User Experience Design, Prototyping & Evaluation

  17. Heuristics (cont.) bad dt+UX: Design Thinking for User Experience Design, Prototyping & Evaluation

  18. Heuristics (cont.) good dt+UX: Design Thinking for User Experience Design, Prototyping & Evaluation

  19. Good Error Messages • Clearly indicate what has gone wrong • Human readable • Polite • Describe the problem • Explain how to fix it • Highly noticeable dt+UX: Design Thinking for User Experience Design, Prototyping & Evaluation

  20. Heuristic Violation Examples • [H1-3 Minimize the users’ memory load]Can’t copy info from one window to another • fix: allow copying • [H2-4 Consistency and Standards]Typography uses different fonts in 3 dialog boxes • slows users down • probably wouldn’t be found by user testing • fix: pick a single format for entire interface dt+UX: Design Thinking for User Experience Design, Prototyping & Evaluation

  21. Severity Ratings 0 - don’t agree that this is a usability problem 1 - cosmetic problem 2 - minor usability problem 3 - major usability problem; important to fix 4 - usability catastrophe; imperative to fix dt+UX: Design Thinking for User Experience Design, Prototyping & Evaluation

  22. Severity Ratings Example 1. [H1-4 Consistency] [Severity 3] The interface used the string “Save” on the first screen for saving the user’s settings, but used the string “Store” on the second screen. Users may be confused by this different terminology for the same function. dt+UX: Design Thinking for User Experience Design, Prototyping & Evaluation

  23. Decreasing Returns problems found benefits / cost * Caveat: graphs for a specific example dt+UX: Design Thinking for User Experience Design, Prototyping & Evaluation

  24. Heuristic Evaluatoin Summary • Have evaluators go through the UI twice • Ask them to see if it complies with heuristics • note where it doesn’t & say why • Combine the findings from 3 to 5 evaluators • Have evaluators independently rate severity • Alternate with user testing dt+UX: Design Thinking for User Experience Design, Prototyping & Evaluation

  25. e x e r c i s e dt+UX: Design Thinking for User Experience Design, Prototyping & Evaluation

  26. e x e r c i s e dt+UX: Design Thinking for User Experience Design, Prototyping & Evaluation

  27. http://hci.stanford.edu/courses/cs147/2016/au/assignments/simple-heuristic-evaluation.pdfhttp://hci.stanford.edu/courses/cs147/2016/au/assignments/simple-heuristic-evaluation.pdf Find 12-15 Heuristic Violations dt+UX: Design Thinking for User Experience Design, Prototyping & Evaluation

  28. Problems Found • H2-5 Error Prevention allows non-numeric data in the quantity field. fix: don’t allow it. [90] 2. H2-5 Error Prevention quantity field doesn’t multiply by the price to give a correct total. fix: make it work. [55] 3. H2-10 Help & Documentation link for international visitors hidden at bottom & may not be readable by non-english speakers. fix: move up to prominent location & include flags? [30] 4. H2-5 Error Prevention “Remove item bolded in red”, but red used for multiple purposes. Fix: get rid of ads in the checkout! More direct way to remove out of stock item or not even let me add a item that is out of stock. [100] 5. H2-5 Error Prevention No way to check out. [110] dt+UX: Design Thinking for User Experience Design, Prototyping & Evaluation

  29. Problems Found Last Year • H2-4 Consistencyremove column, 4th item is different w/ checkboxes. [150] • H2-9 Error preventionnon-numeric data in the quantity. Do not allow. [125] • H2-2 Match between system & real worldvehicle selection link not language I’d expect [100] • H2-1 Visibility of System Statusunclear which item to remove based on error message (“red/bold”). [150] dt+UX: Design Thinking for User Experience Design, Prototyping & Evaluation

  30. dt+UX: Design Thinking for User Experience Design, Prototyping & Evaluation

  31. dt+UX: Design Thinking for User Experience Design, Prototyping & Evaluation

  32. Further ReadingHeuristic Evaluation • Longer lecture • https://drive.google.com/file/d/0BweiB6wu4sBaN2tfZGxKb2tuOTg/view • Books • Usability Engineering, by Nielsen, 1994 • Web site • http://www.nngroup.com/articles/ dt+UX: Design Thinking for User Experience Design, Prototyping & Evaluation

  33. Next Time • Lecture • Visual Information Design • Read • Watch Scott Klemmer’s HCIOnline lectures: • 6.1 Visual Design (7:37) • 6.2 Typography (10:47) • 6.3 Grids & Alignment (17:33) • Studio • Medium-fi Prototype Presentations • Start Heuristic Evaluation dt+UX: Design Thinking for User Experience Design, Prototyping & Evaluation

  34. team break dt+UX: Design Thinking for User Experience Design, Prototyping & Evaluation

More Related