An Ultra-Fast Look at Some HCI Background. 2 Just 3 high points about properties of users (with software spin) n Mental Models n Performance characteristics.

Slides:



Advertisements
Similar presentations
Arthur Fink Page 1 Notes on Designing User Interfaces for OpenEdge GUI for.NET Arthur Fink Arthur Fink Consulting © 2008 by Arthur Fink.
Advertisements

Annoy Your Users Less Session 202 Philip Wolfe, Lead Developer Farm Credit Services of America.
Fall 2002CS/PSY Design of Everyday Things Agenda Discuss Norman’s views on HCI & design Discussion What did you take away from DOET book.
What is Design? Professor: Tapan Parikh TA: Eun Kyoung Choe
Arthur Fink Page 1 Thinking about User Interface Design for OpenEdge GUI for.NET (or any other environment) by Arthur Fink
Part 2c: Requirements Chapter 2: How to Gather Requirements: Some Techniques to Use Chapter 3: Finding Out about the Users and the Domain Chapter 4: Finding.
Semester in review. The Final May 7, 6:30pm – 9:45 pm Closed book, ONE PAGE OF NOTES Cumulative Similar format to midterm (probably about 25% longer)
Semester wrap-up …my final slides.. More on HCI Class on Ubiquitous Computing next spring Courses in visualization, virtual reality, gaming, etc. where.
Semester wrap-up …the final slides.. The Final  December 13, 3:30-4:45 pm  Closed book, one page of notes  Cumulative  Similar format and length to.
Mental Models and Affordances Lecture #5 - February 12th, : User Interface Design and Development.
User-Centered Design Good design The user says “Yes, I see” or “Of course”. A simple explanation is sufficient. Bad design The user says “How am I going.
User Interface Design Users should not have to adapt to a piece of software; the software should be designed to fit the user.
User interface design Designing effective interfaces for software systems Objectives To suggest some general design principles for user interface design.
Overview of Long-Term Memory laura leventhal. Reference Chapter 14 Chapter 14.
Chapter 7 design rules.
Semester wrap-up …the final slides.. The Final December 15, 3:30-6:30 pm Close book, one page of notes Cumulative Similar format to midterm (probably.
Introduction to HCI Marti Hearst (UCB SIMS) SIMS 213, UI Design & Development January 21, 1999.
SIMS 213: User Interface Design & Development Marti Hearst Tues, Feb 11, 2003.
INTRODUCTION. Concepts HCI, CHI Usability User-centered Design (UCD) An approach to design (software, Web, other) that involves the user Interaction Design.
User Centered Design Lecture # 5 Gabriel Spitz.
User Interface Evaluation CIS 376 Bruce R. Maxim UM-Dearborn.
User Interface Design Principles Gabriel Spitz 1 Lecture # 4.
User Characteristics & Design Principles Gabriel Spitz 1 Lecture # 11.
1 ISE 412 Human-Computer Interaction Design process Task and User Characteristics Guidelines Evaluation.
People: Usability IS 101Y/CMSC 101Y November 5, 2013 Marie desJardins Amanda Mancuso University of Maryland Baltimore County.
INTROSE Introduction to Software Engineering Raymund Sison, PhD College of Computer Studies De La Salle University User Interface Design.
People: Usability COMP 101 November 12, 2014 Carolyn Seaman Amanda Mancuso Susan Martin University of Maryland Baltimore County.
Principles of User Centred Design Howell Istance.
1 Human-Computer Interaction  Design process  Task and User Characteristics  Guidelines  Evaluation.
What is an interface? How many different types of interfaces can you think of?
Q Q Human Computer Interaction – Part 1© 2005 Mohammed Alabdulkareem Human Computer Interaction - 1 Dr. Mohammed Alabdulkareem
Design for Interaction Rui Filipe Antunes
User Interface Design Session 11- LBSC 790 / INFM 718B Building the Human-Computer Interface Cartoon removed.
Usability Evaluation/LP Usability: how to judge it.
Object-Oriented Software Engineering Practical Software Development using UML and Java Chapter 7: Focusing on Users and Their Tasks.
Human-Computer Interaction (HCI)
Fall 2002CS/PSY Design. Fall 2002CS/PSY System-Centered Design Focus is on the technology  What can be built easily using the available tools.
Design Rules-Part B Standards and Guidelines
Software Architecture
1 3132/3192 User Accessibility © University of Stirling /3192 User Accessibility 2.
Stanford hci group / cs147 Intro to HCI Design Midterm Review Session November 2/
More on Design of Everyday Things. Turn it up, or shut it down?
The Design of Everyday Things Darn these hooves! I hit the wrong switch again! Who designs these instrument panels, raccoons?
1 CSC111H User Interface Design Dennis Burford
Computing for Social Needs Jennifer Mankoff UC Berkeley.
Human Abilities 2 How do people think? 1. Agenda Memory Cognitive Processes – Implications Recap 2.
Theories and Practice of Interactive Media 13 October 2003 Kathy E. Gill.
SBD: Information Design
Yonglei Tao School of Computing & Info Systems GVSU Ch 7 Design Guidelines.
Semester wrap-up …the review.. Course ReCap To make you notice interfaces, good and bad – You’ll never look at doors the same way again To help you realize.
Gabriel Spitz 1. Light Switch Issues  Consistency – The switch design is inconsistent with common light switches  Visibility – No visible cue regarding.
Capabilities of Humans. Gestalt More than the sum of its parts.
Object-Oriented Software Engineering Practical Software Development using UML and Java Chapter 7: Focusing on Users and Their Tasks.
Capabilities of Humans. Gestalt More than the sum of its parts.
Human-Computer Interaction Design process Task and User Characteristics Guidelines Evaluation ISE
Introduction to Evaluation “Informal” approaches.
The Design of Everyday Things Donald A. Norman. The psychopathology of everyday things Doors Doors Light switches Light switches Taps Taps Telephones.
Interaction Frameworks COMPSCI 345 S1 C and SoftEng 350 S1 C Lecture 3 Chapter (Heim)
6. (supplemental) User Interface Design. User Interface Design System users often judge a system by its interface rather than its functionality A poorly.
Chapter 7 design rules. Designing for maximum usability – the goal of interaction design Principles of usability –general understanding Standards and.
Design rules.
Midterm in-class Tuesday, Nov 6
Model based design.
Norman Chapter 2 Psychology of Everyday Actions
Chapter 7 design rules.
Chapter 7 design rules.
Chapter 7 design rules.
User-Centered Design Data Entry CS 4640 Programming Languages for Web Applications [The Design of Everyday Things, Don Norman, Ch 7]
Chapter 7 design rules.
User-Centered Design Data Entry CS 4640 Programming Languages for Web Applications [The Design of Everyday Things, Don Norman, Ch 7]
Presentation transcript:

An Ultra-Fast Look at Some HCI Background

2 Just 3 high points about properties of users (with software spin) n Mental Models n Performance characteristics of people n Errors (Scott slaughters Psychology on the alter of UI software)

3 SYSTEM n Updates display Display How users use interfaces: The “interface cycle”

4 USER n Evaluates & understands display SYSTEM Display The “interface cycle”

5 USER n Evaluates & understands display n Formulates goals & actions SYSTEM Display The “interface cycle”

6 USER n Evaluates & understands display n Formulates goals & actions n Acts to produce inputs SYSTEM Input Devices Display The “interface cycle”

7 USER n Evaluates & understands display n Formulates goals & actions n Acts to produce inputs SYSTEM n Interprets input events Input Devices Display The “interface cycle”

8 USER n Evaluates & understands display n Formulates goals & actions n Acts to produce inputs SYSTEM n Updates internal “state” n Interprets input events Input Devices Display The “interface cycle”

9 USER n Evaluates & understands display n Formulates goals & actions n Acts to produce inputs SYSTEM n Updates display n Updates internal “state” n Interprets input events Input Devices Display The “interface cycle”

10 Norman’s “Gulfs” n Norman describes 2 user activities as bridging – The Gulf of evaluation UserSystem

11 Norman’s “Gulfs” n Norman describes 2 user activities as bridging – The Gulf of evaluation – The Gulf of execution n Making these “gulfs” (mappings) small makes the interface much easier to use UserSystem

12 Mental models n To evaluate and act, people inevitably build models of how the system works – can’t help but do it – may be highly detailed and functional – may be quite naïve n Generally are not complete, not necessarily “logical”, …

13 Model of mental models (from Gerhard Fischer, U of Colo.) What the system designer things the system does

14 Model of mental models What the system actually does What the system designer things the system does

15 Model of mental models Frequently Used (Well understood) Part of System Functionality

16 Model of mental models Occasionally Used Part of System Functionality

17 Model of mental models User’s full model of what the system does

18 Key points about mental models What happens here is very important

19 Key points about mental models n The system designer has too good a mental model – Nearly perfect mental model – Really good prediction of what system does – Real user’s can’t ever have that good a model

20 Scott’s UI design guideline #1 n A system implementor cannot pretend to be a user – You know too much – You can’t forget n HCI Mantra: “You are not like the user!” n Have to observe real users!

21 Scott’s definition of what makes a good UI n A user interface is good if: 1) It offers (convenient access to) the functionality needed to perform the task efficiently 2) The user’s mental model accurately predicts interface action

