Prototyping
1
Overview
• Prototyping
•Low-fidelity Prototyping
•High-fidelity Prototyping
• Compromises in prototyping
• Construction
Prototyping and construction
• What is a prototype?
• Why prototype?
• Different kinds of prototyping
low fidelity
high fidelity
• Compromises in prototyping
vertical
horizontal
• Construction
What is a prototype?
In other design fields a prototype is a small-scale
model:
• a miniature car
• a miniature building or town
What is a prototype?
In interaction design it can be (among other things):
• a series of screen sketches
• a storyboard, i.e. a cartoon-like series of scenes
• a Powerpoint slide show
• a video simulating the use of a system
• a lump of wood
• a cardboard mock-up
• a piece of software with limited functionality written in the
target language or in another language
Example Prototypes
6
Why prototype?
• Evaluation and feedback are central to interaction design
• Stakeholders can see, hold, interact with a prototype more
easily than a document
• Team members can communicate effectively
• You can test out ideas for yourself
• It encourages reflection: very important aspect of design
• Prototypes answer questions, and support designers in
choosing between alternatives
What to prototype?
• Technical issues
• Some unclear requirements
• Task design
• Screen layouts and information display
• Difficult, controversial, critical areas
Low-fidelity Prototyping
• Is unlike the final product, e.g. paper, cardboard
• Is quick, cheap and easily changed
• Examples:
sketches of screens, task sequences, etc
storyboards
‘Wizard-of-Oz’
Low-fidelity Prototyping
1. Sketching
2. Storyboards
3. Card-based prototypes
4. Wizard-of-Oz
Sketching
• Sketching is important to low-fidelity prototyping
• Don’t be inhibited about drawing ability. Practice
simple symbols
Storyboards
• Often used with scenarios, bringing more detail,
and a chance to role play
• It is a series of sketches showing how a user
might progress through a task using the device
• Used early in design
Card-based prototypes
• Index cards (3 X 5 inches)
• Each card represents one screen or part of
screen
• Often used in website development
‘Wizard-of-Oz’ prototyping
• The user thinks they are interacting with a computer, but a
developer is responding to output rather than the system.
• Usually done early in design to understand users’
expectations
• What is ‘wrong’ with this approach?
User
>Blurb blurb
>Do this
>Why?
‘Wizard-of-Oz’ prototyping
Advantages
• Useful if a system is expensive or demanding to implement
• Useful if difficult interaction technique demanding to
implement.
Disadvantages
• Evaluators need deep knowledge of the operation of the
system
• Difficult to evaluate systems with a large graphical interface
element
15
Low-fidelity Prototyping- example
16
High-fidelity prototyping
• Uses materials that you would expect to be in the final
product.
• Prototype looks more like the final system than a low-fidelity
version.
• For a high-fidelity software prototype common environments
include Macromedia Director, Visual Basic, and Smalltalk.
• Danger that users think they have a full system…….see
compromises
High-fidelity prototyping- example
18
low- vs. high-fidelity prototypes
Advantages Disadvantages
Lower development cost. Limited error checking.
Evaluate multiple design
Low- concepts. Limited usefulness for
fidelity Useful communication usability tests.
prototype device.
Address screen layout Navigational and flow
issues. limitations.
Complete functionality. More expensive to
High- Fully interactive. develop.
fidelity Clearly defines
prototype navigational scheme. Time-consuming to create.
Look and feel of final
product.
19
Compromises in prototyping
• All prototypes involve compromises, e.g.
• Paper prototypes clearly do not actually work
• For software-based prototyping maybe there is a slow
response? limited functionality?
• Two common types of compromise
• ‘horizontal’: provide a wide range of functions, but
with little detail
• ‘vertical’: provide a lot of detail for only a few
functions
• In developing final product, Compromises in prototypes
mustn’t be ignored.
Construction
• Taking the prototypes (or learning from them) and creating a
whole
• Two different development philosophies :
Evolutionary prototyping: evolving a prototype into the
final product. testing along the way is needed
‘Throw-away’ prototyping: prototype is discarded, and
the product built from scratch.
Summary
• Different kinds of prototyping are used for different purposes and at different
stages
• Prototypes answer questions, so prototype appropriately
• Construction: the final product must be engineered appropriately
References
1. Interaction design book 2end edition
2. http://www.tiresias.org/tools/wizard_of_oz.htm [accessed
22/04/11]