What is HCI

1
What is HCI?

• It is about designing computer systems that
  support people so that they can carry out their
  activities productively and safely.
• HCI is an acronym for Human-Computer Interaction.
  It concerns the design, implementation and
  testing of human-computer interfaces. The goal is
  to make computers easier to use. R. J.
  Wolfe _at_ DePaul

2
What is HCI?

• Except for special things like computer games,
  people dont use computers because they want to
  use computers. They use computers because they
  want to write papers they want to communicate
  with people they want to design bridges and so
  on. Whatever theyre doing, the computer is an
  enabling device that can help them do it.
  Terry Winograd _at_ Stanford
  University

3
Ways to measure effectiveness?

• Time to complete task.
• Percent tasks completed.
• Task failure ratio.
• Time spent on errors.
• Number of commands used not used.
• Time using help or documentation
• Percentage of unfavorable comments.

• Number of times user loses control of system
• Number of good bad comments received by user.
• Number of users who prefer your system.
• Number of workarounds required to complete a task.

4
Who shot the terminal?

• Report from the National
• Electronics Council - 1983
• The manager of a system for police
• departments reported that one day he
• received the call You terminal is dead. Come
  and get it.
• He suggested that the repair severice should be
  contacted but
• the caller insisted that he go out and visit it.
  The terminal had
• two bullet holes in it. Apparently an officer
  got Do not
• understand on the screen one time too many, so
  he stepped
• back and shot it!

5
Two Examples - Good Bad

• The Car
• Effective use of ICONS.
• Most controls are intuitive.
• Immediate response to actions.
• The VCR
• On, off, record play.
• Program to record a show at a certain day/time.
• What recording playback speed to use?

6
9 Step HCI Design Methodology

• 1. Needs Analysis
• Who is the audience
• What is market to be fulfilled
• Functionality
• 2. User and Task Analysis
• Identify characteristics of the user
• What are tasks to be done (goals not actions)
• Create a user/task table

7
9 Step HCI Design Methodology

• 3. Functional Analysis
• What services will system provide
• 4. Function Task Allocation
• What part of the task is human?
• What part performed by the computer?
• 5. Requirements Analysis
• Technology dependant.

8
9 Step HCI Design Methodology

• 6. Setting Usability Goals
• Should be quantifiable
• Task completion time, error rates, etc.
• 7. Designing the Interface
• High fidelity vs. Low fidelity prototype
• Key is user feedback.
• 8. Prototype the Interface
• 9. Evaluate the Interface w/user testing

9
Disciplines that contribute to HCI
Cognitive psychology
Social organizational psychology
Computer science
Artificial intelligence
Ergonomics human factors
HCI
Linguistics
Engineering
Philosophy
Design
Sociology
Anthropology
10
Demographics of Web Users

• 60 male, 40 female
• 50 are college graduates
• 40 are married
• Average age is 35 35 are over 40
• 18 have used the Web for lt 1 year
• 50 with income gt 25k lt 50k
• 60 access internet from home

11
Demographics of Web Users

• Almost 90 access Web daily.
• Approx. 25 use gt 20 hrs/week.
• Primary concern is with security privacy
• No. 1 problem reported is with speed of access.
  
• Source - 9th Graphics, Visualization Usability
  Centers surveys taken Oct. 98.

12
Gestalt Laws of Perceptual Organization

• Described by the Gestalt psychologists (Kofka,
  1935, Kohler, 1947)
• Believed that our ability to interpret the
  meaning of scenes and objects was based on us
  having innate laws of organization.

13
Gestalt Laws of Perceptual Organization

• Proximity Objects appear in groups rather than
  random clusters.
• Similarity Tendency of elements of the same
  shape to be seen as the same.
• Closure Missing parts of an object are filled in
  to complete it.
• Continuity Objects appear to traverse or overlap
  rather than as separated.
• Symmetry Regions bounded by symmetrical borders
  tend to be perceived as coherent figures.

14
Gestalt Laws of Perceptual Organization

• Example

15
4 Elements of Visual Structure

