SBD: Interaction Design

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

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

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

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

8. Direct Manipulation • Examples: • Drag-n-drop file icons

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: • Bad:

13. 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?

14. Command Language • Examples: • Unix, DOS

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

16. Command Language • Good: • Bad:

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

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

19. Natural Language?

20. Menus & Forms • Examples: • App pull-down menus

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

22. Menu Guidelines 2 level look ahead Meaningless labels?

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

24. Menus • Good: • Bad:

25. 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?

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

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

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