2. Utah School of Computing Preliminaries CS5540 HCI Rich Riesenfeld Fall 2009 Lecture Set 1

3. Student Name Server Utah School of Computing slide 2 Fall 2009 What is the HCI Issue? Is the interface the concern?Is the interface the concern? Is the issue a matter of accomplishing work, some set of tasks?Is the issue a matter of accomplishing work, some set of tasks? Are we focusing on wrong thing?Are we focusing on wrong thing? Do we often discuss telephone interfaces?Do we often discuss telephone interfaces?

4. Student Name Server Utah School of Computing slide 3 Fall 2009 Is Interface Point of Disc ? - 2 Do we often discuss telephone interfaces?Do we often discuss telephone interfaces? Does dancer look at his/her feet?Does dancer look at his/her feet? Does guitar player look at string?Does guitar player look at string? Does driver look at pedals?Does driver look at pedals? Does …?Does …?

5. Student Name Server Utah School of Computing slide 4 Fall 2009 “Doing Work” View Need to understand the user and human behaviorNeed to understand the user and human behavior How does an architect approach a custom home design for a new client?How does an architect approach a custom home design for a new client?

6. Student Name Server Utah School of Computing slide 5 Ex: Architecture’s Bubble Diag Ex: Architecture’s Bubble Diag - 1 - 1- 1 - 1 _____________ Based on Flickr post (Aug 2009), Harrison Architects Bubble Diagram: tool many architects use in first design phaseBubble Diagram: tool many architects use in first design phase -Quick way of diagramming basic relationships between rooms or functions building. -Heavier lines  Stronger connections  Need not translate directly to a floor plan  Helps clarify where rooms need to be

7. Student Name Server Utah School of Computing slide 6 Bubble diagrams (Harrison Architects, Seattle) Flickr Legend: Dining Room (DR) Kitchen (K) Mud Room/Laundry (MR) Living (LR) Great Room (GR) Study Nook (S)Study Nook (S) Away Room (AR)Away Room (AR) Toilet (WC)Toilet (WC) Bathing Rooms (BR)Bathing Rooms (BR)

8. Student Name Server Utah School of Computing slide 7 Ex: Architecture’s Bubble Diag Ex: Architecture’s Bubble Diag - 2 - 2- 2 - 2 _____________ Based on Flickr post (Aug 2009), Harrison Architects Following is first bubble diagram of main floor of (More) Affordable Green Home: S connected to LRS connected to LR AR connected to LRAR connected to LR -not connected as directly, since this is be away WC & BR need to be near MR & ARWC & BR need to be near MR & AR AR will function as an occasional BRAR will function as an occasional BR

9. Student Name Server Utah School of Computing slide 8 Bubble diagrams (Harrison Architects, Seattle) Flickr Following is first bubble diagram of main floor of (More) Affordable Green Home: Strong connections btw (DR) & (K)Strong connections btw (DR) & (K) K & MR living LRK & MR living LR K & DR (all part of the great room).K & DR (all part of the great room). S connected to LRS connected to LR

10. Student Name Server Utah School of Computing slide 9 Ex: Architecture’s Bubble Diag Ex: Architecture’s Bubble Diag - 2 - 2- 2 - 2 _____________ Based on Flickr post (Aug 2009), Harrison Architects Following is first bubble diagram of main floor of (More) Affordable Green Home: Strong connections btw (DR) & (K)Strong connections btw (DR) & (K) K & MR living LRK & MR living LR K & DR (all part of the great room).K & DR (all part of the great room). S connected to LRS connected to LR

11. Student Name Server Utah School of Computing slide 10 Bubble diagrams (Harrison Architects, Seattle) Flickr Following is first bubble diagram of main floor of (More) Affordable Green Home: S connected to LRS connected to LR AR connected to LRAR connected to LR -not connected as directly, since this is be away WC & BR need to be near MR & ARWC & BR need to be near MR & AR AR will function as an occasional BRAR will function as an occasional BR

12. Student Name Server Utah School of Computing slide 11 Bubble diagrams (Harrison Architects, Seattle) Flickr Study nook (S) is connected to LR.Study nook (S) is connected to LR. Away room (AR) connected to LRAway room (AR) connected to LR -not connected as directly, since this is be away. WC and bathing rooms (BR) need to be near MR and ARWC and bathing rooms (BR) need to be near MR and AR -AR will function as an occasional BR