22 Scott’s definition of what makes a good UI n From traditional CS point of view 1) is fine: “design in the right things” 2) is a big problem – Good UI is not a function of the software! – Good UI is (mostly) a property of the user!

23 Good UI is a property of the user n On a per user basis n We don’t even have control over much of this – e.g., baggage from existing mental models n Aaaargh! – But this is reality

24 How do we deal with this? n Carefully and explicitly structure our designs to try to induce the right mental model in the user – and test that it does! n Have explicit “conceptual model” – view of what MM we are trying to give

25 Principle: n People can’t form very good mental models of things they can’t see

26 Two specific things to worry about n Affordance n Feedback

27 Affordance n Opportunities to act which are readily apparent to the user – Form “affords” certain actions and makes that apparent – Allows and promotes certain actions F Door knobs afford turning F Handle of hammer affords grasping in a particular way

28 Affordance n Example: Knurling – Small ridges typically found on knobs n Increases friction => Affords grip

29 “Virtual affordances” n Don’t typically have much physical form in a GUI n But, visual appearance can still suggest function

30 “Virtual affordances” n Don’t typically have much physical form in a GUI n Reminders of the real world work Note that you don’t have to know about knurling for this to afford “grip” with the mouse

31 Feedback n Response by the system to the actions of the user – Cause and effect – Essential for forming mental models n Making “system state” visible

