View
217
Download
0
Category
Preview:
Citation preview
CS147 - Terry Winograd - 1
Lecture 2 – User-oriented Design
Nundu JanakiRamCS147 - Introduction to Human-Computer
Interaction DesignComputer Science Department
Stanford UniversityAutumn 2005-2006
(Slides adapted from Prof. Winograd and Ron Yeh)
CS147 - Terry Winograd - 2
Learning Goals for Today
• Have an overview of the Interaction Design process in general and the specific way it will be applied in this course
• Have a broad understanding of what “Design” means for this course
• Learn a first level of detail about the steps we will be employing in the project
• Understand how users can be involved in the design process
• See some examples of design projects
CS147 - Terry Winograd - 3
User Centered Design
• Users’ tasks and goals are the driving force behind development
• Users are consulted throughout development
• All design decisions are taken from within the context of the users, their work, and their environment
CS147 - Terry Winograd - 4
What is Design (Kelley)
• Not just problem solving – Creative leap• Messy – No right answer• Takes a point of view – or many• Calls for vision and multiple minds• Open attitude – many solutions• Learned from experience with reflection• Requires a feel for the materials• Starts with broadening, followed by
narrowing• Requires ongoing mindfulness
CS147 - Terry Winograd - 5
Design phases (IDEO)
• Understand• Observe• Visualize and Predict• Evaluate and Refine• Implement
CS147 - Terry Winograd - 6
Simple Iterative Model
• Modified from p. 186 in Interaction Design
NEEDS
DESIGN
IMPLEMENTEVALUATE
CS147 - Terry Winograd - 7
Needs Analysis
NEEDS
DESIGN
IMPLEMENTEVALUATE
CS147 - Terry Winograd - 8
Contextual Inquiry
• Users and stakeholders• Context• At the interviewee’s workplace• Partnership• Designer is apprentice to
Interviewee• Can be guided by interviewee
CS147 - Terry Winograd - 9
Contextual Interviews
• Interpretation and elicitation of needs
• Observations must be interpreted by observer and interviewee
• Focus• Short• Inquire about work behaviors• Intention is to design a new system• Focus on design goals
CS147 - Terry Winograd - 10
Capturing the Data
• Observer’s head• Written notes• Sketches and photos of the setting• Audio (or even Video)
CS147 - Terry Winograd - 11
Idea Generation
NEEDS
DESIGN
IMPLEMENTEVALUATE
CS147 - Terry Winograd - 12
Brainstorming
• Group vs. Individual Creativity• More Ideas == More Creative ==
Better• Limited Time• Keep a Record
• Brainstorm in Section next week! Brainstorming is not just a good idea but an inexhaustible source of inspiration and fresh thinking (IDEO)
CS147 - Terry Winograd - 13
The Rules According to IDEO
• Be Visual. • Defer judgment. • Encourage Wild Ideas. • Build on the Ideas of Others. • Go for Quantity. • One Conversation at a Time. • Stay Focused on the Topic.
CS147 - Terry Winograd - 14
Exploring Design Ideas
NEEDS
DESIGN
IMPLEMENTEVALUATE
CS147 - Terry Winograd - 15
Sketches
From a previous cs147 project…
CS147 - Terry Winograd - 16
Storyboards
http://www.storyboards-east.com/sb_dismoi.htm
CS147 - Terry Winograd - 17
Storyboards
CS147 - Terry Winograd - 18
Storyboards
CS147 - Terry Winograd - 19
Flipbook
CS147 - Terry Winograd - 20
Flipbook
CS147 - Terry Winograd - 21
Flow Diagrams
From a previous cs147 project…
CS147 - Terry Winograd - 22
Woah Nelly…!
• Sketches, Storyboards, Flipbooks, Diagrams
• What’s the Difference?• When to use them?• Why to use them?• Who’s the audience?• Deliverable: Storyboard only• But, try as many as you can
CS147 - Terry Winograd - 23
Prototyping
NEEDS
DESIGN
IMPLEMENTEVALUATE
CS147 - Terry Winograd - 24
Using Prototypes
• Allows multiple parties to envision together– Designers– Users– Engineering, marketing, planning,…..
• Reflective conversation with the materials
• Focus for identifying alternatives and tradeoffs
CS147 - Terry Winograd - 25
Low-Fidelity “Paper” Prototype
NEEDS
DESIGN
IMPLEMENTEVALUATE
CS147 - Terry Winograd - 26
Tools
• Paper, Cardboard, Transparencies• Tape, Glue, Rubber Cement• Pens, Pencils, Markers• Scissors• Plastic Tubes, Paper Cups, CD
“Coasters”• Anything that you can buy in an
arts and crafts store (and that a kindergartener would have fun using).
CS147 - Terry Winograd - 27
Examples: Low-Fidelity Prototype
CS147 - Terry Winograd - 28
Examples: Low-Fidelity Prototype
http://www.mindspring.com/~bryce_g/projects/lo_fi.html
CS147 - Terry Winograd - 29
Examples: Low-Fidelity Prototype
http://bmrc.berkeley.edu/courseware/cs160/fall99/projects/t4/body/low-fi/
CS147 - Terry Winograd - 30
User Testing
NEEDS
DESIGN
IMPLEMENTEVALUATE
CS147 - Terry Winograd - 31
Tools
• 3-4 group members• Greeter/Facilitator• Computer (not necessary for low-fi
testing)• 2 Observers/Note takers• Prototype• Users!!!!
CS147 - Terry Winograd - 32
User Testing
http://www.cs.waikato.ac.nz/usability/facilities.html
http://www.itl.nist.gov/iad/gallery.html
CS147 - Terry Winograd - 33
High Fidelity “Interactive” Prototype
NEEDS
DESIGN
IMPLEMENTEVALUATE
CS147 - Terry Winograd - 34
Tools
• HTML & Javascript• Java JFC/Swing• Visual C++, Visual Basic• Flash MX, Director• Mac Interface Builder• others…or a mix of the above!!!
CS147 - Terry Winograd - 35
Examples: Interactive Prototype
From cs160 at UC Berkeley
CS147 - Terry Winograd - 36
Examples: Interactive Prototype
From cs247a at Stanford University
CS147 - Terry Winograd - 37
Examples: Interactive Prototype
From cs160 at UC Berkeley
CS147 - Terry Winograd - 38
Examples of Projects
• Visual Voicemail• Interactive Academic Planner• Suzie Q• ToneDeaf Revolution
CS147 - Terry Winograd - 39
Appendix
Details on each of the data gathering techniques
CS147 - Terry Winograd - 40
Getting Users Involved
NEEDS
DESIGN
IMPLEMENTEVALUATE USE
CS147 - Terry Winograd - 41
Stages of User Involvement
• Need finding• Design [Participatory design]• Implementation [End-user
programming]• Evaluation• Use in the target setting
Users can be involved in any of the stages of the Design Process!
CS147 - Terry Winograd - 42
An Overview of Data Gathering Techniques
• Questionnaires• Interviews• Focus groups• Observation
– Naturalistic (ethnography)– Controlled (laboratory)
• Studying documentation (artifacts)
(See the appendix for details of these techniques)
CS147 - Terry Winograd - 43
Questionnaires
• Qualitative vs. quantitative data• Motivation to complete – Response
rate• Uses of on-line questionnaires• Good for demographics, evaluation of
specific features or properties• Design of Scales
– Precision– Effort needed to decide on a response
See the detailed questionnaire guidelines in the text
CS147 - Terry Winograd - 44
Likert Scales and Semantic Differentials
How easy was the system to use?Easy Difficult 1 2 3 4 5 6 7
The system was easy to use
How did you feel about the ease of using the system?
How easy was the system to use?Easy___________________________________Difficult
StronglyAgree Agree Neutral Disagree Strongly
Disagree
CS147 - Terry Winograd - 45
Interviews
• Degrees of structuring for different purposes– Structured - Like a guided questionnaire– Semi-structured - Basic script guides the
conversation– Open-ended - Still has a goal and focus
• Phone or face-to-face• Develop trust
– Be sensitive to the setting– Explain your goals to the interviewee
See the detailed interviewing guidelines in the text
CS147 - Terry Winograd - 46
Focus groups
• Group Interviews– Can be 2 or more
• Try to work with representatives of intended users
• Try to bring out differences• Require expert facilitation
CS147 - Terry Winograd - 47
Naturalistic observation
• “Quick-and-dirty”• Participant observation (ethnography)
– Insider-outsider spectrum
• User camera studies• Diaries and pager studies• Audio/video recording• Walkthroughs
Many ethical issues are involved and it is important to have full user understanding and agreement to what you are doing
CS147 - Terry Winograd - 48
Insights from ethnography
• The importance of setting– Intuit “Follow me home” technique
• Seeing what is invisible to inhabitants– What they say vs. what they do
• Making explicit the observer’s bias– What you take for granted can blind you
• The Heisenberg principle– Observation changes what is being
observed
CS147 - Terry Winograd - 49
Observational Data Gathering
• Notes• Camera• Audio• Video
– Good for presentations, hard to analyze
– It’s the AUDIO, stupid.• Diaries
– User diaries• Logs
CS147 - Terry Winograd - 50
Controlled observation
• Laboratory settings and tasks• Techniques for understanding what
the user is doing– Walkthroughs– Think-aloud– Paired-think-aloud
More to come when we talk about testing
CS147 - Terry Winograd - 51
Studying documentation (artifacts)
• Official documentation/description• Physical and digital artifacts in the
environment
CS147 - Terry Winograd - 52
Data Gathering Guidelines
• Set clear goals for the data collection– Focus on identifying the stakeholders’ needs
• Involve all the stakeholder groups• Evaluate cost/benefit for your effort
– Understand the tradeoffs– Use a combination of techniques
– Balance specific goals and openness• Support data-gathering with appropriate
props• Run a pilot trial • Record well – you won’t remember it well
Recommended