13. Student Name Server Utah School of Computing slide 12 Ex: Architecture’s Bubble Diag Ex: Architecture’s Bubble Diag - 2 - 2- 2 - 2 _____________ Based on Flickr post (Aug 2009), Harrison Architects

14. Student Name Server Utah School of Computing slide 13 Ex: Architecture’s Bubble Diag Ex: Architecture’s Bubble Diag - 2 - 2- 2 - 2 _____________ Based on Flickr post (Aug 2009), Harrison Architects

15. Student Name Server Utah School of Computing slide 14 Ex: Architecture’s Bubble Diag Ex: Architecture’s Bubble Diag - 2 - 2- 2 - 2 _____________ Based on Flickr post (Aug 2009), Harrison Architects

16. Student Name Server Utah School of Computing slide 15 Ex: Architecture’s Bubble Diag Ex: Architecture’s Bubble Diag - 2 - 2- 2 - 2 _____________ Based on Flickr post (Aug 2009), Harrison Architects

17. Student Name Server Utah School of Computing slide 16 Now, I'm taking another pass at it and trying to resolve some of the things that didn't work for me with the mud room, wc room and bathing room. it's still about four feet too long though, to fit easily in any orientation on a Seattle city lot.

18. Student Name Server Utah School of Computing slide 17 Ex: Architecture’s Bubble Diag Ex: Architecture’s Bubble Diag - 2 - 2- 2 - 2 _____________ Based on Flickr post (Aug 2009), Harrison Architects

19. Student Name Server Utah School of Computing slide 18 Ex: Architecture’s Bubble Diag Ex: Architecture’s Bubble Diag - 2 - 2- 2 - 2 _____________ Based on Flickr post (Aug 2009), Harrison Architects

20. Student Name Server Utah School of Computing slide 19 Ex: Architecture’s Bubble Diag Ex: Architecture’s Bubble Diag - 2 - 2- 2 - 2 _____________ Based on Flickr post (Aug 2009), Harrison Architects

21. Student Name Server Utah School of Computing slide 20 Fall 2009 Interesting, pleasing, attractive, invitingInteresting, pleasing, attractive, inviting Effective to useEffective to use Intuitive à la Alan Kay’s childrenIntuitive à la Alan Kay’s children Organized, hierarchically structured, cleanOrganized, hierarchically structured, clean What good interface principles - 1 do we already know ?

22. Student Name Server Utah School of Computing slide 21 Fall 2009 Help functions, Search, etcHelp functions, Search, etc Consistent form (aka “design integrity”)Consistent form (aka “design integrity”) Automatic assistanceAutomatic assistance -Completions -Spelling What good interface principles - 2 do we already know?

23. Student Name Server Utah School of Computing slide 22 Fall 2009 Lead the userLead the user -Prompts -Indicate nature of any problem  No indication  Vague, misleading indication  Wrong indication (Latex) -Specific communication Navigational aids: navi sys’s often hugeNavigational aids: navi sys’s often huge What good interface principles - 3 do we already know?

24. Student Name Server Utah School of Computing slide 23 Fall 2009 Meaningful error msgsMeaningful error msgs -Don’t send you elsewhere -Give useful data -Area of inadequate traditions Multiple paths to a functionMultiple paths to a function Keep it simpleKeep it simple What good interface principles - 4 do we already know?

25. Student Name Server Utah School of Computing slide 24 Fall 2009 Gain user’s trustGain user’s trust Bottom up is probably most comfortableBottom up is probably most comfortable Simple tasks should be simpleSimple tasks should be simple WYSIWYG – easy to get startedWYSIWYG – easy to get started -piano v violin What good interface principles - 5 do we already know?

26. Student Name Server Utah School of Computing slide 25 Fall 2009 Our history hurts us… - 1 Developed poor communications habitsDeveloped poor communications habits Natural language terribly ambiguousNatural language terribly ambiguous -Meaning: “Mary had a little lamb” Resources used 2B scarceResources used 2B scarce Other priorities, historicallyOther priorities, historically

27. Student Name Server Utah School of Computing slide 26 Fall 2009 Our history hurts us… - 2 Error MessagesError Messages -Early computing: “Compiler error” -Even now: Sys Error EM732851 -“Check Engine” -Error from wrong module: Latex Small road signsSmall road signs Confusing directionsConfusing directions -400 S HOV Interchange on I15

