Ce diaporama a bien été signalé.
Le téléchargement de votre SlideShare est en cours. ×


Prochain SlideShare
Chapter 4
Chapter 4
Chargement dans…3

Consultez-les par la suite

1 sur 52 Publicité

Plus De Contenu Connexe

Plus récents (20)



  1. 1. Chapter 3 Evaluation Techniques Prepared by Mdm PYTan
  2. 2. LEARNING OUTCOME • Identify the concept of user interface design to elevate technical complexity for usable product that accepted by user. (C3, PLO1) Prepared by Mdm PYTan
  3. 3. What are They doing? Prepared by Mdm PYTan
  4. 4. Prepared by Mdm PYTan
  5. 5. What is evaluation? • Evaluation tests the usability, functionality and acceptability of an interactive system • Tests the system to ensure that it actually behave as we expect and meet user requirements Prepared by Mdm PYTan
  6. 6. Questions… • When we should do evaluation process? • What is the advantage and disadvantage of doing evaluation during design process? Prepared by Mdm PYTan
  7. 7. Goals of Evaluation • assess extent of system functionality • assess effect of interface on user • identify specific problems Prepared by Mdm PYTan
  8. 8. Evaluate the Design by Expert Analysis Cognitive Walkthrough Heuristic Evaluation Review-based evaluation Model-based evaluation Prepared by Mdm PYTan
  9. 9. Cognitive walkthrough • Proposed by Polson et al. • Origin - The code walkthrough familiar in software engineering • Walkthrough require a detailed review of a sequence of actions • The main focus is to establish how easy a system is to learn or learning through exploration – evaluates design on how well it supports user in learning task – usually performed by expert in cognitive psychology – expert ‘walks though’ design to identify potential problems using psychological principles – forms used to guide analysis Prepared by Mdm PYTan
  10. 10. Cognitive walkthrough • You need FOUR (4) things: 1) A specification or prototype of the system 2) A description of the task the user is to perform on the system 3) A complete, written list of the actions needed to complete the task with the proposed system 4) An indication of who the users are and what kind of experience and knowledge the evaluators can assume about them Prepared by Mdm PYTan
  11. 11. Cognitive walkthrough • Details in step 3: 1) Is the effect of the action the same as the user’s goal at that point? 2) Will users see that the action is available? 3) Once users have found the correct action, will they know it is the one they need? 4) After the action is taken, will user understand the feedback they get? Prepared by Mdm PYTan
  12. 12. Cognitive walkthrough : example Prepared by Mdm PYTan
  13. 13. Cognitive walkthrough : example Prepared by Mdm PYTan
  14. 14. Screen shots Before After Prepared by Mdm PYTan
  15. 15. Heuristic Evaluation • Proposed by Nielsen and Molich. • Is a guideline or general principle or rule thumb that can guide a design decision or be used to critique a decision that has already been made • Can be performed on a design specification so it is useful for evaluating early design • Is a method for structuring the critique of a system using a set of relatively simple and general heuristics Prepared by Mdm PYTan
  16. 16. Heuristic evaluation • It is useful for evaluating early design • It also can be use on prototypes, storyboards and fully functioning systems • It is flexible and cheap approach • Heuristic evaluation `debugs' design. Prepared by Mdm PYTan
  17. 17. Heuristic evaluation • Nielsen’s ten heuristic: 1. Visibility of system status : 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 user’s language, with words, phrases and concepts familiar to the user 3. User control and freedom : users often choose system functions by mistake and need a clearly marked ‘emergency exit’ to leave the unwanted state without having to go through an extended dialog Prepared by Mdm PYTan
  18. 18. Heuristic evaluation Nielsen’s ten heuristic: 4. Consistency and standards : users should not have to wonder whether words, situations or actions mean the same thing in different contexts 5. Error prevention : make it difficult to make errors 6. Recognition rather than recall : the users should not have to remember information from one part of the dialog to another 7. Flexibility and efficiency of the use : allow users to tailor frequent actions Prepared by Mdm PYTan
  19. 19. Heuristic evaluation Nielsen’s ten heuristic: 8. Aesthetic and minimalist design : dialogs should not contain information that is irrelevant or rarely needed 9. Help users recognize, diagnose and recover from errors : error messages should be expressed in plain language 10. Help and documentation : system can be used with no instructions so it may be necessary to provide help and documentation Prepared by Mdm PYTan
  20. 20. Neilson’s Heuristics (Improved) • H2-1: Visibility of system status • H2-2: Match between system & real world • H2-3: User control & freedom • H2-4: Consistency & standards • H2-5: Error prevention • H2-6: Recognition rather than recall • H2-7: Flexibility and efficiency of use • H2-8: Aesthetic and minimalist design • H2-9: Help users recognize, diagnose, and recover from errors • H2-10: Help and documentation Prepared by Mdm PYTan
  21. 21. H2-1: Visibility of system status • keep users informed about what is going on – example: pay attention to response time • 0.1 sec: no special indicators needed, why? • 1.0 sec: user tends to lose track of data • 10 sec: max. duration if user to stay focused on action • for longer delays, use percent-done progress bars searching database for matches Prepared by Mdm PYTan
  22. 22. H2-1: Visibility of system status • keep users informed about what is going on – Appropriate visible feedback What did I select? What mode am I in now? How is the system interpreting my actions? Prepared by Mdm PYTan
  23. 23. H2-2: Match between system & real world • speak the users’ language • follow real world conventions • (bad) example: Mac desktop – Dragging disk to trash • should delete it, not eject it! Prepared by Mdm PYTan
  24. 24. H2-2: Match between system & real world • speak the users’ language • follow real world conventions • e.g. withdrawing money from a bank machine Prepared by Mdm PYTan
  25. 25. H2-3: User control & freedom  “exits” for mistaken choices, undo, redo  don’t force down fixed paths How do I get out of this? Prepared by Mdm PYTan
  26. 26. H2-3: User control & freedom  “exits” for mistaken choices, undo, redo  don’t force down fixed paths  Strategies: – Cancel button (for dialogs waiting for user input) – Universal Undo (can get back to previous state) – Interrupt (especially for lengthy operations) – Quit (for leaving the program at any time) – Defaults (for restoring a property sheet) Prepared by Mdm PYTan
  27. 27. H2-4: Consistency & standards • Consistency of effects – same words, commands, actions will always have the same effect in equivalent situations • predictability • Consistency of language and graphics – same info/controls in same location on all screens/dialog boxes – forms follow boiler plate – same visual appearance across the system (e.g. widgets) • e.g. different scroll bars in a single window system! • Consistency of input – consistent syntax across complete system Prepared by Mdm PYTan
  28. 28. H2-4: Consistency & standards These are labels with a raised appearance. Is it any surprise that people try and click on them? Prepared by Mdm PYTan
  29. 29. H2-5: Error prevention • try to make errors impossible • modern widgets: only “legal commands” selected, or “legal data” entered • Provide reasonableness checks on input data – on entering order for office supplies • 5000 pencils is an unusually large order. Do you really want to order that many? Prepared by Mdm PYTan
  30. 30. H2-6: Recognition rather than recall • Computers good at remembering things, people aren’t! • Promote recognition over recall – menus, icons, choice dialog boxes vs command lines, field formats – relies on visibility of objects to the user (but less is more!) Prepared by Mdm PYTan
  31. 31. H2-7: Flexibility and efficiency of use • Experienced users should be able to perform frequently used operations quickly • Strategies: – keyboard and mouse accelerators • abbreviations • command completion • menu shortcuts • function keys • double clicking vs menu selection – type-ahead (entering input before the system is ready for it) – navigation jumps • e.g., going to window/location directly, and avoiding intermediate nodes – history systems • WWW: ~60% of pages are revisits Prepared by Mdm PYTan
  32. 32. H2-7: Flexibility and efficiency of use Keyboard accelerators for menus Customizable toolbars and palettes for frequent actions Split menu, with recently used fonts on top Scrolling controls for page- sized increments Double-click raises object- specific menu Double-click raises toolbar dialog box Prepared by Mdm PYTan
  33. 33. H2-8: Aesthetic and minimalist design • No irrelevant information in dialogues • Bad example: Prepared by Mdm PYTan
  34. 34. H2-9: Help users recognize, diagnose, and recover from errors • error messages in plain language • precisely indicate the problem • constructively suggest a solution Prepared by Mdm PYTan
  35. 35. H2-10: Help and documentation • Help is not a replacement for bad design! • Simple systems: – walk up and use; minimal instructions • Most other systems: – feature rich – some users will want to become “experts” rather than “casual” users – intermediate users need reminding, plus a learning path • Many users do not read manuals – prefer to spend their time pursuing their task • Usually used when users are in some kind of panic, need immediate help – indicates need for online documentation, good search/lookup tools – online help can be specific to current context – paper manuals unavailable in many businesses! • e.g. single copy locked away in system administrator’s office • Sometimes used for quick reference – syntax of actions, possibilities... – list of shortcuts ... Prepared by Mdm PYTan
  36. 36. Types of help (cont.) • Reminders – short reference cards • expert user who just wants to check facts • novice who wants to get overview of system’s capabilities – keyboard templates • shortcuts/syntactic meanings of keys; recognition vs. recall; capabilities – tooltips • text over graphical items indicates their meaning or purpose Prepared by Mdm PYTan
  37. 37. 3 stages for doing heuristic evaluation • Briefing session to tell experts what to do. • Evaluation period of 1-2 hours in which: – Each expert works separately; – Take one pass to get a feel for the product; – Take a second pass to focus on specific features. • Debriefing session in which experts work together to prioritize problems. Prepared by Mdm PYTan
  38. 38. Before After Prepared by Mdm PYTan
  39. 39. Review-based evaluation • Results from the literature used to support or refute parts of design. • Care needed to ensure results are transferable to new design. Prepared by Mdm PYTan
  40. 40. Model-based evaluation • Certain cognitive and design models provide a means of combining design specification and evaluating into the same framework • The GOMS (goals, operators, methods and selection) model predicts user performance with a particular interface and can be used to filter particular design options Prepared by Mdm PYTan
  41. 41. Model-based evaluation • GOMS: – Goals : specify what the user wants and intends to achieve. – Operators : are the building blocks for describing human-computer interaction at the concrete level. – Methods : are programs built with operators that are designed to accomplish goals. – Selection : rules predict which method will be used. For example, “If the mouse is working, select point to an item on screen, if not, select choose OPEN option in file menu”. Prepared by Mdm PYTan
  42. 42. Using GOMS Repeat until Satisfied Choose Top Level Goals Start Draft Operators and Methods for Each Goal Select Methods Check for Goal Attainment Further Refinement Needed? Stop No Yes Figure 3.1 A flow chart for building GOMS Prepared by Mdm PYTan
  43. 43. Model-based evaluation • Design methodologies, such as design rationale also have role to play in evaluation at the design stage • Dialog models can also be used to evaluate dialog sequences for problems • Eg. Unreachable states, circular dialogs and complexity. Prepared by Mdm PYTan
  44. 44. Group Activity (3 persons) • Choose ONE application or system or website or product. • Use them. • Discuss your evaluation through expert analysis based on Cognitive Walkthrough criteria. • Identify any problem with the system / application / website / product based on the task that you had specified. (if any) • Suggest how to solve the problem(s). Prepared by Mdm PYTan
  45. 45. Group Activity Discuss the Advantages and Disadvantages of Each type of Evaluating Designs below: Prepared by Mdm PYTan Cognitive Walkthrough Heuristic Evaluation Review-based evaluation Model-based evaluation
  46. 46. THANK YOU Prepared by Mdm PYTan
  47. 47. Cognitive walkthrough Positives : • Real insights gained into potential issues with new users; • Extremely practical and easy to implement; • Encourages team members to view with a fresh eyes; • Throws up surprises. Negatives • Can be subject to personal ‘quirks’; • Not always easy to draw generalisable conclusions; • Danger of over-reaction. Prepared by Mdm PYTan
  48. 48. Heuristic evaluation Positives: • Navigation and design flaws highlighted; • External input is more objective; • Severity rating allows easy setting of priorities. • Provides reassurance about things that are going well Negatives: • Need to strike a balance between carrying out formal evaluation early enough to inform the design process, and maximising cost- effectiveness; • Some of the points made referred to ‘known issues’; Prepared by Mdm PYTan
  49. 49. Advantages and problems heuristic evaluation • Few ethical & practical issues to consider because users not involved. • Can be difficult & expensive to find experts. • Best experts have knowledge of application domain & users. • Biggest problems: – Important problems may get missed; – Many trivial problems are often identified; – Experts have biases. Prepared by Mdm PYTan
  50. 50. Model-Based Evaluation Advantages • a particular interaction can be calculated with little effort, at little cost, and in a short amount of time • each specific task has been previously measured experimentally to a high degree of accuracy Disadvantages • generally less rigid with basic cognitive actions • none of the GOMS models allow for any type of error Prepared by Mdm PYTan
  51. 51. Review-Based Evaluation Advantages • Expert review of relevant literature can avoid to repeat experiments continually Disadvantages • Expensive to repeat experiments continually Prepared by Mdm PYTan