Week 5 Prototyping Flashcards
What is a Prototype?
A model of an imagined
entity
It be can be a variety
of things:
* A series of screen sketches
* A storyboard (i.e., comic-like scenes)
* A wireframe
* A piece of software with limited functionality
* A cardboard mock-up
Why Should We Prototype?
Help elicit user feedback
Refine requirements and answer
questions
Help choose between alternatives
Encourages reflection
Allows evaluation/testing of
ideas
Facilitates communication with
stakeholders and team
members
Save time and money!
Prototype Fidelity? What are they
Low, Medium, High
Low-Fidelity Prototype (Sketches)
Uses a medium which is
unlike the final medium
(e.g., paper, cardboard).
* Quick
* Cheap
* Easily changed
Examples:
* Sketches of screens
* Task sequences, etc.
* ‘Post-it” note storyboards
Medium-Fidelity Prototype (Wireframe)
Most commonly used
* Still black and white, but supports different shades of grey
High-Fidelity Prototype
Used at the advanced stages of the product design cycle
* Provides more realistic look and feel of the final product
* May contain actual contents (e.g., images, logo, etc.) and interactions found in the actual
product
* More appropriate to get user feedback
* Ideal for representing complex concepts such as menus or interactive maps
* Contains clickable controls responsive to user interactions
* Appropriate to validate complex interactions in usability testing
- Serves as a starting point for the development process
- May be created on device templates
- Used to communicate design decisions to the development team and/or clients
High-Fidelity Prototyping – Characteristics and Shortcomings
Uses materials expected in
the final product
Aesthetic - more like the
final system
Danger that users think they
have a full system
Danger that users do not
imagine other possibilities
Type of Prototypes ? (NOT FIDELITY)
Storyboard
Cardboard
Wizard of Oz
Storyboards
Definition
* A series of sketches showing how a user might
progress through a task using the device
Focus
* User’s interaction with the device
in their environment/context
Stage of use
* Used early in the design
Storyboards: Components
Persona
Scenario
Visuals
Caption
Why Use Storyboards
Visualize an idea
Explore and design the UX
To understand which features are
needed and which are redundant
Empathize with users by visualizing
their workflows
To introduce a new product to
stakeholders
Storyboard Creation: Steps
Collect data, Decide level of fidelity, Define persona & scenarios, Plan out the panels, Add visuals and captions, Distribute and iterate
Compromise in Prototyping
All prototypes involve
compromises
Two common types of
compromises:
* Horizontal: Broad but shallow (only top level)
* Vertical: Deep but narrow (few functions)
Horizonal vs. vertical prototypes
- Horizontal: Provide a wide range of
functions, but with little detail - Vertical: In-depth functionality of a
few selected features
