CPSC%20414/614:%20Human-Computer%20Interaction

1

• CPSC 414/614 Human-Computer Interaction
• Andrew Duchowski
• Department of Computer Science
• Clemson University

2
Course description

• What is this course about?
• DESIGN of Computer Interface for human usability
• What will we cover?
• textbook (almost in its entirety before midterm)
• SIGCHI papers
• LOTS of reading, class interaction / discussion
• some coding

3
Course outline

• I Intro to HCI
• II Requirements (human aspects, models)
• III Design (interaction devices, elements)
• IV Evaluation (iterative design)
• design based on models of human activities
• and whats available (devices, code, toolkits)
• evaluation (does it work?)
• EXAMPLES (CHI 05 papers)

4
Key things to do in class

• Be prepared - READ assigned chapters / papers
  BEFORE coming to class - you will be graded on
  participation
• Read INTELLIGENTLY (especially papers)
• know who wrote the material (whos involved)
• know when material was written
• know where work was carried out
• what what was described (importance of contrib.)
• Keep track of research work (its on the test)
• PARTICIPATE(can be difference of letter grade)

5
Class participation

• Discuss material in class (be prepared)
• Be able to summarize work
• relate key points of work (chapter / paper)
• Be able to comment on / criticize work
• quality of work
• relevance of work (to HCI, state-of-the-art)
• Compare contrast to others contributions
• Dont let others dominate discussion
• Have one or two points to bring up
• If I dont know your name by semesters end

6
Team organization

• Book chapters and technical papers will be
  covered by students (2-person teams)
• 2-person teams presenter / discussion leader
• presenter
• summarizes chapter (overhead, PPT, WWW)
• about 20 min
• discussion leader
• provides questions on material for class
  discussion
• about 15 min
• Members switch roles

7
Chp.1 What is HCI?

• study of interaction between humans computer
• a methodology for
• modeling the human (e.g., perception, behavior)
• examining usability of computer programs,
  devices, techniques (in general doesnt have to
  be just computers, applies to anything man-made
  that humans use, e.g., cars, light switches,
  kettles, etc.)
• most imporantly HCI leads to DESIGN of interface
• past contributions physical devices (mouse,
  HMD), code (GUI toolkits, window managers)

8
Chp.1 What is HCI?

• All about design - in the context of Computer
  Science, design of interface to back-end
  program
• Interface
• graphical (GUI)
• command-line (CLI)
• web-based
• VR, etc.
• Back-end
• Operating System (O/S)
• dB
• web site
• spreadsheet
• calculator

• word processor
• air traffic control display
• flight simulator
• nuclear plant
• automobile displays
• etc.

9
Chp.1 What is HCI?

• Computer interaction
• almost ubiquitous (everywhere) chances are in
  whatever device you use, theres a chip in there
• e.g., typical day
• get up, press snooze on alarm clock (whats the
  interface on the clock?)
• drive to work (car interface)
• stop by ATM (ATM screen)
• after work, shopping (scanners at store)
• at home, eat dinner (microwave, stove)
• watch TV/DVD/VCR (various ent. devices)
• Interface design applies to all these computer
  interface is more obvious in some than in other
  examples

10
Chp.1 What is HCI?

• Why bother with interface design?
• increasing productivity
• e.g., in the workforce employees with a better
  word processor will be more productive
• safety critical systems with poor interface may
  endanger lives
• e.g., ATC, operating room, nuclear plant
• commerce a good interface may sell a product
• e.g., todays hot items MP3 players, digital
  cameras, DVD players, etc.
• Key point users shouldnt have to think (much)
  about intricacies of interface to use the tool
  (INTUITIVE INTERFACE)
• e.g., ATM walk up to it, withdraw cash (fairly
  easy to use)

11
Chp.1 What is HCI?

• What is good UI design?
• Good is subjective, isnt it? I like CLI, you
  might not
• Besides being intuitive (CLI is not), UI should
  be usable
• Usability (ISO 9241) defined as
• Satisfying (subjective)
• Effective (accuracy no errors)
• Efficient (speed fast)
• The SEE indicators are also used for evaluation

12
Chp.1 What is HCI?

• Classic principles of interface design
• visibility controls should be visible (e.g.,
  volume control on an MP3 player)
• affordance controls should map to their
  function, I.e., it should be obvious what each
  control (button, slider, etc.) does.