28. Student Name Server Utah School of Computing slide 27 Fall 2009

29. Student Name Server Utah School of Computing slide 28 Fall 2009 Our history hurts us: KE007 - 3 KE007 1 Sep 1983

30. Student Name Server Utah School of Computing slide 29 Fall 2009 Our history hurts us… KE007 - 4 Korean Airlines Flight 007Korean Airlines Flight 007 269 onboard, veered over Soviet airspace in Pacific, and was shot down269 onboard, veered over Soviet airspace in Pacific, and was shot down Pilot/Navigator keyed in numerical coordinates by hand for flight plan!Pilot/Navigator keyed in numerical coordinates by hand for flight plan!

31. Student Name Server Utah School of Computing slide 30 Fall 2009 Our history hurts us… KE007 - 5 How about: Automatic download?Automatic download? Picking from a menu?Picking from a menu? Symbolic names?Symbolic names? Confirmation playback?Confirmation playback?

32. Student Name Server Utah School of Computing slide 31 Fall 2009 Our history hurts us… KE007 - 6 How about: Context check (like type-checking…)?Context check (like type-checking…)? -Pilot, run, time, plane, schedules, assignments, etc

33. Student Name Server Utah School of Computing slide 32 Fall 2009 Our history hurts us… KE007 - 7 How about:How about: Monitors, Alarms, Inhibitors?Monitors, Alarms, Inhibitors? Confirmation message?Confirmation message? -Aviation tower communications -Telephone technical conversations Parity checks?Parity checks?

34. Student Name Server Utah School of Computing slide 33 Fall 2009 Audi Cars took off from a standing positionCars took off from a standing position Driver error, claimed Audi…Driver error, claimed Audi… Whose error was it?Whose error was it? Our history hurts us… - 8

35. Student Name Server Utah School of Computing slide 34 Fall 2009 Our history hurts us… - 9 NASA’s Mars Orbiter space probe NASA’s Mars Orbiter space probe NASA’s Polar Lander Mars space probe

36. Student Name Server Utah School of Computing slide 35 Fall 2009 Our history hurts us… - 10 NASA space probeNASA space probe Lost major mission over units mistakeLost major mission over units mistake JPL group worked in SI unitsJPL group worked in SI units Colorado group worked in English unitsColorado group worked in English units Combining results led to bad numbersCombining results led to bad numbers Type checking issues?Type checking issues?

37. Student Name Server Utah School of Computing slide 36 Fall 2009 What does this sign mean? Culture -1

38. Student Name Server Utah School of Computing slide 37 Fall 2009 What does this sign mean? Culture -2

39. Student Name Server Utah School of Computing slide 38 Fall 2009 Culture - 3

40. Student Name Server Utah School of Computing slide 39 Fall 2009 Up is better than down -Religion, Dante, … When we refer to ourselves -We point to our noses? -Our chests? Point with index finger or hand ? Culture - 4

41. Student Name Server Utah School of Computing slide 40 Fall 2009 Critical Interfaces Nuclear power plants: 1961 SL1 nuclear disasterNuclear power plants: 1961 SL1 nuclear disaster1961 SL1 nuclear disaster1961 SL1 nuclear disaster -Interface had better be clear and foolproof Airplane cockpitAirplane cockpit -Computer graphics has simplified controls, information Power saw, laser indicatorPower saw, laser indicator

42. Student Name Server Utah School of Computing slide 41 Fall 2009 Accessibility of Controls Where is the interface?Where is the interface? Where is the emergency “Off” ?Where is the emergency “Off” ? Access causes:Access causes: -Exposure to danger -Confusion -Loss of critical time -Distraction (John Denver’s plane crash) -Disorientation

43. Student Name Server Utah School of Computing slide 42 Fall 2009 Parameter Overload Too many choicesToo many choices What does a parameter (widget) do?What does a parameter (widget) do? Which is the most important at this time?Which is the most important at this time? ExamplesExamples

44. Student Name Server Utah School of Computing slide 43 Fall 2009 Effect of Function: Examples Water faucets in a sinkWater faucets in a sink Manual gear shift: 4 on the floorManual gear shift: 4 on the floor Chords on a guitar: hard!Chords on a guitar: hard! Interface is dictated (confused) by needed functionInterface is dictated (confused) by needed function