32 Scott’s UI design guideline #2 n Explicitly design a conceptual model and use affordance and feedback (and everything else you have) to reinforce it

33 Performance properties of people (Only a very few here) n How long will things take? – e.g., physical movements n How much can people remember? n How fast are thing perceived?

34 How long can will user actions take n Only have really strong models for physical movements n Fitts’ law predicts movements as a function of distance and required accuracy (see later) T = A log 2 (D/S + 0.5) + B

35 How much can a person remember n Short term (working) memory – Famous 7  2 “chunks” – For us just: “very limited” n Long term – Essentially unbounded – But requires effort and may not always work on cue

36 How much can a person remember n Implication: Generally better to rely on recognition (seeing it in front of you) than just recall (having to pull it out of long term memory) n Novice / expert differences

37 How fast are things perceived? n < ~20ms (1/50 sec) discrete images/flashes merge into continuous perception – Lights above you flicker 60 times per second – Differences in peripheral vision F Sabertooth tigers

38 How fast are things perceived? n < ~20ms (1/50 sec) n Displays update at 50-75hz n Don’t ever have to be faster than this for user response! – Currently (500Mhz) get 10 million CPU cycles F You can do a lot with that F Not enough? 20 in 18 months...

39 How fast are things perceived? n < ~100ms seems like “instant response” – Hard to tell response times below this apart – Eye saccades n Discrete images into steps instead of apparent motion

40 How fast are things perceived? n 100ms (1/10 sec) n Except some animation, most things don’t need to be faster than this – Typical target “cycle time” – 50 million CPU cycles,...

41 How fast are things perceived? n < 1-2 seconds typically “good response time” – Similar times in conversational turn taking protocols – Longer delays ~5 sec have to say something to keep conversation alive (Note: numbers fuzzier as we go out)

42 How fast are things perceived? n > sec is typically “bad response time” – STM decay effects

43 A little about response times n Good vs. bad response time is very dependent on expectation – If you can’t meet the goals, manipulate user expectations n Consistency of response is very important – Can be more important that time

44 Scott’s UI guideline #3 (from Donald Knuth) n Premature optimization is the root of all evil – Build it and refine usability first – Only optimize if usability tests say you have to – CS intuitions about this misleading

45 How long do other cognitive activities take? n Unfortunate, but… – Not as well understood – Much harder to apply what is understood – See other HCI courses for some of this

46 Final property of people: Errors n People make lots of mistakes! – A fundamental property of people F Lots of errors F Everyone F All the time n If you are designing for real people then…

47 Scott’s UI design guideline #4: n Errors are not exceptional events! – Part of the expected and normal – System has to be designed from the bottom up to deal with errors at least as effectively as other actions n Sharp contrast to how I was taught to program

48 Handling errors is critical to mental model formation n How do people learn?

49 Handling errors is critical to mental model formation n How do people learn: – Read the manual (not if they can help it!)

50 Handling errors is critical to mental model formation n How do people learn: – Read the manual (not if they can help it!) – Get help from friend / expert (more likely, but expensive)

51 Handling errors is critical to mental model formation n How do people learn: – Read the manual (not if they can help it!) – Get help from friend / expert (more likely, but expensive) n Explore!

52 Handling errors is critical to mental model formation Does this make things better or worse!?

53 Undo and errors n Perceived danger of straying outside known strongly affects willingness to explore – Hence ability to learn n Various forms of undo have a major effect

54 Scott’s summary UI design guideline n Pay attention to: – Affordance – Feedback – Performance – Likely errors n Then test and iterate

55