Chapter 2


Published on

Published in: Technology
1 Like
  • Be the first to comment

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

No notes for slide

Chapter 2

  1. 1. Chapter-2HCI Prof. Manisha Maddel(SIOM) Prof.Manisha Maddel(SIOM) 1
  2. 2. Topics in syllabus:  Usability paradigms  object action interface  principles and rules  guidelines for data entry and displayHCI Prof.Manisha Maddel(SIOM) 2
  3. 3. Usability Usability is a quality attribute that assesses how easy user interfaces are to use. Usability is defined by five quality components:  Learnability: How easy is it for users to accomplish basic tasks the first time they encounter the design?  Efficiency: Once users have learned the design, how quickly can they perform tasks?  Memorability: When users return to the design after a period of not using it, how easily can they reestablish proficiency?  Errors: How many errors do users make, how severe are these errors, and how easily can they recover from the errors?  Satisfaction: How pleasant is it to use the design?HCI Prof.Manisha Maddel(SIOM) 3
  4. 4. why study paradigms Concerns  how can an interactive system be developed to ensure its usability?  how can the usability of an interactive system be demonstrated or measured? History of interactive system design provides paradigms for usable designsHCI Prof.Manisha Maddel(SIOM) 4
  5. 5. What are Paradigms  Predominant theoretical frameworks or scientific world views  e.g., Aristotelian, Newtonian, Einsteinian paradigms in physics  Understanding HCI history is largely about understanding a series of paradigm shiftsHCI Prof.Manisha Maddel(SIOM) 5
  6. 6. Paradigm Shifts  Time-sharing - single computer supporting multiple users.  Video Display Units-computers for visualizing and manipulating data.  Programming toolkits-the right programming toolkit provides building blocks to producing complex interactive systems  Personal computing- computing in small, powerful machines dedicated to the individual.  Window systems and the WIMP interface -windows, icons, menus and pointers now familiar interaction mechanisms. Humans can pursue more than one task at a time. Windows used for dialogue partitioning, to “change the topic.  Metaphor - relating computing to other real-world activity is effective teaching technique.HCI Prof.Manisha Maddel(SIOM) 6
  7. 7. Paradigm Shifts  Direct manipulation - Shneiderman describes appeal of graphically-based interaction  visibility of objects  incremental action and rapid feedback  reversibility encourages exploration  syntactic correctness of all actions  replace language with action  What You See Is What You Get (WYSIWYG)  Language versus Action-  DM – interface replaces underlying system  language paradigm  interface as mediator  interface acts as intelligent agent  programming by example is both action and languageHCI Prof.Manisha Maddel(SIOM) 7
  8. 8. Paradigm Shifts(Cont.)  Hypertext-  key to success in managing explosion of information  mid 1960s – Nelson describes hypertext as non-linear  browsing structure  hypermedia and multimedia  Multimodality-  a mode is a human communication channel  emphasis on simultaneous use of multiple channels for input and outputHCI Prof.Manisha Maddel(SIOM) 8
  9. 9. Paradigm Shifts(Cont.)  Computer Supported Cooperative Work (CSCW) –  CSCW removes bias of single user / single computer system  Can no longer neglect the social aspects  Electronic mail is most prominent success  The World Wide Web –  Simple, universal protocols (e.g. HTTP) and mark-up languages (e.g. HTML) made publishing and accessing easy  Critical mass of users lead to a complete transformation of our information economy.HCI Prof.Manisha Maddel(SIOM) 9
  10. 10. Paradigm Shifts(Cont.)  Agent-based Interfaces -  Original interfaces  Commands given to computer  Language-based  Direct Manipulation/WIMP  Commands performed on “world” representation  Action based  Agents - return to language by instilling proactivity and “intelligence” in command processor  Avatars, natural language processing  Ubiquitous Computing -HCI Prof.Manisha Maddel(SIOM) 10
  11. 11. Paradigm Shifts(Cont.)  Sensor-based and Context-aware Interaction -  Humans are good at recognizing the “context” of a situation and reacting appropriately  Automatically sensing physical phenomena (e.g., light, temp, location, identity) becoming easier  How can we go from sensed physical measures to interactions that behave as if made “aware” of the surroundings?HCI Prof.Manisha Maddel(SIOM) 11
  12. 12. Interaction Model  Syntactic-semantic model was used to describe programming and was applied to database-manipulation facilities as well as direct manipulation .  Distinction was made between meaningfully-acquired semantic concepts and rote-memorized syntactic details  Semantic concepts of users tasks were well-organized and stable in memory .  Syntactic details of command languages were arbitrary and required frequent rehearsal  With introduction of GUIs, emphasis shifted to simple direct manipulations applied to visual representations of objects and actions. Syntactic aspects not eliminated, but minimized.HCI Prof.Manisha Maddel(SIOM) 12
  13. 13. Interaction Model(cont.)  There exists two basic interaction models for any given system: Object-Action Interface Model -The user first selects an object and then selects the action to be performed on the selected object . Action Object Interface Model - The user first selects an action to be performed and then selects the objects on which this action will be performed.HCI Prof.Manisha Maddel(SIOM) 13
  14. 14. Object-Action Interface Model  Object-Action Interface Model  Task hierarchies of objects and actions  Interface hierarchies of objects and actions  Disappearance of syntax.HCI Prof.Manisha Maddel(SIOM) 14
  15. 15. Object-Action Interface Model  The emphasis is on visual display of user task objects and actions .  The OAI model is an explanatory model that focuses on task objects and actions and on interface objects and actions  Object action design starts with understanding of the task. That task includes the universe of real world objects with which user’s works to accomplish their intentions and the actions that they apply to those objects.  After the agreement on the task objects and actions and their decomposition, the designer can create the metaphoric representations of the interface objects and actions.HCI Prof.Manisha Maddel(SIOM) 15
  16. 16. Object-action design 1. understand the task.  real-world objects  actions applied to those object 2. create metaphoric representations of interface objects and actions 3. designer makes interface actions visible to usersHCI Prof.Manisha Maddel(SIOM) 16
  17. 17. Object-Action Interface Model (cont) Object-Action model maps to real life environment The figure above shows the designer mapping from the real world universe of objects and intentions to the interface world universe of metaphors and plans.HCI Prof.Manisha Maddel(SIOM) 17
  18. 18. Task hierarchies of objects and actions  Tasks include hierarchies of objects and actions at different high and low levels.  Decomposition of real-world complex systems natural  human body  buildings  cities  Computer system designers must generate a hierarchy of objects and actions to model users tasks.  The following steps are recommended (Shneiderman) in order to build correct tasks hierarchies by designers for a system: 1. Know about the users and their tasks (Interviewing users, reading workbooks and taking training sessions) 2. Generate hierarchies of tasks and objects to model the users tasks 3. Design interface objects and actions that metaphorically map to the real world universeHCI Prof.Manisha Maddel(SIOM) 18
  19. 19. Interface hierarchies of objects and actions:  Similar to the task domain, the interface domain contains hierarchies of objects and tasks at different levels.  Interface Objects: Users interacting with a computer get to understand some high level concepts relevant to that system. As an example, they learn that computer stores information, that these information are stored in files contained within a hierarchy of directories, and that each file has its own attributes like name, size, date, etc ...HCI Prof.Manisha Maddel(SIOM) 19
  20. 20. Interface hierarchies of objects andactions(cont.)  Interface Actions: These are also hierarchies of lower levels actions.  Example - A high level plan is to create a text file might involve mid-level actions such as creating a file, inserting text and saving that file. The mid-level action of saving a file the file can be decomposed into lower level actions such as storing the file with a backup copy and may be applying the access control rights. Further lower level actions might involve choosing the name of the file, the location folder to be saved in, dealing with errors such as space shortage, and so onHCI Prof.Manisha Maddel(SIOM) 20
  21. 21. Interface hierarchies of objects andactions(cont.)  For the user: There are several ways users learn interface objects and actions such as demonstrations, sessions, or trial and error sessions. When these objects and actions have logical structure that can be related to other familiar task objects and actions, this knowledge becomes stable in the users memory.  For the designer: The OAI model helps a designer to understand the complex processes that a user has to perform in order to successfully use an interface to perform a certain task. Designers model the interface actions and objects based on familiar example and then fine tune these models to fit the task and the user.HCI Prof.Manisha Maddel(SIOM) 21
  22. 22. Limitations and challenges: 1. Its hard to apply a series of actions, that is already performed on an object, to another set of objects (what command line users call "batching") . 2. Its also hard in the object-action model to perform pipelining 3. One last challenge appears when users start to become proficient using a certain system, and their performance curve start to raise.HCI Prof.Manisha Maddel(SIOM) 22
  23. 23. The disappearance of syntax  In early days Users must maintain a profusion of device-dependent details in their human memory.  Which action erases a character  Which action inserts a new line after the third line of a text file  Which abbreviations are permissible  Which of the numbered function keys produces the previous screen.  Learning, use, and retention of this knowledge is hampered by two problems 1. Details vary across systems in an unpredictable manner . 2. acquiring syntactic knowledge is often a struggle.  Syntactic knowledge is usually conveyed by example and repeated usage .  Minimizing these burdens is the goal of most interface designers  Modern direct-manipulation systems  Familiar objects and actions representing their task objects and actions.  Modern user interface building tools  Standard widgetsHCI Prof.Manisha Maddel(SIOM) 23
  24. 24. Interface hierarchies of objects and actions E.g. A computer system:  Interface Objects  directory  name  length  date of creation  owner  access control  files of information  lines  fields  characters  fonts  pointers  binary numbers  Interface Actions  load a text data file  insert into the data file  save the data file  save the file  save a backup of the file  apply access-control rights  overwrite previous versionHCI  assign a name Prof.Manisha Maddel(SIOM) 24
  25. 25. Theories ,principles and GuidelinesGuidance for designers of interactive systems can be given in the form of 1. Theories &Models 2. Middle level principles 3. Specific and practical guidelinesHCI Prof.Manisha Maddel(SIOM) 25
  26. 26. Theories ,principles and Guidelines The theories and models offer framework or language to discuss issue that are application independent. Middle level principles are useful in creating and comparing design alternatives . The practical guidelines provide helpful reminders of rules uncovered by designers. Prof.Manisha Maddel(SIOM) 26
  27. 27. High level Theories1. Explanatory theories Predictive theories Perceptual or Cognitive subtasks theories Motor-task performance times theories Prof.Manisha Maddel(SIOM) 27
  28. 28. Explanatory Theories Explanatory theories seek to explain the behavior of our world, they tend to provide a more conceptual model of the world. Explanatory theories are help full in  Observing behavior  Describing activity  Conceiving of designs  Comparing high-level concepts of two designs  Training Taxonomy is a part of Explanatory theory.  Order on a complex set of phenomena  Facilitate useful comparisons  Organize a topic for newcomers  Guide designers  Indicate opportunities for novel products. Prof.Manisha Maddel(SIOM) 28
  29. 29. Other Theories Predictive theories:  Enable designer s to compar e proposed designs for execution time or er ror r ates. Per ceptual or Cognitive subtasks theories  Pr edicting r eading times for fr ee text, lists, or for matted displays Motor-task perfor mance times theories:  Pr edicting key str oking or pointing times Prof.Manisha Maddel(SIOM) 29
  30. 30. Conceptual, semantic, syntactic, and lexical model  Foley and van Dam four-level approach  Conceptual level: Users mental model of the interactive system  Semantic level: Describes the meanings conveyed by the users command input and by the computers output display  Syntactic level: Defines how the units (words) that convey semantics are assembled into a complete sentence that instructs the computer to perform a certain task  Lexical level: Deals with device dependencies and with the precise mechanisms by which a user specifies the syntax  Approach is convenient for designers  Top-down nature is easy to explain  Matches the software architecture  Allows for useful modularity during designHCI Prof.Manisha Maddel(SIOM) 30
  31. 31. GOMS and the keystroke-level model By Card Moran  Goals, Operators, Methods, and Selection rules (GOMS) model Example – 4. Formulate Goal- edit document  Formulate sub goal – insert word a The operators are – perceptual or cognitive acts. c Use methods and procedures-(move cursor to desired location by a sequence of arrow keys). f Selection rules- choosing among several methods available for accomplishing the goal( delete by repeated backspace versus delete by placing markers at the beginning and end of region and pressing delete button).  Keystroke-level model: Predict performance times for error-free expert performance of tasks by summing up the time for key stroking ,pointing ,homing, drawing, thinking and waiting for the system to respond. This model concentrate on expert users and error free performance and places less emphasis on learning ,problem solving ,error handling ,subjective satisfaction and retention.HCI Prof.Manisha Maddel(SIOM) 31
  32. 32. GOMS and the keystroke-level model (cont.)ExampleSeveral alternative methods to delete fields, e.g. Method 1 To accomplish the goal of deleting the field: e Decide: If necessary, then accomplish the goal of selecting the field g Accomplish the goal of using a specific field delete method h Report goal accomplished Prof.Manisha Maddel(SIOM) 32
  33. 33. GOMS and the keystroke-level model(cont.) Method 2 To accomplish the goal of deleting the field: 3. Decide: If necessary, then use the Browse tool to go to the card with the field 4. Choose the field tool in the Tools menu 5. Note that the fields on the card background are displayed 6. Click on the field to be selected 7. Report goal accomplished Prof.Manisha Maddel(SIOM) 33
  34. 34. GOMS and the keystroke-levelmodel (cont.)Selection rule set for goal of using a specific field- delete method:  If you want to past the field somewhere else, then choose "Cut Field" from the Edit menu.  If you want to delete the field permanently, then choose "Clear Field" from the Edit menu.  Report goal accomplished. Prof.Manisha Maddel(SIOM) 34
  35. 35. Stages of action models Normans seven stages of action t Forming the goal "make a nice meal". l Forming the intention "Make a chicken casserole using a can of prepared sauce." c Specifying the action "Defrost frozen chicken, open can, ..." c Executing the action actually opening the can. Perceiving the system state the experience of smell, taste and look of the prepared meal. f Interpreting the system state Putting those perceptions together to present the sensory experience of a chicken casserole c Evaluating the outcome did the chicken casserole match up to the requirement of a nice meal?HCI Prof.Manisha Maddel(SIOM) 35
  36. 36. Norman’s 7-stage cycle of HCI Prof.Manisha Maddel(SIOM) 36
  37. 37. Norman’s 7-stage cycle of HCI(cont.)  Gulf of execution: Mismatch between the users intentions and the allowable actions  Gulf of evaluation: Mismatch between the systems representation and the users expectations The designer must bridge the gulf of execution  Design the system to ease the process of getting from the intention to the execution The designer must bridge the gulf of evaluation  Design the system so that the response after the user has performed an action can be easily interpreted and then evaluated Prof.Manisha Maddel(SIOM) 37
  38. 38. Normans contributions Four principles of good design  State and the action alternatives should be visible  Should be a good conceptual model with a consistent system image  Interface should include good mappings that reveal the relationships between stages  User should receive continuous feedback Prof.Manisha Maddel(SIOM) 38
  39. 39. Four critical points where user failures can occur(Norman’s 7-stage cycle of HCI(cont.) )  Users can form an inadequate goal  Might not find the correct interface object because of an incomprehensible label or icon  May not know how to specify or execute a desired action  May receive inappropriate or misleading feedback Prof.Manisha Maddel(SIOM) 39
  40. 40. Consistency through grammars  An important goal for designers is a consistent user interface.  Inconsistent action verbs  Take longer to learn  Cause more errors  Slow down users  Harder for users to rememberHCI Prof.Manisha Maddel(SIOM) 40
  41. 41. Consistency through grammars(cont.)  Payne and Green addressed the multiple levels of consistency (lexical , syntactic and semantic) through a notational structure called task-action grammars(TAGS)  Task-action grammars (TAGs) try to characterize a complete set of tasks.HCI Prof.Manisha Maddel(SIOM) 41
  42. 42. Consistency through grammars (cont.)Example: TAG definition of cursor control Dictionary of tasks:  move-cursor-one-character-forward[ Direction=forward, Unit=char]  move-cursor-one-character-backward [Direction=backward, Unit=char]  move-cursor-one-word-forward [Direction=forward ,Unit=word]  move-cursor-one-word-backward[ Direction=backward ,Unit=word] High-level rule schemas describing command syntax:  task [Direction, Unit ]-> symbol [Direction] + letter [Unit]  symbol [Direction=forward] -> "CTRL"  symbol [Direction=backward] -> "ESC"  letter [Unit=word] -> "W"  letter [Unit=char] -> "C" Generates a consistent grammar:  move cursor one character forward CTRL-C  move cursor one character backward ESC-C  move cursor one word forward CTRL-W  move cursor one word backward ESC-W Prof.Manisha Maddel(SIOM) 42
  43. 43. Widget-level theories  Potential benefits:  Possible automatic generation of performance prediction  A measure of layout appropriateness available as development guide  Estimates generated automatically over many designers and projects  perceptual complexity  cognitive complexity Higher-level patterns of usage appearHCI Prof.Manisha Maddel(SIOM) 43
  44. 44. Principles of Good Design Principle 1: Recognize the Diversity Principle 2: Use Golden Rules of HCI Design Principle 3: Prevent Errors Principle 4: Follow the Guidelines for Data Display Principle 5: Follow the Guidelines for Data Entry Principle 6: Balance the Automated and Human Control Prof.Manisha Maddel(SIOM) 44
  45. 45. Prof.Manisha Maddel(SIOM) 45
  46. 46. Prof.Manisha Maddel(SIOM) 46
  47. 47. Principle 1: Recognize the Diversity Usage profiles  Novice or first-time users •Task profiles  Knowledgeable intermittent users •Decomposition into multiple middle-  Expert frequent users level task actions, which are refined into atomic actions User characteristics •task frequencies of use  Age •matrix of users and tasks helpful  Gender  Physical abilities Interaction styles  Education •Direct manipulation  Cultural or ethnic background •Menu selection  Training •Form fillin  Motivation •Command language  Goals •Natural language  PersonalityHCI Prof.Manisha Maddel(SIOM) 47
  48. 48. Principle 2: Use the Eight Golden Rules of Interface Design1. Strive for consistency. Offer informative feedback  Terminology  Prompts e Design dialogs to yield closure  Menus 1. Sequences of actions should be  Help screens organized into groups  Color 2. Beginning, middle, and an end  Layout e Offer error prevention and simple error handling  Capitalization  Fonts e Permit easy reversal of actions  Most frequently violated2. Enable frequent users to use shortcuts r Support internal locus of control 1. Abbreviations 2. Special keys Reduce short-term memory load. 3. Hidden commands 4. Macro facilities HCI Prof.Manisha Maddel(SIOM) 48
  49. 49. Principle - 3 Prevent Errors To reduce errors by ensuring complete and correct actions:  Correct matching pairs  Complete sequences  Correct commands.HCI Prof.Manisha Maddel(SIOM) 49
  50. 50. Guidelines for Data Display  Organizing the display 1. Consistency of data display 2. Efficient information assimilation by the user 3. Minimal memory load on user 4. Compatibility of data display with data entry 5. Flexibility for user control of data displayHCI Prof.Manisha Maddel(SIOM) 50
  51. 51. Guidelines for Data Display(Cont.)  Getting the users attention  Intensity  Marking  Size  Choice of fonts  Inverse video  Blinking  Color  Color blinking  AudioHCI Prof.Manisha Maddel(SIOM) 51
  52. 52. Guidelines for Data Entry Five high-level objectives for data entry:  Consistency of data-entry transactions  Minimal input actions by user  Minimal memory load on user  Compatibility of data entry with data display  flexibility for user control of data entryHCI Prof.Manisha Maddel(SIOM) 52