45. Student Name Server Utah School of Computing slide 44 Fall 2009 Other Historical Examples Books are essentially linearBooks are essentially linear Stories or communications needs are notStories or communications needs are not Hyper-textHyper-text -Breaks the shackles of linear text stream -Digress as needed, desired

46. Student Name Server Utah School of Computing slide 45 Fall 2009 HCI is a Design Problem Design is old subjectDesign is old subject Well studied, rich traditionsWell studied, rich traditions Apply design methodologies to build better interfacesApply design methodologies to build better interfaces We will look at this viewpointWe will look at this viewpoint

47. Student Name Server Utah School of Computing slide 46 Fall 2009 Important Operational Issues ReliabilityReliability AvailabilityAvailability SecuritySecurity Data integrityData integrity

48. Student Name Server Utah School of Computing slide 47 Fall 2009 Important Basics Standardization across app’sStandardization across app’s -Apple did this first Integration of packages and toolsIntegration of packages and tools -Unix does this well Consistency in actions, design style, terms, menus, color, fonts, etcConsistency in actions, design style, terms, menus, color, fonts, etc Portability across platformsPortability across platforms -Less than advertised (Quicken, eg)

49. Student Name Server Utah School of Computing slide 48 Fall 2009 Palm Desktop Calendar

50. Student Name Server Utah School of Computing slide 49 Fall 2009 Palm Handheld Calendar

51. Student Name Server Utah School of Computing slide 50 Fall 2009 Important Stats -1 Time to learnTime to learn Speed of performanceSpeed of performance -How much coffee can one drink? Rate of errors by usersRate of errors by users -“The user is always right!”

52. Student Name Server Utah School of Computing slide 51 Fall 2009 Important Stats -2 Retention over timeRetention over time -Do you have to start at square 1? Subjective satisfactionSubjective satisfaction -Do you like it (no explanation needed!) -Can you develop attachment for it?

53. Student Name Server Utah School of Computing slide 52 Fall 2009 Dramatically Different Needs - 1 Life-critical systemsLife-critical systems -Air traffic; nuclear reactors; cockpits; power utilities; emergency, military, medical, operations CommercialCommercial -Banks, resv’s, inventory, point-of-sales (Hertz, Fedex,..), registration,..

54. Student Name Server Utah School of Computing slide 53 Fall 2009 Dramatically Different Needs - 2 Home, office, entertainmentHome, office, entertainment -Obvious needs Exploratory, creative, cooperative systemsExploratory, creative, cooperative systems -Bad interface (computer or otherwise) can destroy the process

55. Student Name Server Utah School of Computing slide 54 Fall 2009 Human Diversity Ergonomics, anthropometryErgonomics, anthropometry -Are you “average?” Physical considerationPhysical consideration -Height, stiffness, posture, shape, size of working area -IPD, head size, light sensitivity -Left-handedness

56. Student Name Server Utah School of Computing slide 55 Fall 2009 Short-term memoryShort-term memory Long-term memoryLong-term memory (Over 40 year old users…)(Over 40 year old users…) Problem solvingProblem solving Decision makingDecision making -Armageddon situations Cognitive Processes - 1 (from Engineering Abstracts)

57. Student Name Server Utah School of Computing slide 56 Fall 2009 Attention and set (scope of concern)Attention and set (scope of concern) -ADHD, Ritalin population (5%)… Search and scanningSearch and scanning Time perceptionTime perception Cognitive Processes (fr Eng Abs) - 2

58. Student Name Server Utah School of Computing slide 57 Fall 2009 Arousal and vigilanceArousal and vigilance FatigueFatigue Perceptual (mental) loadPerceptual (mental) load Knowledge of resultsKnowledge of results Monotony and boredomMonotony and boredom Perceptual & Motor Performance Factors (ibid) - 1

59. Student Name Server Utah School of Computing slide 58 Fall 2009 Sensory deprivationSensory deprivation Sleep deprivationSleep deprivation -New driving regulations -Medical interns/residents Anxiety and fearAnxiety and fear IsolationIsolation Perceptual and Motor - 2 Performance Factors (ibid)

