CMSC434 Week 09 | Lecture 17 | Oct 29, 2013 Design Critiques · by students of interaction design...
Transcript of CMSC434 Week 09 | Lecture 17 | Oct 29, 2013 Design Critiques · by students of interaction design...
Human Computer Interaction Laboratory
@jonfroehlich Assistant Professor Computer Science
CMSC434 Introduction to Human-Computer Interaction
Week 09 | Lecture 17 | Oct 29, 2013
Design Critiques
Hall of Fame Hall of Shame
Today
1. Midterm
2. Schedule
3. TA05 – Paper Prototyping & User Testing
4. Discuss Prototyping Readings
5. Lecture: prototyping
midterm the
schedule the
TA05 paper prototypes & user testing
PaperPrototypes
[Nielsen Norman Group, http://www.nngroup.com/reports/prototyping/]
Evaluating Mobile Devices
readings the
1. There is a strong focus on paper in this class. Do you think this
focus is misplaced? Do you think we should switch over to digital
tools for sketching and early lo-fidelity prototypes?
2. In your opinion, what are 2-3 main advantages of lo-fidelity
prototyping and 2-3 main disadvantages of lo-fidelity
prototyping?
3. What prototyping technique did you think was most interesting
from the readings? Why?
Reading Response Discussion
AnExperiment Design an egg drop vessel
[Dow, 2011]
prototyping fidelity
Pixar, Monsters, Inc., Progression Reel, http://youtu.be/9W6mArB7Ps8
What did you notice?
Pixar, Monsters, Inc., Progression Reel, http://youtu.be/9W6mArB7Ps8
What did you notice?
Pixar, Monsters, Inc., Progression Reel, http://youtu.be/9W6mArB7Ps8
What did you notice?
Pixar, Monsters, Inc., Progression Reel, http://youtu.be/9W6mArB7Ps8
Interactive
Prototyping (Keynote, PowerPoint,
Balsamiq)
Paper
Sketches Wireframing
(Visio, Omnigraffle)
Interactive
Prototyping 2 (Flash, MS Blend) Code
PrototypingProcess
PrototypingSpectrum
Paper
Sketches
Interactive
Prototyping (Keynote, PowerPoint,
Balsamiq)
Interactive
Prototyping 2
(Flash, MS
Blend)
Interactive
Prototyping (Keynote, PowerPoint,
Balsamiq)
Paper
Sketches Wireframing
(Visio, Omnigraffle)
Interactive
Prototyping 2 (Flash, MS Blend) Code
PrototypingProcess
User
Testing
User
Testing
User
Testing
User
Testing User
Testing
[http://www.smashingmagazine.com/2010/06/16/design-better-faster-with-rapid-prototyping/]
ChoosingFidelity
[http://www.smashingmagazine.com/2010/06/16/design-better-faster-with-rapid-prototyping/]
VisualFidelity
[http://www.smashingmagazine.com/2010/06/16/design-better-faster-with-rapid-prototyping/]
Look and feel are the most
noticeable dimension of a prototype’s
fidelity and, if not properly selected,
can sidetrack prototype reviews. Go
hi-fi too soon and users will focus on
visual design, which is not
appropriate in early stages.
PrototypingNintendo
FunctionalFidelity
[http://www.smashingmagazine.com/2010/06/16/design-better-faster-with-rapid-prototyping/]
Does the prototype reveal how the
solution will work (static) or does it
appear to be fully functional and
respond to user input (interactive)?
ContentFidelity
[http://www.smashingmagazine.com/2010/06/16/design-better-faster-with-rapid-prototyping/]
Displaying content? Early on, just
squiggly lines, then maybe dummy
text (though this can distract), then
actual content.
prototyping examples
The role of prototyping in some famous HCI artifacts
[Moggridge, Designing Interactions, 2006]
Bill Atkinson Apple Engineer (1978-1990)
Prototyping Apple Lisa
[Moggridge, Designing Interactions, 2006]
Bill Atkinson Discussing the Apple Lisa UI Design Process, Moggridge, Designing Interactions, 2006
The Palm Pilot Started by Jeff Hawkins, 1996
Prototyping
The Palm Pilot
Jeff Hawkins Discussing the Palm Pilot Prototyping Process, Moggridge, Designing Interactions, 2006
combining paper and video for a new form of prototyping
Higher fidelity version of a video prototype from my class (Spring 2012)
Proactive Parent, CMSC434 Sp2012
wizard of
Wizard of Oz MGM Studios, 1939 based on L. Frank Baum story
Their approach was as ingenious as it was simple
and effective… Using the Wizard of Oz Technique, they were able to leap more than 20 years ahead
in the technology curve, and collect real user
experience data! And, they were able to do so in a
matter of weeks, without writing any substantive
code.
Bill Buxton Principal Researcher at Microsoft Research
One of the more influential figures in IxD Quote from: Buxton, Sketching User Experiences, 2007, p. 243
Their approach was as ingenious as it was simple
and effective… Using the Wizard of Oz Technique, they were able to leap more than 20 years ahead
in the technology curve, and collect real user
experience data! And, they were able to do so in a
matter of weeks, without writing any substantive
code. This paper is a classic, and should be studied
by students of interaction design the same way that
art students study the classics of the renaissance.
Bill Buxton Principal Researcher at Microsoft Research
One of the more influential figures in IxD Quote from: Buxton, Sketching User Experiences, 2007, p. 243
SketchWizard Davis et al., UIST 2007