1. SBD: Interaction Design Chris North CS 3724: HCI

2. Hall of Fame/Shame Presentations http://courses.cs.vt.edu/~cs3724/fall2006/schedule.html

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

4. Interaction Design Specify the action sequences for planning and achieving one or more task goals 1.System goals 2.Action plans 3.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

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

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

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

11. Video Games

12. Direct Manipulation Principles 1.Visual representation of objects and actions 2.Rapid, incremental, reversible actions 3.Pointing and directly selecting 4.Immediate, continuous feedback “Just do it” - B. Shneiderman

13. Direct Manipulation Good: Bad:

14. Direct Manipulation Good: see what your doing, wysiwig Back, undo, avoid errors Learning time good, natural, metaphors, novices High subjective satisfaction, enjoyment Bad: No wildcards, macros Slow for Experts Limited options Difficult implementation?

15. Command Language Examples: Unix, DOS

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

17. Command Language Good: Bad:

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

19. 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

20. Natural Language?

21. Menus & Forms Examples: App pull-down menus

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

23. Menu Guidelines 2 level look ahead Meaningless labels?

24. Menu Guidelines Broad-shallow vs. narrow-deep Depth = log branchingFactor numPages Usability: max depth  3-4

25. Menus Good: Bad:

26. Menus Good: fast for novice Customizable Fast learn time Recognition instead of recall Bad: slow for expert labeling is critical, consistency Limited options Just a pointer? Multi-selection?

27. Combined Strategies Word Cut-n-Paste: Drag-n-drop Ctrl-x, ctrl-v Edit menu

28. Execution Action plan System goal Last month’s budget... ? Interpretation Perception Making sense GULF OF EVALUATION GULF OF EXECUTION Stages of Action in HCI Information design Interaction design Human- computer interaction Task goal

29. Cruise Control Users: Tasks: Current systems: New ideas:

30. Cruise Control Users: Drivers, age >=16, long distance, foot is tired, speeding tickets in the past? Commuter? Tasks: get somewhere quickly, not get ticket. Maintain speed limit. Gas mileage. –Want to go a certain speed –Want to maintain current speed –Want to adjust speeds, … according to what? Current systems: Menu: hold, +, - New ideas: speech commands, say speed, advanced commands, ‘cop’ macro Direct Manip: manipulate the speedometer, Visual feedback cruise dial

31. Project Step 3 – Design Due 2 weeks: get started early! Design space Dimensions of the design space Alternative designs Claims analysis Formative evaluation Wizard of Oz Refinements Final design: Scenarios Representations

32. Homework #3 Due Thurs Download KidPad software Design a zoomable visualization