• Grouping
• Binds together functional units.
• Hierarchy
• Prominence of groups.
• Can use position to indicate relative importance
• Relationship
• Typical is top to bottom left to right.
• Balance
• Use symmetry to lead user.

16
Elegance Simplicity

• Elegance
• Unity
• Refinement
• Fitness
• Simplicity
• Reduction
• Regularize
• Leverage

17
Card Sorting Technique

• Exercise used for labeling and grouping.
• Put subject topics on cards.
• Ask subject to sort cards into piles.
• Ask subject to name each pile of cards.

18
Best Color CombinationsFrom Murch, Gerald, The
Effective Use of Color Displays
19
Worst Color CombinationsFrom Murch, Gerald, The
Effective Use of Color Displays
20
Automatic Cognitive Processes

• Automatic Cognitive Processes
• With practise, cognitive processes can also
  become fully automatic.
• Charactized by
• fast
• demanding minimal attention
• performed without consciousness
• Classic demonstration is the Stroop Effect

21
The Stroop Effect

• ZYP
• QLEKF
• SUWRG
• XCIDB
• WOPR
• ZYP
• QLEKF
• XCIDB
• SUWRG
• WOPR
• SUWRG
• ZYP
• XCIDB
• QLEKF

• RED
• BLACK
• YELLOW
• BLUE
• RED
• GREEN
• YELLOW
• BLACK
• BLUE
• BLACK
• RED
• YELLOW
• GREEN
• BLUE

22
High vs Low Fidelity Prototypes

• Usability Problem Identification Using Both Low-
  and High-Fidelity Prototypes
• by Robert A. Virzi, Jeffrey L. Sokolov,
  Demetrios Karis of GTE Labs
• In the later stages of user-interface testing,
  are low-fidelity prototypes as effective as
  high-fedelity prototypes in identifying usability
  problems?

23
High vs Low Fidelity Prototypes

• Constructed 2 Tests
• Encyclopedia application
• selected 20 college students
• each assigned 3 tasks
• 10 students assigned to each prototype
• Interactive Voice Response System
• selected 20 college students
• each assigned a series of tasks
• 10 students assigned to each prototype

24
High vs Low Fidelity Prototypes

• Conclusion
• Both studies showed that substantially the same
  sets of problems were found in the low- and
  high-fidelity groups.
• Both techniques uncovered the same usability
  problems for the most part, and at about the same
  level of sensitivity...

25
Ameritechs 10 Rules of Usability

• 1. Know thy user, and YOU are not thy user.
• The design should begin with a thorough
  understanding of the user and their tasks.
• 2. Consistency, consistency, consistency.
• Things that look the same should act the same.
• 3. Everyone makes mistakes, so every mistake
  should be fixable.
• The user should have feedback on what they did
  and have help in finding errors and how to
  correct them.

26
Ameritechs 10 Rules of Usability

• 4. When the tool is needed, it should be at hand.
• Information for decisions, about options, and so
  on needs to be there when needed.
• 5. Make error messages useful to the user.
• And tell them how to fix the error.
• 6. Every action should have a reaction.
• Part of this rule implies subjectively fast
  feedback.

27
Ameritechs 10 Rules of Usability

• 7. Dont overload the users buffers.
• Minimize the need to memorize information.
• 8. Keep it simple.
• 9. Make it easy to be fast.
• Repetitive processes should be simple to do.
• 10. Treat the user as manager.
• The user should always feel like they are in
  control.

28
Response Times The Three Important Limits

• The basic advice regarding response times has
  been about the same for almost 30 yrs.
• 0.1 sec. is about the limit for having the user
  feel that the system is reacting.
• 1.0 sec. is about the limit for the users flow
  of thought to stay uninterrupted.
• 10 sec. is about the limit for keeping the
  users attention focused on the dialogue.

29
HCI Questions

• For more information on this subject
• Human-Computer Interaction by Jenny Preece
• www..people-press.org
• The Pew Research Center
• www.gvu.gatech.edu/user_surveys
• Graphics, Visualization, Usability Centers
• WWW User Survey
• www.personal.umich.edu/sgupta/hermes
• University of Michigan Business School