CS305, HCI in Software Development (formerly Usability Engineering)

1
CS305, HCI in Software Development(formerly
Usability Engineering)

• Course Introduction
• Fall 2008

2
There must be a problem because
3
Whats the Course About?

• In one sentence
• Human-computer interaction (HCI) and
  user-centered design in the context of SW
  engineering
• Note the target audience
• Students who may be involved in SW development
• HCI is important to others HW designers and
  engineers, Web designers, psychologists, etc.
• But CS305 targets SW development

4
What is HCI?

• More soon
• Human-Computer interface
• Where people meet or come together with
  machines or computer-based systems
• Physical interface (e.g. buttons, screens, menus,
  etc.)
• Logical interface
• The model a system presents a user
• Set of tasks available and how theyre organized

5
From the SIGCHI Website

• HCI is
• An inter-disciplinary discipline (engineering,
  CS, psychology, graphic design, ergonomics, etc.)
• Concerned with design, evaluation, and
  implementation
• Addresses peoples needs, capabilities,
  limitations

6
SIGCHI curriculum definition site

• Human-computer interaction 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.

7
What is an interface?

• ?

8
Evolution of HCI interfaces

• 50s - Interface at the hardware level for
  engineers - switch panels
• 60-70s - interface at the programming level -
  COBOL, FORTRAN
• 70-90s - Interface at the terminal level -
  command languages
• 80s - Interface at the interaction dialogue level
  - GUIs, multimedia
• 90s - Interface at the work setting - networked
  systems, groupware
• 00s - Interface becomes pervasive
• RF tags, Bluetooth technology, mobile devices,
  consumer electronics, interactive screens,
  embedded technology, information appliances

9
HCI Wide Range of Concerns

• Make an interactive system be useful for a task,
  and support that task effectively
• Easy to use, easy to learn, avoid errors
• Must understand users, understand users tasks
• Create a usable logical interface
• A users conceptual model of the system
• Overall design of how we interact
• Physical and low-level design
• Physical interface buttons, keys, screens
• SW interface menus, screens, colors
• Evaluating usability
• During development, after completion

10
High-level Terms

• HCI, CHI
• Usability
• User-centered Design
• An approach to design (SW, Web, other) that
  involves the user a great deal, in many phases
• Interaction Design (ID)
• Something different than HCI? Maybe.
• Our current textbook is an an ID text

11
Usability

• A definition from ISO standard 9241
• The extent to which a product can be used by
  specified users to achieve specified goals with
  effectiveness, efficiency and satisfaction in a
  specified context of use.
• Effectiveness
• accuracy and completeness in achieving goals
• Efficiency
• resources expended
• Satisfaction
• comfort, acceptability (happiness, pleasure)

12
Discussion

• Effectiveness, efficiency and satisfaction
• Are all of these equally important?
• All the time?

13
(No Transcript)
14
What is User-Centered Design?

• An approach to UI development and system
  development.
• Focuses on understanding
• Users, and
• Their goals and tasks, and
• The environment (physical, organizational,
  social)
• Pay attention to these throughout development

15
ISO on User-centered Design

• ISO 13407 describes human-centered design
  processes for interactive systems
• Principles of human-centered design
• Active involvement of users
• Appropriate allocation of function between user
  and system
• Iteration of design solutions
• Multidisciplinary design teams

16
ISO on User-centered Design (2)

• Essential activities in human-centered design
• Understand and specify the context of use
• Specify the user and organizational requirements
• Produce design solutions (prototypes)
• Evaluate designs with users against requirements

17
Are You Experienced? (in UC Design, I mean)

• Think about a significantly complex software
  project youve been involved in
• Work, research, CS340, etc.
• Did it seem like an example of user-centered
  design?
• How did it, or how did it not?

18
(No Transcript)
19
What is interaction design?

• Designing interactive products to support people
  in their everyday and working lives
• Sharp, Rogers and Preece (2002)
• The design of spaces for human communication and
  interaction
• Winograd (1997)

20
Goals of interaction design

