Transcript 3750 Spring 2014 Intro

CS/Psych 3750
Human Computer Interaction
Jim Foley
[email protected]
Andy Pruett
[email protected]
This material has been developed by Georgia Tech HCI faculty, and continues to evolve.
Contributors include Gregory Abowd, Jim Foley, Elizabeth Mynatt, Jeff Pierce, Colin Potts,
Chris Shaw, John Stasko, and Bruce Walker. Comments directed to [email protected]
are encouraged. Permission is granted to use with acknowledgement for non-profit
purposes. Last revision: January 2012.
Agenda for Today
•
•
•
•
Introductions
Course Information
Project Information
Homework
CS/PSYC 3750/6750
2
Introductions - Jim Foley
•
•
•
•
Founded GVU Center @ GT in 1991
Industry and consulting and education
Direct MS-HCI
Research Interests
 HCI - now focused on technology in education
 Information Visualization
 Computer Graphics (four books, no more!)
• Office hours
 I’m available a lot – almost always after class down the hall
 No one ever comes to my office in TSRB 355
 Arrange other times via email; [email protected]
• Something about me …..
3
4
5
Introductions - Andy Pruett
MS-HCI ‘14
BS CS, Physics. UGA
Half Dome at
Yosemite
National Park
Summer Intern at
Ebay
Interests in InfoVis,
Agile, Natural-UI
I collect vinyl records,
electric guitars, and
coffee makers.
[email protected]
Course Goals
• Learn a four-step process for designing, prototyping
and testing user-computer interfaces
• Learn theories, principles and methods relevant to
the four steps
 How to understand users and their needs
 Principles involved in designing useful and usable usercomputer interfaces.
 UI styles and technologies
 Human perceptual and cognitive capabilities and how they
apply to UI design
 Critique UIs in the context of user goals and objectives
CS/PSYC 3750/6750
7
Course Topics
•
•
•
•
•
•
•
Requirements Gathering
Human abilities
Design
Prototyping
Evaluation (without users)
Evaluation (with users)
Dialog & interaction styles
CS/PSYC 3750/6750
8
Prerequisites
• At least your degree program’s first
programming course
• More is better
CS/PSYC 3750/6750
9
Textbooks
• Interaction Design – beyond humancomputer interaction, Third Edition, by
Preece, Rogers and Sharp. Wiley, 2011.
• The Design of Everyday Things, by Donald
Norman. Currency/Doubleday.
 Any edition OK; new one preferred
CS/PSYC 3750/6750
10
Course Information
• Grading






Test 1
Test 2
Test 3
Homework
Pop Quizzes
Group project (4 parts)
12%
12%
12%
20%
4%
40%
– 10% per part
• Attendance and participation
 Expected
CS/PSYC 3750/6750
11
Policies
• No late homework accepted without
documented personal issues (serious illness,
family emergency, etc.)
 Late = 0
• HWs done individually
• Group projects are the work of your group alone
 Talk to others for feedback; look at other systems for
ideas; group synthesizes an original design
• Review the Georgia Tech Academic Honor Code
 http://www.deanofstudents.gatech.edu/Honor/
CS/PSYC 3750/6750
12
Web Site
• T-Square for turn-ins and grades
• Wordpress for assignments, schedule,
class notes
 http://6750hcidesigngeorgiatech.wordpress.com/
CS/PSYC 3750/6750
13
And we’re off!
• What is the User Interface?





Is
Is
Is
Is
Is
it
it
it
it
it
the screen layout?
the documentation?
the interaction devices and techniques?
what the application does?
the help system?
CS/PSYC 3750/6750
14
And we’re off!
• What is the User Interface?





Is
Is
Is
Is
Is
it
it
it
it
it
the screen layout?
the documentation?
the interaction devices and techniques?
what the application does?
the help system?
• It is ALL of the above, and more..
 UX
CS/PSYC 3750/6750
15
UI Not Just Web and Apps
• Lots of other examples, such as
 http://www.youtube.com/watch?v=o4zSWaoEREM
