HCI Design

1
HCI -- Design

• Human-Centered Design
• Mental Models
• Design advice

2
History of HCI -- Bad Attitudes

• Stage 1
• Users are exclusively programmers
• Catering to programmer needs is weak
• Wastes resources
• People who make mistakes should be smarter
• However Mistakes are inevitable!
• Allowing easy error recovery is cost efficient

3
Bad Design Attitudes

• Reflected in other engineering areas
• Car safety
• Good drivers dont have accidents
• Since accidents are the drivers fault, dont
  reward bad drivers
• Dont design for safety
• Design for the impossibly perfect user

4
Evolution of Bad Attitudes

• Stage 2
• Write the application first
• Add the UI later
• Stage 3
• Users are other than programmers
• The End User

5
Not-so-Bad Attitudes

• Stage 4
• Design UI and application together
• The central concern is
• What can the user understand
• Avoid Technocentrism
• Eg. Audience chooses ending to a story

6
Mental Models

• Mental models are not always right
• Two Classes
• Functional model
• Press the accelerator once, then turn the key
• Structural model
• Press the accelerator to engage the automatic
  choke on a carburetor

7
Another example...

• Functional model
• Go east on Ponce, turn left just after Harrys
  in a Hurry, then go to the third set of lights
• Structural model
• Go to Virginia Highland (with map)

8
Another example...

• Functional model
• Go east on Ponce, turn left just after Harrys
  in a Hurry, then go to the third set of lights
• Structural model
• Go to Virginia Highland (with map)

9
User-Centered Design

• User-centered design process
• Analysis of user needs
• Prototype
• Informal feedback
• Iterate on design
• Final application
• Formal feedback

10
Analysis of User Needs

• Techniques
• Surveys
• Card-sorting tasks
• Interviews
• Focus groups
• Look at competing products
• Ethnography
• Participant observation

11
Prototyping

• Storyboards
• Paper simulations of application
• Wizard of Oz experiment
• Prototyping tools
• Cheap!

12
Informal Feedback

• Present prototype to users
• Do a quick questionnaire
• Observe the user struggle with your lousy design

13
Iterate on Design

• Redesign system
• in light of initial user impressions
• pay attention to common complaints
• Be prepared to abandon bad ideas!!
• Its just an idea, not a measure of your worth!

14
Iterate on Design

• Let me reiterate
• Be prepared to...
• Abandon bad ideas!!
• Its just an idea, not a measure of your worth!

15

• Abandon bad ideas!

16
Final Stages

• Implement the product
• Get formal feedback
• You now have something concrete to show
• Performance analysis
• Testing
• Look for bugs
• Attention to detail
• Good UI work is really picky

17
Final Stages

• Playtesting
• 100s of testers working for months
• Full-time job
• Looking to tune the games playability
• Single-player scenarios
• Somewhat subjective
• Culturally laden

18
Design fixation

• Keep an open mind
• Dont get wedded to an idea
• Dont let design review become about whose idea
  wins
• Honor the truth. People come first.

19
Quotable Quotes Practice

• The secret to having good ideas is to have many
  ideas -- Bill Buxton
• Youve got 100,000 bad drawings inside you.
  Youre here at art school to get them out. --
  Chuck Jones
• Design takes practice!!

20
Quotable Quotes

• Where principle is put to work, not as a
  recipe or as a formula, there will always be
  style -- Le Corbusier
• Every curve and line has to have real meaning
  it cant be arbitrary. -- Frank Lloyd Wright