1 / 75

Human Computer Interaction

Human Computer Interaction. The Interaction – Chapter 3. Contents. Introduction Models of Interaction Ergonomics Interaction Styles Interactivity Experience, Engagement & Fun. 10/12/2014. 2. The Interaction. Introduction. What is Interaction. Communication

sawyer
Télécharger la présentation

Human Computer Interaction

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. Human Computer Interaction The Interaction – Chapter 3

  2. Contents • Introduction • Models of Interaction • Ergonomics • Interaction Styles • Interactivity • Experience, Engagement & Fun 10/12/2014 2 The Interaction

  3. Introduction • What is Interaction • Communication • Machine is capable of doing the job • Humans need to get the job done from the system User System User must communicate his requirements to the system 10/12/2014 3 The Interaction

  4. Contents • Introduction • Models of Interaction • Ergonomics • Interaction Styles • Interactivity • Experience, Engagement & Fun 10/12/2014 4 The Interaction

  5. Models of Interaction • Communication: Complex Human – Complex Systems • Models of Interaction • Help Understand what is going on in the Interaction • Identify the likely root of difficulties • Two Models • Norman’s Model (The execution-evaluation cycle) • Abowd and Beale framework 10/12/2014 5 The Interaction

  6. Some Terms of Interaction • Domain • The area of work under study • Graphic design Graphic shapes, drawing surface, drawing utensils • Tasks • Operations to manipulate the concepts of a domain • e.g. construction of graphic shape with certain attributes • Goal • What you want to achieve • e.g. create a solid red triangle Domain Concepts of Domain 10/12/2014 6 The Interaction

  7. Some Terms of Interaction • Task • How you go about doing it – Ultimately in terms of operations or actions • e.g. … select fill tool, click over triangle • Task Analysis • Identification of problem space for user of an interactive system in terms of the domain, goals, intentions and task 10/12/2014 7 The Interaction

  8. Some Terms of Interaction • Task Language • User’s language: Describes attributes of domain relevant to the User state • Core Language • System’s Language: Describes attributes of domain relevant to the System state 10/12/2014 8 The Interaction

  9. Norman’s Model of Interaction • Based on Execution – Evaluation Cycle • Two major stages: Execution & Evaluation • Execution • Establishing the goal • Forming the intention • Specifying the action sequence • Executing the action • Evaluation • Perceiving the system state • Interpreting the system state • Evaluating the system state with respect to the goals and intentions 10/12/2014 9 The Interaction

  10. Execution – Evaluation Cycle goal execution evaluation system • Example – Switching on the Light • Evening falls while reading 10/12/2014 10 The Interaction

  11. Execution – Evaluation Cycle goal execution evaluation system • Establishing the goal • Forming the intention • Specifying the action sequence • Executing the action • Perceiving the system state • Interpreting the system state • Evaluating the system state • You decide you need more light. Goal : Get more light • Intention: Switch on the lamp • Specify the Action Sequence to reach over an press the lamp switch • Action executed – Perceive the results: Light is on or not • Interpret – e.g. No light: Bulb has blown, Lamp not plugged in -> New Intentions • Light comes out – Evaluate the new state according to your goal • If the light is enough – Cycle Completes • If NOT, formulate a new intention of switching on he ceiling light for example 10/12/2014 11 The Interaction

  12. Using Norman’s Model • Some Systems are harder to use than others • Gulf of Execution – Difference b/w • User’s formulation of actions • Actions allowed by the system • AIM: Reduce this gulf • Gulf of Evaluation – Difference b/w • Presentation of the system state • User Expectation • More effort required to interpret presentation: Less effective Interaction 10/12/2014 12 The Interaction

  13. Human Error – Slips & Mistakes • Slip • Understand system and goal • Correct formulation of action • Incorrect action • Mistake • May not even have right goal! • Example • Slip: Mistype, accidental mouse press • Mistake: Magnifying glass icon – Find/Zoom 10/12/2014 13 The Interaction

  14. Human Error – Slips & Mistakes • Fixing Errors • Slips • Better interface design • E.g. Putting more space b/w buttons • Mistakes • Better understanding of the system • Improved training, radical redesigning 10/12/2014 14 The Interaction

  15. Abowd & Beale Framework O output S core U task I input • Interaction framework – Four parts • User • Input • System • Output • Each part has its own unique language • Interaction = Translation b/w languages • Input + Output = Interface • Interface sits b/w User and System 10/12/2014 15 The Interaction

  16. Abowd & Beale Framework • Interactive Cycle • User begins with formulation of a Goal/Task • Task articulated within the input language • Input language is translated to core language as operations to be performed • System transforms itself Articulation Performance System is in a new State 10/12/2014 16 The Interaction

  17. Abowd & Beale Framework • Interactive Cycle (Contd…) • System attribute values rendered to Output • User observes the output and asses the result of interaction w.r.t the Goal Presentation Observation Articulation Performance Problems in interaction = Problems in translation 10/12/2014 17 The Interaction

  18. Abowd & Beale Framework • Example: Video Recording using a remote control • Ineffective Interaction: User not sure VCR is set to record properly • Articulation: User pressed the keys on the remote in the wrong order • Performance: VCR may record any channel but remote control lacks the channel selection • Presentation: VCR display does not indicate the setting of program • Observation: User does not interpret the feedback properly 10/12/2014 18 The Interaction

  19. Contents • Introduction • Models of Interaction • Ergonomics • Interaction Styles • Interactivity • Experience, Engagement & Fun 10/12/2014 19 The Interaction

  20. Ergonomics Physical Aspects of Interaction 10/12/2014 20 The Interaction

  21. Ergonomics • Ergonomics is the science of designing the job, equipment, and workplace to fit the worker • Ergonomics involves arranging the environment to ‘fit’ the person in it • Ergonomic Design/Products • Easy to use and comfortable • Reduce fatigue, strain • Enhance productivity 10/12/2014 21 The Interaction

  22. Ergonomics Examples • Arrangement of Controls & Displays • Grouped according to: Function, Sequence, Frequency • Surrounding Environment • Design of work Environment • Where will the system be used? • Who will use it? • For how long will it be used? • Seated users: Comfort, Back support etc. 10/12/2014 22 The Interaction

  23. Ergonomics Examples • Health Issues • Lighting, Noise, Temperature, Time Spent etc. Lighting Ergonomics 10/12/2014 23 The Interaction

  24. Ergonomics Examples • Use of Colour • An indicator – Not the only Cue • Color use – Coherent with common conventions • Red for Warning etc. 10/12/2014 24 The Interaction

  25. Contents • Introduction • Models of Interaction • Ergonomics • Interaction Styles • Interactivity • Experience, Engagement & Fun 10/12/2014 25 The Interaction

  26. Interaction Styles 10/12/2014 26 The Interaction

  27. Common Interaction Styles • Command line interface • Menus • Natural language • Question/answer and query dialogue • Form-fills and spreadsheets • WIMP • Point and click • Three–dimensional interfaces 10/12/2014 27 The Interaction

  28. Command Line Interface • Way of expressing instructions to the computer directly • Function keys, single characters, short abbreviations, whole words, or a combination • Powerful – Offers direct access to system functionality • Better for expert users than novices • Command names/abbreviations should be meaningful! 10/12/2014 28 The Interaction

  29. Menus • Set of options displayed on the screen • Options visible • Rely on recognition rather than recall • Easier to use • Names should be meaningful • Selection by: • numbers, letters, alphabets, arrow keys, mouse • Menus • Purely Text • May have a Graphical Component • Restricted form of full WIMP system 10/12/2014 29 The Interaction

  30. Menus 10/12/2014 30 The Interaction

  31. Natural Language • Familiar to user • Speech recognition or typed natural language • Problems • Ambiguity at Phrase Level • The boy hit the dog with the stick • Ambiguity of Individual words • Synonyms, Pronouns • General natural language interface – Unlikely • Restricted domain – Known Vocabulary 10/12/2014 31 The Interaction

  32. Query Interfaces • Question/answer interfaces • User led through interaction via series of questions • Query languages (e.g. SQL) • Used to retrieve information from database • Natural-language-style queries • SELECT Name FROMStudentsWHERE GPA > 3.0 • Requires understanding of database structure and language syntax, hence requires some expertise 10/12/2014 32 The Interaction

  33. Form-Fills • Primarily for data entry or data retrieval • Screen like paper form • Easy to Use • Generally allow • Blank Fields • Correction Facilities 10/12/2014 33 The Interaction

  34. Spread Sheets • Sophisticated variation of form-filling • Grid of cells contain a value or a formula • Formula can involve values of other cells • E.g. sum of all cells in this column • User can enter and alter data - spreadsheet maintains consistency • MS Excel – Most common spread sheet today 10/12/2014 34 The Interaction

  35. WIMP Interface • Windows, Icons, Menu, Pointers • Or Windows, Icons, Mice, and Pull-down menus • Default style for majority of interactive computer systems, especially PCs and desktop machines • Windows, MAC 10/12/2014 35 The Interaction

  36. Point and Click Interfaces • Commonly Used in .. • Multimedia • Web browsers • Hypertext • Just click something! • Icons, text links or location on map • Minimal typing • Web is a typical point and click interface • Closely related to WIMP 10/12/2014 36 The Interaction

  37. Three Dimensional Interfaces • Virtual Reality Interfaces • Ordinary WIMP elements: 3D Appearance • Shading • Sculptured flat buttons … click me! … or sculptured 10/12/2014 37 The Interaction

  38. Elements of the WIMP Interface • Windows, icons, menus, pointers • Buttons, toolbars, palettes, dialog boxes 10/12/2014 38 The Interaction

  39. Windows • Areas of the screen that behave as if they were independent • Can contain text or graphics • Can be moved or resized • Can overlap and obscure each other, or can be laid out next to one another (tiled) • Scrollbars • Allow the user to move the contents of the window up and down or from side to side • Title bars • Describe the name of the window 10/12/2014 39 The Interaction

  40. Windows Menu Bar Title Bar Scroll Bar 10/12/2014 40 The Interaction

  41. Icons • Small picture or image • Represents some object in the interface • Often a window or action • Icons can take many forms • Highly stylized • Realistic representations 10/12/2014 41 The Interaction

  42. Pointers • Important component • WIMP style relies on pointing and selecting things • Uses mouse, trackpad, joystick, trackball, cursor keys or keyboard shortcuts • Wide variety of Pointer Cursors • Cursor Hot-spot • The location to which it points 10/12/2014 42 The Interaction

  43. Pointers 10/12/2014 43 The Interaction

  44. Menus • Choice of operations or services offered on the screen • Required option selected with pointer 10/12/2014 44 The Interaction

  45. Menus • Menu Bar at top of screen (normally), menu drags down • Pull-down menu -Drags down on mouse click • Fall-down menus - Mouse just moves over bar 10/12/2014 45 The Interaction

  46. Menus • Pin-up menus – ‘Pinned’ to the screen, hides when asked • Pop-up menus • Contextual menu • Hidden – Pops up on request 10/12/2014 46 The Interaction

  47. Menus • Pie menus • Arranged in a circle • Easier to select item (larger target area) • Quicker (same distance to any option) • Take up more screen space – Not widely used! 10/12/2014 47 The Interaction

  48. Menus • Cascading menus • Hierarchical menu structure • Menu selection opens new menu 10/12/2014 48 The Interaction

  49. Menus • Keyboard accelerators • Key combinations - same effect as menu item • Two types • Active when menu open – usually first letter • Active when menu closed – usually Ctrl + letter 10/12/2014 49 The Interaction

  50. Menu Design Issues • Which kind of menu to use? • What to include in menus at all? • How to group items? • Order • Frequency and importance • Opposite functionalities • Choice of keyboard accelerators 10/12/2014 50 The Interaction

More Related