• Develop usable products
• Usability means easy to learn, effective to use
  and provide an enjoyable experience
• Involve users in the design process

21
Unclear about what ID is?

• Not surprising!
• Well read
• What is Interaction Design and What Does It Mean
  to Information Designers? by Craig Marion
• http//www.chesco.com/cmarion/PCD/WhatIsInteracti
  onDesign.html
• and
• From Computing Machinery to Interaction Design by
  Terry Winograd
• http//hci.stanford.edu/7Ewinograd/acm97.html

22
From HCI to Interaction Design

• Human-computer interaction (HCI) isconcerned
  with the design, evaluation and implementation of
  interactive computing systems for human use and
  with the study of major phenomena surrounding
  them (ACM SIGCHI, 1992, p.6)
• Interaction design (ID) is the design of
  spaces for human communication and interaction
  (Winograd, 1997)
• One distinction more application areas, more
  technologies and more issues to consider when
  designing interfaces

23
Relationship between ID, HCI and other fields
Academic disciplines (e.g. computer
science, psychology)
Design practices (e.g. graphic design)
Interaction Design
Interdisciplinary fields (e.g HCI, CSCW)
24
Relationship between ID, HCI and other fields

• Academic disciplines contributing to ID
• Psychology
• Social Sciences
• Computing Sciences
• Engineering
• Ergonomics
• Informatics

25
Relationship between ID, HCI and other fields

• Design practices contributing to ID
• Graphic design
• Product design
• Artist-design
• Industrial design
• Film industry

26
Relationship between ID, HCI and other fields

• Interdisciplinary fields that do interaction
  design
• HCI
• Human Factors
• Cognitive Engineering
• Cognitive Ergonomics
• Computer Supported Co-operative Work
• Information Systems

27
What do professionals do in the HCI or ID
business?

• interaction designers - ??
• usability engineers - ??
• web designers (we know this one!)
• information architects - ??
• user experience designers - ??

28
What do professionals do in the HCI or ID
business?

• interaction designers - people involved in the
  design of all the interactive aspects of a
  product
• usability engineers - people who focus on
  evaluating products, using usability methods and
  principles
• web designers - people who develop and create the
  visual design of websites, such as layouts
• information architects - people who come up with
  ideas of how to plan and structure interactive
  products
• user experience designers - people who do all the
  above but who may also carry out field studies to
  inform the design of products

29
Reminder What is involved in the process of
UC/ID design

• Identify needs and establish requirements
• Develop alternative designs
• Build interactive prototypes that can be
  communicated and assessed
• Evaluate what is being built throughout the
  process(This is what youll do this semester!)

30
Class Activity

• Think-Pair-Share
• Pairs write down differences
• Pairs merge results
• Instructor calls on pairs to share answers
• Question
• Think about a hard-to-use software product (or
  computer-based system).
• In what way does it have poor usability?
• General problems
• Specific examples

31
Bad Interfaces, Fall 08
32
(No Transcript)
33
Bad Interfaces, Spr 08

• SMOK
• Zooming hard, not intuitive
• Do it too much, overlap, too much scrolling
• Sometimes right-click, other times do something
  else
• Some commands buried
• Default when adding component bad, things
  overlap,
• Things you need to find not labeled well
• Too much zooming, search to find things
• Add tings and file is lost
• Components/things easily deleted by mistake
• Failed to always load file correctly
• Demands advance planning, otherwise hard to
  change things later
• Hard to distinguish arrows between components
  where there are many

34
Excel

• Copy and paste from Word puts stuff in just one
  cell
• Hard to change details in graphs
• Wizard great, but hard to see how to customize
• 2D graphs
• Print formatting
• Steep learning curve
• Hard for beginners needing advanced features
• Click on cell, selects all, and you may delete it
  when you mean to edit it
• Formulas hard to follow which cells are
  referenced
• Floating point accuracy

35
Fake iPod

• Different buttons are used to select at different
  times
• Mistake takes you back to beginning instead of
  back one
• Cant define order of songs when playing

36
ISIS