60. Student Name Server Utah School of Computing slide 59 AgingAging Drugs and alcoholDrugs and alcohol Circadian rhythmsCircadian rhythms Fall 2009 Perceptual and Motor - 3 Performance Factors (ibid)

61. Student Name Server Utah School of Computing slide 60 Fall 2009 Gender Differences Males and Females are different!Males and Females are different! -Aggressiveness comparisons -Learning environments  Positive v. Negative Reinforcement -Sensitivities Much has been observedMuch has been observed Firm principles are scarceFirm principles are scarce -Some research at Stanford

62. Student Name Server Utah School of Computing slide 61 Fall 2009 Extrovert v IntrovertExtrovert v Introvert -Extroverts like action Sensing v IntuitionSensing v Intuition -Routine v (Discovering New) Carl Jung’s - 1 Personality Differences

63. Student Name Server Utah School of Computing slide 62 Fall 2009 Perceptive v JudgingPerceptive v Judging -New situations v planning Feeling v ThinkingFeeling v Thinking -Sensitive v logical Carl Jung’s Personality Differences - 2

64. Student Name Server Utah School of Computing slide 63 Fall 2009 Recent Study Result … Multi-tasking does not work!Multi-tasking does not work! Ergo, one should not:Ergo, one should not: -Drive a car -Talk on a mobile phone Q: Is driving a car a single task??Q: Is driving a car a single task?? Q: Is playing piano a single task??Q: Is playing piano a single task?? Q: Is speaking a foreign language??Q: Is speaking a foreign language??

65. Student Name Server Utah School of Computing slide 64 Fall 2009 Cultural & International Diversity - 1 Characters, numerals, special characters, diacriticalsCharacters, numerals, special characters, diacriticals Left-to-right v (right-to-left or vertical reading)Left-to-right v (right-to-left or vertical reading) Date and time formatsDate and time formats -International standards Numeric and currency formatsNumeric and currency formats

66. Student Name Server Utah School of Computing slide 65 Fall 2009 Cultural & International Diversity - 2 Weights and measuresWeights and measures Telephones and addressesTelephones and addresses -Fixed v variable length Names and titlesNames and titles -Mr., Ms., Mme, M., Dr. SSNs, national IDs,SSNs, national IDs, Capitalization and punctuationCapitalization and punctuation

67. Student Name Server Utah School of Computing slide 66 Fall 2009 Cultural & International Diversity - 3 Sorting sequencesSorting sequences -Different alphabets Icons, buttons, colorsIcons, buttons, colors Pluralization, grammar, spellingPluralization, grammar, spelling Etiquette, policies, tone, formality, metaphorsEtiquette, policies, tone, formality, metaphors

68. Student Name Server Utah School of Computing slide 67 Fall 2009 Users with Disabilities Can truly open doorsCan truly open doors -Man with ALS who uses head to type Doing it well requires good client modelDoing it well requires good client model Designer challengesDesigner challenges

69. Student Name Server Utah School of Computing slide 68 Fall 2009 Evaluating Interfaces - 1 Understanding of a practical problemUnderstanding of a practical problem Lucid statement of a testable hypothesisLucid statement of a testable hypothesis Manipulation of small number of independent variablesManipulation of small number of independent variables Measurement of specific dependent variablesMeasurement of specific dependent variables

70. Student Name Server Utah School of Computing slide 69 Fall 2009 Evaluating Interfaces - 2 Careful selection and assignment of subjectsCareful selection and assignment of subjects Control for bias in subjects, procedures, and materialsControl for bias in subjects, procedures, and materials Application of statistical testsApplication of statistical tests Interpretation of results, refinement of theory, and guidance for experimentersInterpretation of results, refinement of theory, and guidance for experimenters

71. Student Name Server Utah School of Computing slide 70 Fall 2009 Possible Research Directions - 1 Reduced anxiety of computersReduced anxiety of computers Graceful evolution of systemsGraceful evolution of systems Specification and implementation of interactionSpecification and implementation of interaction Direct manipulationDirect manipulation

72. Student Name Server Utah School of Computing slide 71 Fall 2009 Possible Research Directions - 2 Input devicesInput devices Online assistanceOnline assistance Information explorationInformation exploration Applications across platformsApplications across platforms

73. Utah School of Computing End of Lecture Set 1 Preliminaries End Lec Set 1