• controls should be intuitive, e.g., volume
  control use a vertical slider (up loud)
• feedback device should give user indication of
  its state (e.g., phone dial tone ready, busy
  signal, flashing light message or on hold)

13
Chp.1 What is HCI?

• Examples of design, visibility, affordance,
  feedback

Fig.1 salt / pepper shakers which is which?
14
Chp.1 What is HCI?

• Examples of design, visibility, affordance,
  feedback

Fig.2 which knob controls which burner?
15
Chp.1 What is HCI?

• Examples of design, visibility, affordance,
  feedback

Fig.3 can I set the freezer / fridge temperature
independently?
16
Chp.1 What is HCI?Discussion

• Can you think of examples of
• very usable systems
• not so usable systems (are there any devices that
  appear to be confusing to people)? How can they
  be improved?
• Can you think of examples of
• very usable computer programs
• not so usable computer applications? How can
  they be improved?
• ASSIGNMENT 1 collect at least 3 examples
  (pictures) of not so usable systems, e.g., can
  by anything, doesnt have to be computer program

17
Chp.1 What is HCI?

• Examples of not very usable systems
• complicated telephones
• do you use all the features (e.g., multi-party
  conf. calls, call forwarding, call-waiting,
  etc.)?
• wristwatch
• how often do you use its extended features
  (time zone, stopwatch, alarm, countdown timer,
  etc.)
• Examples of very usable systems
• scissors
• intuitive how to use, mainly because it mostly
  has just one application

18
Chp.1 What is HCI?

• Lots of other examples (some good some not so
  good) here
• http//www.baddesigns.com
• Im sure there are othersdont use the
  classics
• ambiguous doors
• stovetop controls (the ones I just showed)

19
Chp.1 What is HCI?

• When designing a computer program
• think what capabilities program should have
• how is a user going to access those functions
• More formally,
• HCI is a discipline concerned with the design,
  evaluation, and implementation of interactive
  computing systems for human use and with the
  study of major phenomena surrounding them
• NOT just the creation of user-friendly programs
• Need to understand human processes (cognition,
  perception) and interaction protocol between
  human and computer

20
Chp.1 What is HCI?

• HCI challenges
• continuous technological development, e.g.
• better / faster machines
• new languages, applications (web, internet, VR,
  multimedia, imaging, graphics, etc.)
• two concerns
• keep abrest of technology (e.g., SIGCHI)
• marry good HCI with effective use of technology
  (I.e., make sure both are good the back-end
  program works and the interface is good)

21
Chp.1 What is HCI?

• HCI Goals
• production of usable, safe, and functional
  systems
• development or improvement of systems (including
  computing systems), with respect to
• safety
• utility (functionality, what system does)
• effectiveness (is it good at what it does)
• efficiency (in case of programming, speed, memory
  utlization, etc.)
• usability (key concept in HCI make system easy
  to learn and use)
• system consider complete environment, not just
  hardware or software, but people

22
Chp.1 What is HCI?

• Underlying HCI belief people come first a
  computer is just a tool, a means to accomplish
  some task, e.g.,
• writing a paper
• communicating with friends
• designing a landscape
• preparing income taxes
• cataloging, organizaing, printing pictures
• desinging roads, bridges, airplanes, cars, etc.
• For good design, need knowledge of humans and
  technology
• often need multi-disciplinary teams (e.g., Comp.
  Sci, Psychology, IE, Arts, etc.)

23
Chp.1 What is HCI?

• Evolution of HCI
• 70s--80s psychologists interested in
  information-processing aspects of computer as
  analogy to mental processes (e.g., modeling brain
  as a computer, connectionist network, associative
  memory, etc.)
• various HCI studies testing menus (depth vs.
  breadth), usability of single-user computer
• 80s--90s examining more powerful PCs,
  workstations, communication (e.g. email),
  multimedia (e.g., imaging, visualization, data
  mining), VR (presence), group work (CSCW)

24
Chp.1 What is HCI?Evolution of HCI three
landmark systems

• Dynabook
• Alan Kay, Xerox Parc
• one of first laptops (book-sized PC)
• Star
• Xerox Parc
• desk-sized system
• high-res display, graphics, icons
• mouse mapped to 2D desktop on screen
• Apple Lisa
• based to some extent on Dynabook Star
• precursor to Macintosh
• WIMP Windows, Icons, Menus, Pointer
• introduction of desktop metaphor
• GUI, WYSIWYG word processor

