1 / 35

SBD: Interaction Design

This article explores interaction design principles, methodologies, and techniques for analyzing, designing, and evaluating information technology systems. It covers topics such as stakeholder analysis, field studies, activity and interaction scenarios, prototyping and evaluation, and usability specifications.

amcduffie
Download Presentation

SBD: Interaction Design

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. SBD:Interaction Design Chris North cs3724: HCI

  2. ANALYZE analysis of stakeholders, field studies claims about current practice Problem scenarios DESIGN Activity scenarios metaphors, information technology, HCI theory, guidelines iterative analysis of usability claims and re-design Information scenarios Interaction scenarios PROTOTYPE & EVALUATE summative evaluation formative evaluation Usability specifications

  3. Interaction Design • Specify the action sequences for planning and achieving one or more task goals • System goals • Action plans • Execution • Output: Storyboards Activity design scenarios: transform current activities to use new design ideas Information design scenarios: Elaborate to include visual presentation details Interaction design scenarios: Elaborate to include physical actions and system responses

  4. Storyboard

  5. Interpretation Perception Making sense GULF OF EVALUATION Last month’s budget... ? GULF OF EXECUTION Execution System goal Action plan Stages of Action in HCI focus of information design Human-computer “communication” Task goal focus of interaction design

  6. Example • Task goal: Give great idea to Pres. Steger

  7. 3 Interaction Styles • Direct manipulation • Command language • Menus & Forms

  8. Example: File Management % rm myfile.txt % _

  9. Direct Manipulation • Examples: • Drag-n-drop file icons • visualization • Keyboard • Games • Powerpoint slide sorter, word • Media player, files

  10. Video Games

  11. Direct Manipulation Principles • Visual representation • Rapid, incremental, reversible actions • Pointing and directly selecting • Immediate feedback “Just do it”

  12. Direct Manipulation • Good: • see what your doing, wysiwig • Back, undo • Learning time good, natural, metaphors • Bad: • wildcards, macros • Slow for Experts • Limited options • Difficult implementation?

  13. Command Language • Examples: • Unix, DOS • matlab • autoCAD • Emacs, word shortcuts, vi • programming

  14. Command Language • Good: • fast for experts • Fast performance, no graphics • Customizable, macros • Piping, scripts, • Bad: • complexity, arguments • Huge learning brick wall • Requires fast typing • Indirect referring to stuff, hard to select • Requires knowing the names

  15. Speech Input and Output • Speech I/O inherently linear, relatively slow • trades off with familiarity, naturalness • restricted vocabulary, commands • Speech recognition accuracy still limited • depends on speaker, amount of training up front • Synthetic speech output quality also limited • biggest challenge is prosody (intonation contours) • digitized natural speech snippets • useful for alerts, warnings (why?) • Biggest benefit: parallel processing, multi-modal • also critical for hands-busy, heads-up tasks

  16. Natural Language?

  17. Menus & Forms • Examples: • App pull-down menus • Dialog boxes • task bar • Desktop • Start menu • Restaurant menus • Web pages • Phone menus

  18. Menu Guidelines 2 level look ahead Meaningless labels?

  19. Menu Guidelines • Broad-shallow vs. narrow-deep • Depth = logbranchingFactor numPages • Usability: max depth  3-4

  20. Menus • Good: • fast for novice • Customizable • Fast learn time • Recognition instead of recall • Bad: • slow for expert • labeling is critical, consistency • Limit options • Just a pointer?

  21. Combined Strategies • Word Cut-n-Paste: • Drag-n-drop • Ctrl-x, ctrl-p • Edit menu

  22. Interpretation Perception Making sense GULF OF EVALUATION Last month’s budget... ? GULF OF EXECUTION Execution System goal Action plan Stages of Action in HCI focus of information design Human-computer “communication” Task goal focus of interaction design

  23. Constructing a System Goal • Going from users’ task concept to system concept: the cognitive distance between two models • mental model held by users tells them what to do • this must make connection with designers’ model that is conveyed and supported by the user interface • The closer the match, the easier to find and pursue a relevant goal cognitive distance

  24. Bridging the Gulf • Direct manipulation • Command language C:\>

  25. Bridging the Gulf • Menus & Forms

  26. Action Planning • Plan analysis of required action sequences • like HTA, goals decomposed into subgoals, steps, etc. • includes choices and decision rules as relevant • examine what plan knowledge is expected of the user • look for arbitrary sequences, overall complexity, consistency, interference from one plan to another • Ex: action plan for indenting paragraph?

  27. 2. Open Paragraph settings 1. Select text 1. Specify text selection start 2. Specify text selection end 3. Select Format menu 4. Select Paragraph option 5. Set Special to FirstLine 6. Type value for FirstLine 7. Accept new settings 3. Set indentation

  28. Action Execution • Physical actions of dragging, clicking, typing, etc. • design goal is to minimize, make things “hang together” as movements, not just plans • Crucial role of input device—just like icons, etc., different devices have different affordances: • keyboard? • mouse? • joystick? • trackball? • data glove?

  29. Feedback • Feedback • Feedforward

  30. Slips versus Mistakes Mistake = incorrect plan Slip = incorrect execution

  31. Supporting Error Correction • Forward/backward delete, click to de-select • usually not a question of design, built into UI platform • but what does “Back” on a browser get you? • Common design problem is providing for Undo • predicting, supporting right level of reversibility • what are the issues here?

  32. Optimizing Execution Sequences • Feedback and good defaults are essential! • especially in long, costly, or tedious transactions • Consider implications of longterm use • focus on actions for frequent choices, fast-paths • BUT, be careful to note when you are • violating overall consistency, or favoring one task at expense of other important or common tasks • Customization: users define their own sequences • e.g., mapping commands to key combinations • can be critical when supporting users with special needs

  33. Giving Control to the User • Humans are good at—and expect support for–doing multiple things at once • working in parallel or “stacking” then reinitiating a task • internal rather than external locus of control • when computer drags them along, it’s unpleasant! • BUT, what does this mean for interaction design?

  34. Multi-threaded Interaction • Multiple windows, each holds one thread • tradeoffs between tiled versus overlapping? • implies good support for window management • Avoid modal dialogs unless they have task purpose • e.g., a preemptive dialog box that must be dismissed • when should you deliberately include modal dialog? • Crucial role of status information • users must be able to tell when they return to a window what they have done so far, what is possible now, etc. • scenario-based design of “picking up the pieces”

  35. Cruise Control • Users: • Tasks: • Current systems:

More Related