• How many computationally-enabled
devices are in your home?
CS/PSYC 3750/6750
16
Goals of HCI
• Allow users to carry out tasks




Safely (Three-mile Island, ATC)
Effectively
Efficiently
Enjoyably
• Bottom line
 Lives or dollars or intangibles
CS/PSYC 3750/6750
17
What is difference between
• User-friendly interfaces
and
• Programmer-friendly interfaces?
CS/PSYC 3750/6750
18
Famous Quotations
“It is easy to make things hard. It is hard to
make things easy.” (Al Chapanis, 1982)
“Learning to use a computer system is like
learning to use a parachute – if a person fails
on the first try, odds are he won’t try again.”
(anonymous)
“Pay Now or Pay Later. ” J. Foley
CS/PSYC 3750/6750
19
How Does UI Design Fit in Overall
Software Development Process?
• UI design MUST start at beginning
 Do NOT wait ‘til the end
 Good UI can not be pasted on top of poorly-designed
functionality
• Integrate UI design methods, techniques and
knowledge into standard software development
methodologies
• Good paper “How To Get Amazing Software Out
The Door Fast” from Macadamian
 To retrieve, Google “How To Get Amazing Software
Out The Door Fast”
CS/PSYC 3750/6750
20
The Evolving Role of HCI
• In the early days: Please evaluate our user interface and
make it easy to use
• The early enlightenment: Please help us design this user
interface so that it is easy to use
• The age of reason: Please help us find what the users
really need so that we know how to design this user
interface
• The VC dream: Look at this area of life and find us
something interesting
Panu Korhonen as reported by Liam Bannon “Reimagining
HCI: Toward a More Human-Centered Perspective,”
ACM Interactions, July+August 2011
CS/PSYC 3750/6750
21
Where Does Steve Fit in?
CS/PSYC 3750/6750
22
Where Does Steve Fit In?
• …when a reporter asked Jobs how much market
research Apple had done before introducing the
iPad, he responded, “None. It isn’t the consumers’
job to know what they want.”
– http://www.nytimes.com/2011/10/07/opinion/the-man-whoinspired-jobs.html?emc=eta1
• “It is in Apple’s DNA that technology alone is not
enough—it’s technology married with liberal arts,
married with the humanities, that yields us the
results that make our heart sing.”
– http://www.newyorker.com/online/blogs/newsdesk/2011/10/
steve-jobs-pixar.html#ixzz1aINBFKjx
CS/PSYC 3750/6750
23
Quiz – True or False
• Focus of User Experience (UX) design is usability
– being able to get something done without too
much effort
• You are like your users
• People always use your system the way you
imagined they would.
• People can tell you what they want
• Icons always enhance usability
• Design is about making a user interface look
good
CS/PSYC 3750/6750
24
UI Design / Develop Process
• User-Centered Design
If you are Steve 
 Analyze (or imagine) user’s goals &
tasks
 Create design alternatives
 Evaluate options (fail early, fail often)
 Implement prototype
 Test
 Refine
 IMPLEMENT THE REAL SYSTEM
 Be prepared for further iterative
refinement
• This is NOT the classic waterfall
development process!!!!!
CS/PSYC 3750/6750
25
Know Thy Users!
•
•
•
•
Physical & cognitive abilities & special needs
Personality & culture
Knowledge & skills
Motivation
• Two Fatal Mistakes:
 Assume all users are alike
 Assume all users are like you
You Are Here
– Please leave your ego at the door
CS/PSYC 3750/6750
26
Design Evaluation
• “Looks good to me” is not good enough!
• Both subjective and objective metrics
• We can measure





