Presentation on theme: "Lecture 8: Evaluation Using Heuristic Analysis"— Presentation transcript:
1 Lecture 8: Evaluation Using Heuristic Analysis Brad Myers/ / : Introduction to Human Computer Interaction for Technology ExecutivesFall, 2010, Mini 2
2 Heuristic Evaluation Method Expert evaluates the user interface using guidelinesUsability “inspection” methodDepends on evaluator’s judgementIs a “discount” usability engineering methodOne case study found factor of 48 in cost/benefit:Cost of inspection: $10,500. Benefit: $500,000 (Nielsen, 1994)
3 How to do Heuristic Evaluation Systematic inspection of systemMultiple evaluators are betterTrained evaluators are better22% vs. 41% vs. 60% of errors foundGo through whole interfaceResult: list of problems, guidelines violated, and proposed fixes
4 How Many Evaluators?Nielsen suggests optimal might be 4
5 HE MethodologyReference: Neilsen’s “How to Conduct a Heuristic Evaluation”:Each evaluator inspects interface separatelyOK for designer to answer evaluator’s questionsGo through interface several times using heuristicsCan supply evaluators with scenarios of user tasks
6 Guidelines Guide Design Knowing these guidelines should improve your designsTake them into account to avoid violating themAlso, all the other guidelinesE.g., in Chapter 19Neilsen evaluated 60 old guidelines and found 90% still valid after 20 yearsOthers no longer relevant, only 2 were “wrong”
7 10 Basic PrinciplesFrom Nielsen’s web page:Visibility of system statusMatch between system and the real worldUser control and freedomConsistency and standardsError preventionRecognition rather than recallFlexibility and efficiency of useAesthetic and minimalist designHelp users recognize, diagnose, and recover from errorsHelp and DocumentationSlightly different from text book list
8 175 More Guidelines (Chapter 19) These are primarily intended to guide you to a good design, not to be used for evaluationHelp users plan goals, tasksProvide a clear model of how users view system in terms of tasksHelp users with system model, metaphors, work contextDesign to match user’s conception of high-level task organizationHelp users understand what system features exist and how they can be used in their work contextHelp users decompose tasks logicallyMake clear all possibilities for what users can do at every pointKeep users aware of system state for planning next taskKeep the task context visible to minimize memory loadHelp users plan the most efficient ways to complete their tasksKeep users aware of task progress, what’s been done and what’s left to doProvide cognitive affordances at the end of critical tasks to remind users to complete the transactionProvide effective cognitive affordances that help users get access to system functionalityHelp users know/learn what actions are needed to carry out intentionsQuoted from Chapter 19 of H. Rex Hartson and Pardha S. Pyla, The UX Book: Ensuring a Quality User Experience, to be published by Morgan Kaufmann / Elsevier in 2011.
9 Guidelines, cont.Help users know how to do something at action/object levelHelp users predict outcome of actionsHelp users determine what to do to get startedProvide a cognitive affordance for a step the user might forgetSupport user with effective sensory affordances in presentation of cognitive affordancesMake cognitive affordances visibleMake cognitive affordances noticeableMake text legible, readableControl cognitive affordance presentation complexity with effective layout, organization, and groupingPresent cognitive affordance in time for it to help the user before the associated actionHelp user determine actions with effective content/meaning in cognitive affordancesDesign cognitive affordances for clarityUse precise wording in labels, menu titles, menu choices, icons, data fieldsUse a verb and noun and even an adjective in labels where appropriate.Avoid vague, ambiguous terms.Quoted from Chapter 19 of H. Rex Hartson and Pardha S. Pyla, The UX Book: Ensuring a Quality User Experience, to be published by Morgan Kaufmann / Elsevier in 2011.
10 Guidelines, cont.Be as specific to the interaction situation as possibleClearly represent work domain conceptsUse dynamically changing labels when togglingProvide cognitive affordances to indicate formatting within data fieldsConstrain the formats of data values to avoid data entry errorsProvide clearly marked exitsProvide clear “do it” mechanismBe predictable; help users predict outcome of actions with feed-forward information in cognitive affordancesMake choices distinguishableBe consistent with cognitive affordancesUse consistent wording in labels for menus, buttons, icons, fieldsUse similar names for similar kinds of thingsDo not use multiple synonyms for the same thingUse the same term in a reference to an object as the name or label of the objectUse different terms for different things, especially when the difference is subtleQuoted from Chapter 19 of H. Rex Hartson and Pardha S. Pyla, The UX Book: Ensuring a Quality User Experience, to be published by Morgan Kaufmann / Elsevier in 2011.
11 Guidelines, cont.Be consistent in the way that similar choices or parameter settings are madeDecompose complex instructions into simpler partsUse appropriate layout and grouping by function to convey content and meaningGroup together objects and design elements associated with related tasks and functionsDo not group together objects and design elements that are not associated with related tasks and functionsSupport user choices with likely and useful defaultsProvide the most likely or most useful default selectionsOffer most useful default cursor positionRelieve human short term memory loads by maintaining task context visibly or audibly for the userSupport human memory limits with recognition over recallAvoid requirement to retype or copy from one place to anotherSupport special human memory needs in audio interaction designAvoid cognitive indirectnessBe complete in your design of cognitive affordances; include enough information for users to determine correct actionQuoted from Chapter 19 of H. Rex Hartson and Pardha S. Pyla, The UX Book: Ensuring a Quality User Experience, to be published by Morgan Kaufmann / Elsevier in 2011.
12 Guidelines, cont.Prevent loss of productivity due to hesitation, ponderingUse enough words for unambiguous labelsAdd supplementary information, if necessaryGive enough information for users to make confident decisionsGive enough alternatives for user needsEmploy usage-centered wording, the language of the user and the work context, in cognitive affordancesFind ways to anticipate and avoid user errors in your designHelp users avoid inappropriate and erroneous choicesDisable buttons, menu choices to make inappropriate choices unavailableGray out to make inappropriate choices appear unavailableBut help users understand why a choice is unavailableProvide a clear way to undo and reverse actionsOffer constructive help for error recoveryAvoid confusing modalitiesDistinguish modes clearlyUse “good modes” where they help natural interaction without confusionSupport human memory limitations in the design of task structureSupport user with effective task structure and interaction controlProvide alternative ways to perform tasksQuoted from Chapter 19 of H. Rex Hartson and Pardha S. Pyla, The UX Book: Ensuring a Quality User Experience, to be published by Morgan Kaufmann / Elsevier in 2011.
13 Guidelines, cont. Provide shortcuts Provide logical grouping in layout of objectsGroup together objects and functions related by task or user work activityBut avoid grouping of objects and functions if they need to be dealt with separatelySupport task thread continuity by anticipating the most likely next task, step, or actionMake the most of user’s workDo not requiring users to re-enter dataRetain user state informationAvoid the feeling of loss of controlGive direct manipulation supportAlways provide a way for the user to “bail out” of an on-going operationSupport users making physical actions with effective sensory affordances for sensing physical affordancesSupport user with effective physical affordances for manipulating objects, help in doing actionsAvoid physical awkwardnessAccommodate physical disabilitiesDesign layout to support manual dexterity and Fitts’ lawQuoted from Chapter 19 of H. Rex Hartson and Pardha S. Pyla, The UX Book: Ensuring a Quality User Experience, to be published by Morgan Kaufmann / Elsevier in 2011.
14 Guidelines, cont.Support targeted cursor movement by making selectable objects large enoughGroup clickable objects related by task flow close togetherBut not too close, and do not include unrelated objects in the groupingDesign physical movement to avoid physical overshootInclude physicality in your design when the alternatives are not as satisfying to the userCheck your functionality for missing featuresCheck your functionality for non-user-interface software bugsAvoid too much automation and loss of user controlHelp the user by automating where there is an obvious needProvide feedback for all user actionsProvide progress feedback on long operationsRequest confirmation as a kind of intervening feedbackBut don’t overuse and annoySupport user with effective sensory affordances in presentation of feedbackMake feedback visibleMake feedback noticeableLocate feedback within the user’s focus of attentionQuoted from Chapter 19 of H. Rex Hartson and Pardha S. Pyla, The UX Book: Ensuring a Quality User Experience, to be published by Morgan Kaufmann / Elsevier in 2011.
15 Guidelines, cont. Make feedback large enough to notice Make text legible, readableControl feedback presentation complexity with effective layout, organization, and groupingHelp users detect error situations earlyMaintain a consistent appearance across similar kinds of feedbackMaintain a consistent location of feedback presentation on the screen to help users notice it quickly.Use the most effective feedback presentation mediumConsider audio as alternative channelHelp users understand outcomes with effective content/meaning in feedbackDesign feedback for claritySupport clear understanding of outcome (system state change), so users can assess effect of actionsGive clear indication of error conditionsBe complete in your design of feedback; include enough information for users to fully understand outcomes and be either confident that their command worked or certain about why it didn’tPrevent loss of productivity due to hesitation, ponderingQuoted from Chapter 19 of H. Rex Hartson and Pardha S. Pyla, The UX Book: Ensuring a Quality User Experience, to be published by Morgan Kaufmann / Elsevier in 2011.
16 Guidelines, cont. Add supplementary information, if necessary Give enough information for users to make confident decisions about the status of their course of interactionHelp users understand what the real error isGive enough information about the possibilities or alternatives so user can make an informed response to a confirmation requestDesign feedback wording, especially error messages, for positive psychological impactMake the system take blame for errorsBe positive, to encourageProvide helpful, informative error messages, not “cute” unhelpful messagesEmploy usage-centered wording, the language of the user and the work context, in displays, messages, and other feedbackBe consistent with feedbackLabel outcome or destination screen or object consistently with starting point and actionOrganize feedback for ease of understandingProvide user control over amount and detail of feedbackGive only most important information at first; more on demandQuoted from Chapter 19 of H. Rex Hartson and Pardha S. Pyla, The UX Book: Ensuring a Quality User Experience, to be published by Morgan Kaufmann / Elsevier in 2011.
17 Guidelines, cont.Organize information displays for ease of understandingEliminate unnecessary wordsGroup related informationControl density of displays; use white space to set offColumns are easier to read than wide rowsUse abstraction per Shneiderman’s “mantra”: Overview first; zoom and filter; details on demandEmploy usage-centered wording, the language of the user and the work contextAvoid the use of anthropomorphism in interaction designsAvoid using first-person speech in dialogueAvoid condescending offers to helpAvoid poor attempts at humorAvoid violent, negative, demeaning termsAvoid use of psychologically threatening terms, such as “illegal”, “invalid”, “abort”Avoid use of the term “hit” instead of “press” or “click”Avoid irritation with annoying sound and color in displaysUse color conservativelyUse pastels, not bright colorsQuoted from Chapter 19 of H. Rex Hartson and Pardha S. Pyla, The UX Book: Ensuring a Quality User Experience, to be published by Morgan Kaufmann / Elsevier in 2011.
18 Guidelines, cont.Be aware of color conventions (e.g., avoid red, except for urgency)Watch out for focusing problem with red and blueAvoid fancy or cute design without a real purposeMake presentation of text legibleMake font size large enough for all usersUse good contrast with backgroundUse mixed case for extensive textAvoid too many different fonts, sizesUse legible fontsUse color other than blue for textAccommodate sensory disabilities and limitationsAllow user settings, preference options to control presentational parametersAccommodate different levels of expertise/experience with preferencesDon’t let affordances for new users be performance barriers to experienced usersBe helpful with HelpDo not try to achieve the appearance of simplicity by just reducing usefulnessOrganize complex systems to make the most frequent operations simpleQuoted from Chapter 19 of H. Rex Hartson and Pardha S. Pyla, The UX Book: Ensuring a Quality User Experience, to be published by Morgan Kaufmann / Elsevier in 2011.
19 Guidelines, cont.Use consistent layout/location for objects across screensMaintain custom style guides to support consistencyUse structurally similar names and labels for objects and functions that are structurally similar….and the list isn’t even finishedQuoted from Chapter 19 of H. Rex Hartson and Pardha S. Pyla, The UX Book: Ensuring a Quality User Experience, to be published by Morgan Kaufmann / Elsevier in 2011.
20 1. Visibility of system status So we use Nielsen’s guidelines for evaluation:Keep users informed about what is going onWhat page they are on and what part of a processProvide appropriate feedbackAbout what system is doing, and how input is being interpretedE.g. in XXX product, "really ungroup?" -- loses associated behavior
21 2. Match between system and the real world Terminology in user’s languageNot computer terminologyLanguage from user’s perspective“You have bought…” not “We have sold you…”Use common words, not “techno-jargon”Error messages and feedback refer to user objectsAllow full-length names E.g. “Hit any key to continue”
22 3. User control and freedom Easy to abort: Cancel buttonsCancel order, cancel changing a profileEasy to UndoWeb issue: what does “Back” button do?Example: many sites can get confused if use back buttonUsers (even experts) will make errors E.g. in XXX product, no way to get out of editing a text field
23 4. Consistency and standards Same command always have the same effect Locations for information, names of commands Give the user a mental model of the systemSize, location, color, wording, function, sequencing, etc.E.g., color purple?Following standards helpsWeb: use templates or CSS, style guidesSeems easy, but often not followed; e.g. in XXX naming "F#1.C#1" vs. "F#1", "C#1"consistent with industry standards: e.g., Copypurple?
24 5. Error prevention Selection rather than entry question, when ambiguous city (e.g. Columbus)Remove or gray-out illegal choices Not common for web pagesConfirmationAvoid modesDefinition: same user action has different results Make unavoidable modes visible E.g. Typing "daytime" to a mail program
25 6. Recognition rather than recall Make objects, actions, options visibleSee and pick it, not generate itShort-term memory= 7 ± 2 items; 30 sec to 2 min unless interrupted Menus rather than type-in (but short enough) Prompts provide format and limitsDon't require retyping of remembered information Pervasive, generic rules (cut/paste) E.g. in Aegis, remembering altitude
26 Example: promptsWhat is a DTIC user code and how to get one?
28 7. Flexibility and efficiency of use Provide ShortcutsFor experienced usersE.g., Command keysJump directly to desired locationReuse previously entered informationGood default values
29 8. Aesthetic and minimalist design Good Graphic Design and Color ChoiceAppropriately direct attention Group related objects (alignment, decorations) Balance and white space Maintain display inertia Few fonts and colors (5 to 7 colors) Appropriate contrast Some people are color blind (8% of males)
30 Minimalist design “Less is More” Identify what is really needed If complex to explain/document, then redesign Concise language Avoid extraneous pictures and information Fewer options and menu choices Reduces planning time Extra options can confuse usersReduces manual size, etc. E.g. in XXX product: "Show Cartouche"
31 9. Help users recognize, diagnose, and recover from errors Help users when they are in trouble Opportunities for users to learn about the system Clear language; no codes Be precise; Not “syntax error” Constructively help the user solve the problemTell why the error happened and how to fix itBe polite and not accusing; positive wording: Not: “FATAL ERROR”, etc.
32 Error Messages, cont. Blame the system, not the user “Unrecognized” vs. “illegal” command No humor or snide comments Easy error recoveryCan have multiple levels of messagesE.g. in XXX product, “can't save file” — why not?
38 Pretty Good ExamplePretty Good: travel.yahoo.com: Says what to do to fix itBut language is inconsistent
39 10. Help and Documentation True walk up and use?Most people will not read documentationIf do, thenFirst time product is used, or elseIn a panic, so need information right awayIterative design of documentation neededSuperBook application answer found in 4.3 minutes, compared to 7.6 minutes before fixingHelp system is an extra feature to learn“Help doesn’t”If need to add help, maybe fix the feature?Use documentation writers to help refine the systemGood quality writing
41 HW 5 You will get two (2) systems from your classmates Will need to find 8 (eight) points that illustrate at least 4 (four) different guidelines to comment on, both good and bad
42 Template for reporting results Similar to template that used for user reports:Specify which heuristic correctlyOther fields, similar to user studiesBe sure it is clear where in the screen the problem isExample of one row filled out:(Old: used to use UAR Template: