Lecture 1: These are the lectures for the HCI2015 Course, given at the VU University Amsterdam (bachelor level)

1. Human-Computer Interaction Course 2015: Lecture 1
Lora Aroyo Web & Media Group
Introduction to HCI
Chapters 1, 2

2. Human-Computer Interaction Course 2015: Lecture 1
Lora Aroyo, Web & Media Group 2
Lectures
Basic design & usability concepts
Examples of good & bad designs
Get insights of social dynamics,
privacy, accessibility
Lab sessions
Exercise in practice how to gather
information about users’ needs &
how to design and test it
Assignments
Apply your knowledge in a
concrete use case
Challenge your creativity
Course Elements

3. Human-Computer Interaction Course 2015: Lecture 1
Which means …
To be able to DESIGN:
How the user interaction and
experience should work and
look?
To be able to SELECT:
What user interaction design is
best for a given purpose in a
context?
To be able to EVALUATE:
How good a specific user
interaction is?
Lora Aroyo, Web & Media Group 3

4. Human-Computer Interaction Course 2015: Lecture 1
HOW PEOPLE INTERACT WITH
COMPUTERS?

5. Human-Computer Interaction Course 2015: Lecture 1
Dashboards
Lora Aroyo, Web & Media Group 5

6. Human-Computer Interaction Course 2015: Lecture 1
Lora Aroyo, Web & Media Group 6

7. Human-Computer Interaction Course 2015: Lecture 1
Lora Aroyo, Web & Media Group 7

8. Human-Computer Interaction Course 2015: Lecture 1
Wearables
Lora Aroyo, Web & Media Group 8

9. Human-Computer Interaction Course 2015: Lecture 1
Sensing Affect
Blood Volume
Pressure (BVP)
earring
Galvanic Skin
Response
(GSR) rings
and bracelet
Interactive Pillow
as a TV remote
control
Lora Aroyo, Web & Media Group 9

10. Human-Computer Interaction Course 2015: Lecture 1
Speech, Mobile & Augmented Interaction
Lora Aroyo, Web & Media GroupLora Aroyo, Web & Media Group
“Minority Report” (2002)
“Avengers” (2012)
“Star Trek: In to the Darkness” (2013)
“Star Trek: TOS” (1967)
“Her” (2014)

11. Human-Computer Interaction Course 2015: Lecture 1
Virtual Reality Reality
Lora Aroyo, Web & Media Group 11

12. Human-Computer Interaction Course 2015: Lecture 1
Interactive Workspaces
Lora Aroyo, Web & Media Group 12
Stanford Interactive Workspaces Project
BendDesk
Mimio

13. Human-Computer Interaction Course 2015: Lecture 1
WHY HCI?

14. Human-Computer Interaction Course 2015: Lecture 1
Typical Frustrations
Can’t figure out how to do
simple things
Many not frequent use
functions
Many hidden functions
Operations outcome not visible
Can’t remember combinations of digits * #
how do we know whether it worked
how can we remember that this option is ON
Lora Aroyo, Web & Media Group 14
http://video.google.com/videoplay?docid=5184957822303751144
http://www.youtube.com/watch?v=keMmM3P4BRM

15. Human-Computer Interaction Course 2015: Lecture 1
…elections
The sample ballot
looked different
Lora Aroyo, Web & Media Group 15
Human-Computer Interaction Course 2013: Lecture 1

16. Human-Computer Interaction Course 2015: Lecture 1
… Additional Context Limitations
• People vote infrequently
• Rushed, uncomfortable circumstances
• Elderly
Lora Aroyo, Web & Media Group 16

17. Human-Computer Interaction Course 2015: Lecture 1
Good UI Design is Important
• Examples of bad UI are easy
– Try to find examples of good UI
• Good UI (very subjective):
– Easy, natural & engaging interaction
– Users can carry out their required tasks
– Accounts for human limitations
• Usefulness is often context-dependent!
Lora Aroyo, Web & Media Group 17

18. Human-Computer Interaction Course 2015: Lecture 1
FEATURES OF MODERN HCI
CHAPTER 1

19. Human-Computer Interaction Course 2015: Lecture 1
UCD Principles & Activities
• User involvement in development stages
• Design iteration
• Multi-disciplinary design teams
– psychology, ergonomics, engineering & graphic design
• Understand & specify context of use
• Specify user & organization requirements
• Produce prototypes: design solutions
• Evaluate designs with users against requirements
Lora Aroyo, Web & Media Group 19

20. Human-Computer Interaction Course 2015: Lecture 1
Link to Software Engineering
• Separate but related concerns: systems
vs. user
• Some overlap in techniques
– Use cases
– Iterative file cycle
• Multi-disciplinary nature of HCI
Lora Aroyo, Web & Media Group 20

21. Human-Computer Interaction Course 2015: Lecture 1
Traditional Life Cycle
Lora Aroyo, Web & Media Group 21

22. Human-Computer Interaction Course 2015: Lecture 1
Evaluation-Centered
Lora Aroyo, Web & Media Group 22
Equally
supportive of
– top-down &
bottom-up
– inside-out &
outside-in
development

23. Human-Computer Interaction Course 2015: Lecture 1
Simplified Iterative Model
Lora Aroyo, Web & Media Group 23

24. Human-Computer Interaction Course 2015: Lecture 1

25. Human-Computer Interaction Course 2015: Lecture 1
GATHERING INTERACTION
REQUIREMENTS
CHAPTER 2

26. Human-Computer Interaction Course 2015: Lecture 1
Data Gathering Guidelines
• Set clear goals for the data collection
– Identify stakeholders’ needs
• Evaluate cost/benefit for your effort
– understand the tradeoffs
– use a combination of techniques
– balance specific goals and openness
• Run a pilot trial
• Record well – you won’t remember it well
Lora Aroyo, Web & Media Group 26

27. Human-Computer Interaction Course 2015: Lecture 1
• Interviews & Focus groups
• Question-based surveys
• Contextual analysis
Lora Aroyo, Web & Media Group 27
Data Gathering Methods
Complementary combination
to balance strengths & weaknesses
of each method

28. Human-Computer Interaction Course 2015: Lecture 1
Interviews
• Degrees of structuring for different purposes
– structured - like a guided questionnaire
– semi-structured - basic script guides the conversation
– open-ended - still has a goal and focus; good in the initial stages
• Phone/skype, face-to-face
– one individual at a time
– avoids biases from other people
• Develop trust
– explain your goals to the interviewee
– feedback and results to the interviewee
• Focus groups
– group of users to discuss a preliminary given issue
– facilitated
– interviews with 2 or more
Lora Aroyo, Web & Media Group 28

29. Human-Computer Interaction Course 2015: Lecture 1
• Both are:
– appropriate at almost any stage of the design
– conducting them earlier – better impact
– conducting them later – gather specific reactions to actual design
– optimal timing – early with mock-ups
– collect subjective data
– help understand the work practices
– finding out users’ tasks, roles, problems
• Focus groups are:
– difficult for geographically isolated
– difficult when target population is small
– alternative – online/phone interviews
Lora Aroyo, Web & Media Group 29
Focus Groups & Interviews

30. Human-Computer Interaction Course 2015: Lecture 1
31-May-15
+ Ideas of one can trigger ideas in others
+ Time and cost efficient
+ Incorrect facts can be corrected
+ Non-controversial issues – quickly resolved
+ Controversial issues quickly identified
+ Reach a not foreseen level of detail
– Watch out for ‘groupthink’ and ‘sidetrack’
– Ensure balance between talkers and shy users
– Sometimes difficult to coordinate
Pros & Cons of Focus Groups

31. Human-Computer Interaction Course 2015: Lecture 1
31-May-15
• 6 to 12 participants - typically around 10
• Breaks with questionnaire or individual activities
• 3 to 5 groups
• Heterogeneous groups
– good mix of people
– each group – representative sample of target audience
– watch out for too heterogeneous groups – people who do not have
much in common
• Homogeneous groups
– each group is different demographics
Select and Organize Groups

