1 / 43

Unit 2: interaction design

Unit 2: interaction design. 2.1 Models of Interaction. Models of Interaction. Why To identify the likely root of difficulties As a framework to compare different interaction styles Terms of interaction. Norman’s Execution-Evaluation Cycle. Gulf of evaluation. Light-switching example.

hali
Download Presentation

Unit 2: 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. Unit 2: interaction design

  2. 2.1 Models of Interaction

  3. Models of Interaction • Why • To identify the likely root of difficulties • As a framework to compare different interaction styles • Terms of interaction

  4. Norman’s Execution-Evaluation Cycle Gulf of evaluation Light-switching example Gulf of execution http://www.it.bton.ac.uk/staff/rng/teaching/notes/NormanGulfsC.GIF

  5. Gulf of Execution • VCR programmed recording • VCR’s language • Hit the record button. • Specify time of recording via the controls • Select channel via the channel-up-down control. • Press the OK button. • User’s mental model • Hit the record button.

  6. Gulf of Evaluation Security permission Non-linear check-out

  7. Class Discussion • Amanda跟先生之間喜歡使用密語 • 他們以動物相互稱呼對方 • 即使在skype中,也模仿動物的叫聲 • Amanda: OrrrrrrrrrYiiiiiiYooooooo • Amanda’s husband: KoKo~KoKo~ • 某天,在Amanda先生在skype中看到: • Amanda: 在嗎? • 此訊息可能導致Amanda先生出現何種鴻溝?

  8. Norman’s Execution-Evaluation Cycle • As a problem classifier • Amanda發現iBon的螢幕反光很嚴重 • Bob想要訂NBA熱身賽門票卻找不到位置 • Carol列印收據時找不到收據 • Clear and intuitive model • Only consider interface • Over-emphasize the user’s view

  9. The Interaction Framework

  10. Poor Mapping In Articulation • Coverage (input/task) • Relative ease of translation

  11. Different Articulation Effects of the Same Input Language Good mappingfor moving files Not-So-Good mapping for re-naming file extension in batch

  12. Poor Mapping in Performance Disappeared shutdown? • Coverage (input language/core language) • Relative ease of translation

  13. Class Discussion: Poor Mapping in Performance? Cannot shutdown remote PC Press Alt+F4

  14. Poor Mapping in Observation What time is it? HTML editing in Notepad • Coverage (output/task) • Relative ease of translation

  15. 2.2 What is Design?

  16. Designing Interactive Systems vs.Interaction Design • What a centralized stapler can change?

  17. What is Design • Goal • Constraints • Trade-off • Good decision making • Creative solution

  18. The Golden Rule of Design—Understand Your Material Design Chair A Using Chair B’s design? The materials for HCI?

  19. Human Errors Slips Mistakes

  20. 2.3 The Process of Design

  21. Software Development Life Cycle (SDLC)

  22. Difficult Project Communication

  23. PZB模型

  24. Interaction Design Process

  25. When to Consider Usability

  26. 2.4 Usability Metrics as Benchmarks What is wanted Analysis Design Evaluation

  27. Features and Usability Attributes

  28. Sample Usability Specification Now level vs. Worse case

  29. Alternatives for (Now and Planned) Levels and (Best and Worst) Cases

  30. Example Usability Metrics in ISO 9241

  31. Case Study: Usability Metric Framework for Mobile Phone Application

  32. Questions for Usability Goals

  33. Derived Usability Metrics

  34. Usability Engineering • Early inclusion of usability in the SDLC • Explicit usability metrics in requirements spec. • Empirical evidence • Limitations • Only physical interactions observed • Usability ?= usability specification

  35. 2.5 Scenarios What is wanted Analysis Design Evaluation

  36. Detailed Scenario Example: Proposed Scenario for Movie Player (1/3) • Brian would like to see the new film Moments of Significance and wants to invite Alison, but he knows she doesn’t like ‘arty’ films. • He decides to take a look at it to see if she would like it and so connects to one of the movie-sharing networks. • He uses his work machine as it has a higher bandwidth connection, but feels a bit guilty.

  37. Detailed Scenario Example: Proposed Scenario for Movie Player (2/3) • He knows he will be getting an illegal copy of the film, but decides it is OK as he is intending to go to the cinema to watch it. • After it downloads to his machine he takes out his new personal movie player. • He presses the ‘menu’ button and on the small LCD screen he scrolls using the arrow keys to ‘bluetooth connect’ and presses the ‘select’ button.

  38. Detailed Scenario Example: Proposed Scenario for Movie Player (3/3) • On his computer the movie download program now has an icon showing that it has recognized a compatible device and he drags the icon of the film over the icon for the player. • On the player the LCD screen says ‘downloading now’, with a percent done indicator and small whirling icon.

  39. Pencil Sketch

  40. Story Board

  41. Scenario

More Related