25
Chp.1 What is HCI?Evolution of HCI Main
considerations

• All HCI takes place in social organizational
  context
• Application design is geared towards specific
  purposes, dividing tasks between human and
  machine
• To adapt application to human, need to know
  something about human psychological and
  physiological abilities and limitations
• human info processing limited attention, memory
• language linguistics, verbal comm.
• communication methods of, body language,
  emoticons, etc.
• interaction human-to-human, e.g., turn-taking
• ergonomics carple-tunnel syndrome, eye strain,
  fatigue,

26
Chp.1 What is HCI?Evolution of HCI Main
considerations

• To create successful computer application, need
  to know something about capabilities and
  limitations of computer
• input devices, e.g., keyboard, mouse, camera,
  microphone, sensors, etc.
• output displays, graphics, sound, etc.
• dialogue techniques, genre, style what how to
  communicate to user, e.g., state of system,
  output (visualizations, charts, numbers, etc.),
  what colors to use, animation speed, etc

27
Chp.1 What is HCI?Designing for users

• User-Centered Design
• CHIs current buzzword (used to be
  user-friendly), this is better since it
  suggests what differentiates HCI from traditional
  software engineering
• traditional (old) SE design processes
• waterfall model
• tends to leave user evaluation to the end
• result is (usually) that system works great for
  developers, not always for users
• HCI design process ITERATIVE DESIGN
• design, evaluate, repeat

28
Chp.2 Requirements gathering

• 4 components
• people
• work (the task)
• environment (physical, organizational, social)
• technology
• The HCI design process not quite as linear as
  software engineerings waterfall model
• Key differences
• user-centered design involve users as much as
  possible
• user requirements (HCI) vs. system requirements
  (SE)
• integration of multidisciplinary knowledge
• iterative design periodically check with user

29
Chp.2 Requirements gathering

• Inolving users
• decide who end user is, how product will be used,
  made, sold, marketed
• observe current user practices - leads to system
  requirements (how can current practice be
  improved?)
• can use psychological models of human, e.g.,
  follow test such concepts as Fitts Law
• include user representatives on team
• end users
• management
• marketing personnel
• graphic designers, etc.

30
Chp.2 Requirements gathering

• Incorporating interdisciplinary knowledge
• computer science (AI, graphics, O/S, dB, etc.)
• psychology
• human factors
• linguistics
• philosophy
• sociology
• anthropology

31
Chp.2 Requirements gathering some techniques

• Direct observation
• field studies
• controlled studies (in the lab)
• somewhat obtrusive, users may know theyre being
  watched/tested
• Indirect observation
• video recording
• keystroke logging
• eye tracking
• Interviewing
• questionnaires (usually subjective in nature,
  often administered for subjective evaluation)
• Likert scale (on a scale of 1-5 etc.)

32
Chp.3 Users and domain

• Identify stakeholders
• primary users (e.g., checkout person at Bi-Lo)
• secondary users (e.g., customers at Bi-Lo)
• tertiary users (e.g., Bi-Lo management,
  shareholders)
• Identify environment
• physical (noise, stress, comfort, etc.)
• social (individual, collaborative, etc.)
• cultural (note cultural differences, language,
  etc.)

33
Chp.3 Users and domain

• Usability goals
• qualitative learnability, etc., subjective
  evaluation
• quantitative measurable, e.g., performance
  (speed and accuracy) and process (eye movements)
  metrics
• Universal accessibility
• designing for the disabled, e.g., color-blind
  (computer graphics recoloring), quadrepligic
  (eye tracking eye typing)

34
Chp.3 Users and domain

• Characterizing users
• of ATMs (as in textbook)
• what is their level of banking knowledge (shallow
  or deep)
• other examples
• fridge do you need deep knowledge to operate?
• cell phones what features do people want?
• Known user groups (personas)
• early adopters
• elderly
• others?

35
Chp.3 Users and domain

• Characterizing the domain
• task analysis
• gist what expert knowledge is possessed by
  users?
• example designing for the military---complex
  domain, lots of expertise required
• Sounds difficult, e.g., as a designer, do I need
  to possess the same expertise as users?
• Doable if you think in terms of task, procedures,
  etc. What are the steps users typically make
• examples?
• doctors, x-ray radiologists, endoscope operators,
  stock brokers, military ATC operators (friend or
  foe tasks), etc.