Time to learn
Speed of performance
Rate of errors by user
Retention over time
Subjective satisfaction
CS/PSYC 3750/6750
27
Characteristics of Great UIs?
CS/PSYC 3750/6750
28
Characteristics of Great UIs?
1.
2.
3.
4.
5.
Aaa
Bbb
Ccc
Ddd
Etc
CS/PSYC 3750/6750
29
And now – more about that
project
CS/PSYC 3750/6750
30
Some Past Projects
• Basektball scorekeeper
• Pool tournament
manager
• Movie selector
• Manage tasks in shared
apartment
• Manage wine cellar
• Improved parking meter
• Improved MARTA ticket
dispenser
• Fast food self-service
ordering kiosk
• Tablet menu ordering
• Baby book
builder/advisor
• Diabetes
monitoring/insulin
injector
• Google glass app for
police
• Fitness tracker / game
• Home resource usage /
competition
CS/PSYC 3750/6750
31
More Projects
• Diabetes test & meal
planning
• Smart cupboard - food,
menus, recipes,
preferences
• Improved class scheduling
system
• Google Glass XXX
• Smart Phone App for XXX
• Integrated social network
manager
• Personal medical record
manager
• PDA/GPS for about town to
locate places
• Metro trip planner
• Kiosk for homeless to find
resources
• Group picture
share/organizer
• Backpackers planning kiosk
at camp sites
More Project Ideas
•
Project could be front-end of a Convergence Innovation Competition entry
for this spring – for more ideas and info, see

•
•
•
•
•
•
•
•
•
http://cic.gatech.edu/spring-2014/
Automobile navigator
Improved cell phone UI
Wardrobe planner
Teacher-parent communicator
Tourist guide
Vacation planner
Menu planning / grocery list creation
Shopping list creator and store guide
Calendar agent (speech)
CS/PSYC 3750/6750
33
Project Groups
• 4 people
 Self-forming but MUST be diverse w/r to
– Skills, gender, major
 Group formation facilitated in next few
classes
CS/PSYC 3750/6750
34
Project Structure
• Design and evaluate an interface





0
1
2
3
4
-
Team formation & topic choice
Understand the problem
Design alternatives
Prototype & evaluation plan
Evaluation
• Parts 1-4 count 10% each
CS/PSYC 3750/6750
35
Project Details
• Part 0 - Topic definition
 Identify team & topic, create web notebook
• Part 1 - Understanding the problem
 Describe tasks, users, environment, social
context
CS/PSYC 3750/6750
36
Project Details
• Part 2 - Design alternatives
 Storyboards, mock-ups for multiple different designs
 Poster session 1-3pm (combined with a 3750 section)
• Part 3 - System prototype & eval plan
 Semi-working interface functionality - enough to
evaluate
 Plan for conducting evaluation
 In-class walkthrough
CS/PSYC 3750/6750
37
Project Details
• Part 4
 Conduct evaluation with typical users
 Characterize pros and cons of the UI
 Fix the easy to fix UI problems
• Present results to class
 Last few class meetings
 PPts plus demo
CS/PSYC 3750/6750
38
Project FAQs:
• Do all teams work on same project? NO, each team works on
project of interest to them. Several teams may tackle the same
general issue, coming up with different approaches.
• Can we pre-form a team or partial team? YES, but with caveat. No
team can have all CS majors. No team can have more than one
member who is neither CS nor CM.
• Do you do peer reviews on project participation. YES, AND I DO
ADJUST GRADES BASED ON PEER FEEDBACK.
• Can we get extra credit for doing a back-end to our system? NO,
emphasis is on project stages – how well you do each. Building the
prototype is just one of four steps, and there emphasis is on UI
quality, not overall functionality.
CS/PSYC 3750/6750
39
Coming up
• Wednesday – sit where you expect to sit
for rest of semester
 Name in big letters on folded paper tent
 Helps me associate names and faces :-)
• Be on look-out for really good or really
bad Uis - Hall of Fame / Hall of Shame
• Don’t forget HW0 – be ready with 30second “elevator pitch”
CS/PSYC 3750/6750
40
CS/PSYC 3750/6750
41
User Expectations (1)
Some users expect the computer-based
system to be just like the old system….
CS/PSYC 3750/6750
42
User Expectations (2)
Other users expect the system to work
magic…..
CS/PSYC 3750/6750
43