05 Prototyping
05 Prototyping
Lecture 05
Prototyping
Overview
• Prototyping
• Conceptual design
• Concrete design
• Using scenarios
• Generating prototypes
• Construction
Introduction
• There are two aspects to design:
– the conceptual part, which
focuses on the idea of a
product
– the concrete aspect, which
focuses on the details of the
design
• The two are intertwined, and
concrete design issues will
require some consideration in
order to prototype ideas, and
prototyping ideas will lead to an
evolution of the concept.
Prototyping
• What is a prototype?
• Why prototype?
• Different kinds of prototyping
- Low fidelity
- High fidelity
• Compromises in prototyping
- Vertical
- Horizontal
• a miniature car
• Examples:
– sketches of screens, task sequences, etc.
– ‘post-it’ notes
– storyboards
– ‘Wizard-of-Oz’
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
• High-fidelity prototypes can be developed by
integrating existing hardware and software
components
• Danger that users think they have a complete
system…….see compromises
Pros and Cons
Sketching Designs
• Draw your ideas
– By hand, not by drawing program
– Paper or whiteboard
• Generate many ideas
• Design in a group
• Don’t be inhibited
about drawing
ability. Practice
simple symbols
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?
Compromises in prototyping
• All prototypes involve
compromises
• For software-based prototyping
maybe there is a slow response?
sketchy icons? 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
• Compromises in prototypes
mustn't be ignored. Product needs
engineering
Conceptual design
• A conceptual model is an
outline of what people
can do with a product and
what concepts are
needed to understand
and interact with it
• Transform user
requirements/needs into
a conceptual model
• Consider alternatives:
prototyping helps
Is there a suitable metaphor?
Interface Understand Evaluate
Do different interface
types provide insight?
• shareable, tangible, augmented
reality, etc.
Expanding the initial conceptual model
• What functions will the product perform?
- What will the product do and what will the human do
(task allocation)?
28
An experience map drawn as a timeline
Summary
Different kinds of
The final product must
prototyping are used for Prototypes answer
be engineered
different purposes and questions
appropriately
at different stages
To generate conceptual
Two aspects of design: design, consider Storyboards can be
conceptual and interface metaphors, generated from
concrete interaction types and scenarios
interface types
Card-based prototypes
can be generated from
use cases