32. Human-Computer Interaction Course 2015: Lecture 1
31-May-15
• One external, professional facilitator
– Encourage discussion
– Getting everyone to participate (no viewpoint lost)
– Get people respond on one another’s input
– Foster arguments (reveal controversial issues)
– Prevent arguments getting out of hand
• Observation room
• 2 to 3 observers mixed in the group
Group Facilitation

33. Human-Computer Interaction Course 2015: Lecture 1
• Avoid suggestive questions
• Clarify reason of question
• Phrase questions in terms of probes
– e.g, “why …”
• Pay attention to non-verbal aspects
• Be aware of personal biases
• Give summaries in your own words at
intermediate points
Lora Aroyo, Web & Media Group 33
During a Focus Group Session

34. Human-Computer Interaction Course 2015: Lecture 1
• Good for:
– demographics
– evaluation of specific features or properties
• Questionnaires and surveys
– unambiguous questions
– gathering more precise information
– on-line questionnaires
• Question types (closed & open questions)
• Scales (for precision & effort needed to decide on a
response)
• Qualitative vs. quantitative data
Lora Aroyo, Web & Media Group 34
Question-based Surveys

35. Human-Computer Interaction Course 2015: Lecture 1
• Closed questions:
– select an answer from a set of alternative replies
– may require just “yes” or “no”
– some form of a rating scale associated
• Open questions:
– typically start with phrases such as:
• “What do you . . . ,”
• “How do you . . . ,”
• “What ways . . . .”
– provide richer data than closed questions
– more time consuming to analyze
• decide on some grouping and classifying
Lora Aroyo, Web & Media Group 35
Questions

36. Human-Computer Interaction Course 2015: Lecture 1
Simple rating scale, e.g. checklists - easy to analyze
(count the number of responses in each category)
Complex rating scales - a multipoint rating scale
semantic differential (users select a point along a scale)
Lora Aroyo, Web & Media Group 36
Question Scales (1/2)

37. Human-Computer Interaction Course 2015: Lecture 1
• Semantic differentials
– with seven points, five-point or three-point scales
– best results if the two end points are very opposed
• Likert scale (attitudinal scale)
– a set statements with semantic differential
– measure user’s attitude, preferences, and subjective reactions
– measure the strength of users opinion - by counting the number
of responses at each point in the scale
– typically 5-point scale: strongly disagree ! strongly agree
– calculating a numeric value (adding ‘+’ and ‘-’ scores divided
by the number of users) - can be misleading
Lora Aroyo, Web & Media Group 37
Question Scales (2/2)

38. Human-Computer Interaction Course 2015: Lecture 1
How easy was the system to use?
Easy Difficult
1 2 3 4 5 6 7
The system was easy to use
Strongly
Agree
Agree Neutral Disagree
Strongly
Disagree
Lora Aroyo, Web & Media Group 38
Semantic Differential & Likert scale

39. Human-Computer Interaction Course 2015: Lecture 1
• Avoid complicated questions
• Clear and unambiguous questions
• Avoid negative questions
• Alternate open and closed questions
• As few questions as possible (~ 2 A4)
• Additional info, e.g. “any other comments” option
• Pilot the questionnaire before giving it to users
– test whether the questions gather the need info
– decide on statistics to apply before finalizing the questionnaire
– balanced mix of closed and open questions
– balance positive and negative questions
Lora Aroyo, Web & Media Group 39
Questionnaire Tips

40. Human-Computer Interaction Course 2015: Lecture 1
Examples of Questions
Do you think this is a good interface?
fair, good, valuable, useful
Do you use mouse or keyboard more?
1 2 3 4 5
Yes No
When you used the second interface was it responding good to you?
Which of the following is not a problem in using the system?
Which of the following you are least likely to consider a favorite: drop-down
menus, adaptive menus, scrolling?
How many times a week do you use Internet?
How often do you use internet?
Do you use internet? If yes, how often?
Lora Aroyo, Web & Media Group 40

41. Human-Computer Interaction Course 2015: Lecture 1
IN SUMMARY

