Announcements Assignment 1 is posted Due Sept 23 by 5:00pm on UMLearn This is an individual assignment Please read through it and bring any questions to class on Wed COMP 3020 2
Help! I can t see stuff in umlearn! Complete the honesty declaration! Under checklists
Announcements No office hour today (have to leave immediately after class) COMP 3020 4
5
6
Lecture Notes Will be posted online at: http://cs.umanitoba.ca/~young/courses/hci2017 Posted notes will not be complete You will need to take notes during lecture to complement the posted notes Note taking helps comprehension Fall 2016 COMP 3020 7
academic dishonesty not worth it permanent mark on transcript failure in course we are smarter than you think- it s usually pretty obvious
Deciding to Take the Course? The course project will be a lot of work You will have to learn Web technologies independently Group work is hard Good communication skills are required for high marks Minimal satisfaction of assignment/project requirements will not be awarded an A/A+ Fall 2016 COMP 3020 9
Resources Primary Text (Optional): Jenny Preece, Yvonne Rogers and Helen Sharp. Interaction design: Beyond Human-Computer Interaction, Wiley and sons. IDEO Cards See UMLearn for instructions on ways to obtain them Other Material: Alan Dix, Janet Finlay, Gregory Adowd, and Russell Beale. Human-Computer Interaction, Prentice Hall. Lots of online resources for Web programming Fall 2016 COMP 3020 10
Questions? Fall 2016 COMP 3020 11
Open this refrigerator on the first try 12
COMP 3020: Human-Computer Interaction I Fall 2017 what makes a good interface? history intro to HCI why is design hard James Young, with acknowledgements to Anthony Tang, Andrea Bunt, Pourang Irani, Julie Kientz, Saul Greenberg, Ehud Sharlin, Jake Wobbrock, Dave Hendry, Andy Ko, Jennifer Turns, & Mark Zachry
What makes a good interface? 14
What makes a good experience? 15
What makes a good experience? 16
What makes a good experience? Fall 2017 COMP 3020 17
What makes a good experience? 18
pause Tell me about something you ve used that provided you with a good experience. Why? 19
why are we talking about good experiences instead of about interfaces? 20
Characteristics of a good interface people feel satisfied when they use them people can complete their tasks error-free people can complete their tasks quickly* people can learn how to use the system (and its full functionality) quickly* * Why the asterisks? 21
What is design? Creative endeavor Process of creating or shaping tools or artifacts for direct human use. Outputs are things Processes, methods people-centered concerns
design vs. engineering engineering Make a mostly-known outcome possible Construct a sturdy bridge based on specifications Concerned with what can be done Reliance on well-established formulae Humans may or may not be directly in the loop design Envision new possibilities, new outcomes Determine what outcome should result among infinite possibilities Reliance on process over formulae Humans are central actors in the loop 23
design vs. art Design (as we regard it) concerns the creation of something useful and usable Art does not bother with this restriction The test: how to deem what is good? 24
Terminology: Interaction What is the difference between an interface and interaction? COMP 3020 25
Interaction interface: what a person can touch, use, read, monitor, etc. interaction: the dialogue between a person and an object (computer, chair, car etc..) COMP 3020 26
Interaction Cycle presentation Output observation (interpretation) Computer User performance (execution) Input articulation Reproduced from Dix, Finlay, Abowd, & Beale (2004) COMP 3020 27
Interaction Cycle presentation Output observation (interpretation) Computer Interface User performance (execution) Input articulation allows the system and user to communicate going around this cycle constitutes interaction COMP 3020 28
Interactive Cycle: Steps 1. The user formulates a goal and plans a method to achieve the goal presentation Output observation (interpretation) 2. The user translates the method into the system input language 3. The system executes the method instructions and updates its state Computer performance (execution) Input User articulation Interface COMP 3020 29
Interactive Cycle: Steps 4. The system translates its state into its output language presentation Computer Output observation (interpretation) User 5. The user interprets the results, and repeats the cycle performance (execution) Input Interface articulation COMP 3020 30
presentation Output observation (interpretation) Computer User performance (execution) Input articulation Interface
only computers? presentation Output observation (interpretation) Computer User performance (execution) Input articulation Interface
Interaction Cycle - problems presentation Output observation (interpretation) Computer Interface User performance (execution) gulf of evaluation Input articulation gulf of execution COMP 3020 33
lost in translation? gulf of execution both the person and system need to translate From person s intention to system input language (PERSON) From input language to internal task (SYSTEM) From internal task output to output channel (SYSTEM) From output channel to person interpretation of output (PERSON) gulf of evaluation presentation Computer performance (execution) Output Input observation (interpretation) User articulation Interface COMP 3020 34
lost in translation? both the person and system need to translate From person s intention to system input language (PERSON) From input language to internal task (SYSTEM) From internal task output to output channel (SYSTEM) From output channel to person interpretation of output (PERSON) person s perspective system perspective COMP 3020 35
Gulf of Execution The manner in which the user must translate his/her plans into input the system can understand is not always natural or intuitive A gulf of execution arises when the user has difficulties providing instructions that are executable by the system to result in the desired goal Fall 2017 COMP 3020 36
Gulf of Evaluation A Gulf of Evaluation arises when the user has trouble interpreting system output in light of their goals Reflects the amount of effort the user has to exert to determine how well his/her expectations and intentions have been met Fall 2017 COMP 3020 37
Gulf of Evaluation The gulf is small when the system provides information about its state in a form that is easy to get, is easy to interpret, and matches the way the person thinks of the system (Norman, Design of Everyday Things ) Fall 2017 COMP 3020 38
gulf of execution
gulf of evaluation
gulf of evaluation
goal - minimize these gulfs by making input easy to understand and use, and output clear and easy to interpret. The more translating the user has to do, the more difficult it is for the user to accomplish his/her task slower more errors Sometimes interaction language is far from how the user would naturally do a task (i.e., the domain language) (e.g., 3D modelling vs clay modelling) not easy.
example: desktop metaphor leverage existing understanding to minimize gulfs: folders and files, moving files between folders a desktop with a trash can and various tools