• Type in year/semester use odd format
• Could default to logical semester
• Doesnt have all info in it to be good
• Need COD which isnt there
• Waitlist isnt well integrated
• Availability closed at certain times (?)
• Cant press enter to login in, must click
• Also, tab order isnt logical
• Must return back to main menu always, even when
  theres a logical other window you want to do
• Cant use Backspace/Back to go back
• Close window causes it to chide you
• Audit have this request/wait/return option
• Seems unfriendly, unresponsive
• Timer period too short since you have to use gt1
  system
• Refresh -- F5 logs you out

37
Examples of non-usable systems

• Krogers self-checkout
• Use of the scale is confusing, not enough room
  for stuff
• Slow scanners, not as efficient as youd hope
• Slow to scan/place/wait, so takes longer
• Default fix is get cashier, no other
  suggestions
• Poor error recovery
• Why cant I swipe student ID? Didnt check if
  you were a student once
• Ableton-Live or similar recording/audio software
• doesnt look like standard Windows program, so
  hard to find GUI controls
• might look cool but makes it less efficient

38

• Games that used keyboard commands only and used
  card-board cut-out
• Chem151 HW checker program
• Cant backtrack in the steps you have to do
• Crashes a lot
• Didnt accept numeric answers missing x.0
• No feedback on why
• UVas Webmail
• Ugly to look at, not pleasing
• hard to keep mail organized in folders
• Must explicitly copy and move
• Slow
• Useless spam filter
• Must log into webmail/toolkit even when youve
  logged into a machine
• Filters out mail headers / not clear you can
  control this
• Indents messages in a thread, but if too deep you
  dont see enough of the message

39

• Mathcad
• hard to learn at first
• hard to keep track of variable / whole thing
  fails because of one small error / not good at
  explaining source of errors
• use of arrow-keys vs. space-bar to move things in
  an equation
• expected arrow keys to work
• 4 different versions of the equals-sign / hard
  to distinguish on the screen
• new version cant read files from other versions
• hard to remember after not using it for a while
  (lots of tricks needed, hard to remember)

40

• ISIS
• pops up a window, pop-up blocker problems
• cant use browsers back button
• gives course instructor number instead of name
• must enter schedule-number instead of clicking on
  course ID and number
• Must use semester as a code, and if you get this
  wrong its confusing whats wrong
• Interface has pictures/images for links, not the
  conventional under-lined links
• not integrated into COD, so must copy info over
  from COD to ISIS
• Kicks you off too quickly
• Too often overloaded, too many users
• Unavailability at certain hours / dont know when
  its unavailable / status not visible easily
• Links on main page are too similar
• SSN number use

41
(No Transcript)
42
(No Transcript)
43
Spring 06 Examples of non-usable systems

• Eclipse
• Hard learning curve, bad for beginners
• Too many windows, confusing layout, too much
  going on (advanced options)
• Mathcad
• Interface not intuitive
• Not monkey-proof (lets you make mistakes that
  crash it, make it unstable)
• Saving didnt always work well
• Mouse scrolling caused program to crash

44

• Main UVa website
• Cluttered, too much stuff
• Random, not organized
• Things you need small, hard to find must search
  for
• User-base
• Grad school application sites
• Multiple systems, not standard
• Important info not clear, not consistent
  (deadlines)
• Geometers Sketchpad
• Hard to figure out how to use (sit down, cant
  figure out what to do). Need to read instruction
  book. Bad help

45

• AOL IM
• Flashing movies, ads
• Opens up another window
• Unwanted info, windows, distracting
• Adds buddies to your buddy list (cant remove)
• vi
• Not intuitive, need instructions
• Simple function but needlessly complex

46
ISIS

• ISIS
• Have to type in year, semester (no drop downs).
  Cryptic input, better output
• Must enter course number
• Hit back, closes windows, must log-in again
• Boots you off for no reason. Doesnt handle
  heavy loads well.
• Must disable popup blocker.
• Not available at night. Data not current.
• Doesnt integrate with COD well.
• Inputs dont match outputs.
• Wont let you drop below 15 credits. Get stuck.

47
End of lecture 1