42. Human-Computer Interaction Course 2015: Lecture 1
Message 1:
Many of the human error and
machine misuse are design
errors
Designers help things work
with good conceptual model
Designers decide on a range
of users as the design
audience
Design is difficult!
Lora Aroyo, Web & Media Group 42

43. Human-Computer Interaction Course 2015: Lecture 1
Because users usually ….
• have lousy memory
• don’t always see
everything
• get confused of too many
things
• get tired and bored
• don’t pay attention always
• get easily distracted
Designers need to take all
this into account
Lora Aroyo, Web & Media Group 43

44. Human-Computer Interaction Course 2015: Lecture 1
… and machines will always offer more
new form factor larger memories / faster systems
miniaturization
↓ power requirements
deeply connected new display & input technologies
embedding of computation into appliances
pervasive specialize computer hardware à new functions
↑ networked + distribute computing
broadened user
base
↑ adopting of computers & access by those currently
denied
Lora Aroyo, Web & Media Group 44

45. Human-Computer Interaction Course 2015: Lecture 1
Message 2:
You are NOT the
USER if you are
DESIGNER
and you always
need different
glasses
Lora Aroyo, Web & Media Group 45

46. Human-Computer Interaction Course 2015: Lecture 1
• Design model
– conceptual model on which
the design of the system is
based
• User’s model
– model that the user
develops on the basis of
experience with the system
• System image
– all aspects of the system
that the user experiences
Lora Aroyo, Web & Media Group 46
Message 3:

47. Human-Computer Interaction Course 2015: Lecture 1
COURSE ORGANIZATION

48. Human-Computer Interaction Course 2015: Lecture 1
Rules of the game
Electronic communication
Discussion Board: questions &
discussions on course content
hci-org@few.vu.nl: admin
Before sending email check
rules on BB
Work in groups of 4
Attend Lab sessions: rules on BB
Submit Assignments: see schedule
Submit Lab exercises: end of day
Lora Aroyo, Web & Media Group 48

49. Human-Computer Interaction Course 2015: Lecture 1
Book (required)
User Interface Design &
Evaluation
Debbie Stone, Caroline Jarrett, Mark
Woodroffe, Shailey Minocha
Morgan Kaufmann, 2005. ISBN
978-0-12-088436-0
Parts available @ Google Books:
http://books.google.com/books?
id=VvSoyqPBPbMC&printsec=frontc
over&source=gbs_slider_thumb#v=
onepage&q=&f=false
Lora Aroyo, Web & Media Group 49

50. Human-Computer Interaction Course 2015: Lecture 1
HCI book structure
• Part 2: requirements
• Part 3: design
• Part 4: evaluation
Sequence is an artefact!
Lora Aroyo, Web & Media Group 50

51. Human-Computer Interaction Course 2015: Lecture 1
Additional book (optional)
How to design & Report
Experiments
by Andy Field and Graham Hole
Published by SAGE, 2003. ISBN
978-0-7619-7382-9
Lora Aroyo, Web & Media Group 51

52. Human-Computer Interaction Course 2015: Lecture 1
More books (optional)
Lora Aroyo, Web & Media Group 52

53. Human-Computer Interaction Course 2015: Lecture 1
Grading
• 60%: Assignments
• 30%: Exam
• 10% Lab exercises
– No grade for Lab exercises. 1,5
points - when the answers show that
an appropriate amount of work has
been done. 0.75 points - if the work
is poor but not altogether bad.
• To pass:
– submit solutions to all Lab exercises
– submit all assignments
– score of written exam => 5.5
– total weighted grade => 5.5
Lora Aroyo, Web & Media Group 53

54. Human-Computer Interaction Course 2015: Lecture 1
Schedule
• Schedule covers 3 weeks (!)
• 2 Lectures a week
• 2 Lab sessions a week
• Assignments: choice of
predefined domains
• Exam
• Make sure of your (group)
planning (ahead)
Lora Aroyo, Web & Media Group 54

55. Human-Computer Interaction Course 2015: Lecture 1
Enjoy the course!
Lora Aroyo, Web & Media Group 55