E414 PDF Eng

CASE: E-414
DATE: 05/11/12
PROTOTYPING: A QUICK INTRODUCTION
Prototypes allow you to consider and test your product or service concept (in what follows,
“product” refers to either a product or a service) quickly and at low cost. This quick introduction
elaborates on the concept and illustrates the use of prototypes in a variety of contexts.
A prototype can be comprehensive, precise manifestations of your concept, like a satellite or

airplane that could be sold as a first product. Prototypes can be as simple as one sketch focusing
on a single crucial aspect of your product concept. The Merriam-Webster dictionary provides
four standard definitions of “prototype,” all of which can serve our purposes:i
1. An original model on which something is patterned. Archetype.

2. An individual that exhibits the essential features of a later type.
3. A standard or typical example.
4. A first full-scale and usually functional form of a new type or design of a construction.
Regardless of its scope and fidelity to a final product, your prototype is an opportunity to
increase confidence in your concept and reduce its market risk. An oft-heard aphorism among
innovators is to “fail cheaply and fail quickly” – so you can accelerate your development process
toward a usable product. Prototypes enable you to do that.
PROTOTYPING BASICS
Prototyping is an iterative process. A single prototype is not likely to carry you from concept
inception to execution. Rather, you’re more likely to make and employ a series of prototypes that
help you evolve your concept.
Arar Han (MBA ’09) and Haim Mendelson, The Kleiner Perkins Caufield & Byers Professor of Electronic Business
and Commerce, and Management, prepared this case as the basis for class discussion rather than to illustrate either
effective or ineffective handling of an administrative situation.
Copyright © 2012 by the Board of Trustees of the Leland Stanford Junior University. Publically available cases are
distributed through Harvard Business Publishing at hbsp.harvard.edu and European Case Clearing House at
ecch.com, please contact them to order copies and request permission to reproduce materials. No part of this
publication may be reproduced, stored in a retrieval system, used in a spreadsheet, or transmitted in any form or by
any means –– electronic, mechanical, photocopying, recording, or otherwise –– without the permission of the
Stanford Graduate School of Business. Every effort has been made to respect copyright and to contact copyright
holders as appropriate. If you are a copyright holder and have concerns, please contact the Case Writing Office at
cwo@gsb.stanford.edu or write to Case Writing Office, Stanford Graduate School of Business, Knight Management
Center, 655 Knight Way, Stanford University, Stanford, CA 94305-5015.
This document is authorized for use only in Jessica Alzamoar's Innovación y emprendimiento 61 at ESAN - Graduate School of Business from Aug 2023 to Sep 2023.
Prototyping: A Quick Introduction E-414 p. 2
Functions and Forms
Prototypes have three main functions that help develop and communicate your concept with
users, your own team, and other external stakeholders:ii
1. To engage potential users on your concept. This will give you feedback that informs your
next steps and will help you evaluate your concept’s market potential.
2. To help you (and your team) clarify, test and evaluate your product.
3. To demonstrate your concept to stakeholders like potential investors, partners, employees,
and clients.
Prototypes fulfill these functions by addressing three main questions:
1. What is the market for your product? Does it create value for its target users? To whom and
in what ways? A primary role of prototypes is to enhance value creation and reduce market
risk.
2. Does your product work? A prototype can demonstrate the different features and
components of your product, and how well they work together.
3. What are the technical and/or market barriers to success? A prototype can help you identify
the most important issues standing in the way of your success and propel your development
process forward.
Prototypes come in many forms. They can be physical like a to-scale model of the Burj Khalifa
building in Dubai, or virtual and digital like a computer-aided design of a new handbag from
Balenciaga. Prototypes can range from comprehensive and fully integrated like the Ford Model
U concept car to one that isolates a novel aspect of the whole like a diagram of the cabin layout
on an Airbus A380. Even a sketch on a napkin can be a prototype, like the one that became
Southwest Airlines.
Whether a sketch on a napkin or a fully-functioning satellite, all prototypes vary along the
following dimensions:
 Scope: Prototypes range from full-featured representations to those that are homed in on one
or a few features.
 Resolution: They can be very detailed, like a high-resolution photograph, or crude and rough
like a grainy print.
 Risk Factor: Some prototypes test technical risks endemic to the product. Some help
mitigate market risk, or the possibility of rejection by the target user base.
Rapid Prototyping
Many development organizations practice what is called “rapid” prototyping.iii While the
particulars vary, all allow you to test, clarify, and evaluate an early version of your product
concept quickly and at low cost. Thus, they enable you to determine, before you committed
substantial human, financial and emotional resources, that you may have a solution to a problem
that’s worth solving. Most also share the following features:
 Broad scope and low resolution: Early, or rapid, prototypes tend to go broad but not deep.
 Market validation: They often focus on whether your product creates value for its intended
users rather that working out its technical challenges.
 Quick and cheap: Development organizations are constrained by time and money. So
crucially, early prototypes are made with little time and preferably with very few resources.
HOW TO BUILD AN EARLY PROTOTYPE
In keeping with the spirit of “fail cheaply and quickly,” your first prototype can be simple:
1. Drawings: These can range from freehand sketches to digital renderings. Your sketches can
be sparse, using symbols and quick captions to convey your thoughts.
2. Storyboard: A series of sketches can be combined to show how to use or experience your
concept. Sketches can be on Post-It notes, index cards, or PowerPoint slides, all of which
allow you to easily manipulate and revise your workflow.
3. Wireframe: This is a specialized storyboard that serves as the blueprint for a website or
digital application. Wireframes include the types of information, range of functions, and the
architecture and linkages of the pages within a site or an app.iv As discussed in Appendix A,
tools like Balsamiq help you prototype websites and mobile applications quickly and
cheaply.
4. Computer-Aided Design (CAD): If you require precise pictures of mechanical, engineering,
or other designs in 2D or 3D, you can use CAD software to create them. CAD software has
evolved considerably over the years, becoming more sophisticated and user-friendly.
AutoCAD is a commonly-used standard. Many, like Google Sketchup, are available for free.
5. Physical models: You can create a physical model of your product with a variety of art
supplies and other commonly found objects. The purpose of creating a physical prototype is
to allow yourself and others to interact with and test your idea.
There are many other prototyping tools available for developing an early version of your
product. Anything that quickly and cheaply models its appearance and/or functionality is
suitable.
The pursuit of perfection is the enemy of successful prototyping. You don’t even need to have a
great, detailed plan. The point of early prototyping is to spur your thoughts through action.
Below are three examples of early prototypes in use.
Physical Prototype: Reusable Swiffer Sweeper Mopping Pads
Marlene Dysert is a UPS driver who creates and sells household soft goods like scarves and
cleaning cloths as her second job. Dysert has a store on Etsy, an electronic commerce platform
that allows hobbyists to sell their handiwork through virtual stalls on Etsy.com. She recently
developed a single reusable pad that replaces Swiffer Sweeper’s one-use dry sweeping sheets
and its mopping pads. Dysert’s product is also washable and available in a variety of patterns.
For the first iteration of her prototype, Dysert was primarily interested in developing a reusable
replacement for the mopping pad only. She used a piece of terry cloth attached to a larger piece
of fabric that would hold the terry cloth in place (Exhibit 1).
Dysert then tested this prototype on her own floors and machine washed it. She was dissatisfied
with its cleaning performance, yet pleased with its durability in the wash. As noted in her blog
post about the experience: “After I finished this and the experiment, I had another brilliant idea
for the scrubby... back to the drawing board for some minor adjustments!”v
The “brilliant idea” was to improve the performance of the mopping pad by combining it with
her popular existing reusable dry sweeping sheets. The final product, as shown in Exhibit 2, has
a terry cloth cleaning surface on one side, and a dry sweeping sheet on the other side. Between
the two sides is a crucial layer of batting that bolsters both surfaces. Users can sweep with the
dry side, then flip over the reusable pad to the wet side to wash their floors.
DetroitKnitter operates a small Etsy shop with an admirable zest for iterating her prototypes. If at
first you don’t succeed, go “back to the drawing board” with your lessons from testing.
Would You Name Your own Price? Priceline
Priceline, one of today’s leading global online travel agencies, became well known for its opaque
“Name-Your-Own-Price” (NYOP) concept wherein a buyer specifies a price for a desired
service (e.g., air travel, hotel stay, or car rental) for a given day and asks sellers to match that
combination. NYOP is opaque because the buyer does not know the name of the service provider
(airline, hotel or car rental company) nor the detailed schedule until after he or she has already
made the nonrefundable purchase.
For an airline ticket purchase, for example, NYOP was designed as follows:vi
1. The customer logs on to Priceline.com.

2. The customer provides his or her email address.
3. The customer enters the requested flight origin and destination airports.
4. The customer enters the travel dates.
5. The customer enters the price her or she is willing to pay for a ticket. This is a firm bid.
6. The customer enters his or her credit card information and pre-authorizes payment.
7. Priceline displays the probability that the bid will be accepted.
8. Priceline has three days to find a qualifying fight.
9. If Priceline does not find a qualifying flight, the bid is rejected.
10. If Priceline finds a qualifying flight, Priceline buys a non-refundable ticket, charging it to the
customer’s credit card.
11. The customer is notified and receives an airline ticket.
The idea was interesting and novel. If it worked, it would create value for both consumers
looking for deals and travel suppliers with excess inventory. Its success, however, was far from
certain. A few airline partners had already signed on to provide flights, but a central question
remained:
Would consumers be willing to commit to the opaque NYOP system?
To answer this question, the Priceline team developed a prototype in the form of an online
storyboard.vii As users went through the process of bidding for a flight, a person on the other end
of the test played “computer,” putting up the next appropriate web page to simulate the user
experience. Seven people tested the prototype over two days.
The big question was answered in the affirmative: Customers intuitively understood the core
offering, and accepted the concept of a binding NYOP offer. Priceline could move forward.
However, the test also revealed three problems with the user experience that could become “deal
killers” for Priceline users: First, nobody wanted to give an email address just to enter the site.
Second, customers wanted to know that Priceline was a credible business before they were
willing to use its service. And third, nobody wanted to wait three days to find out whether or not
their bids had been accepted.
After the second day of testing, the Priceline team revamped their prototype using the feedback
they had collected. The third day’s tests further revealed that some things the team cared about
weren’t important to users. For example, Step 7 of the original design required Priceline to
estimate the probability of winning so customers could plan ahead. However, the tests showed
that people didn’t really care about seeing these probabilities.
The Priceline example illustrates several guidelines for successful prototyping:viii
 Start Building. Even if you’re not sure where exactly you are going, the act of building a
prototype will get you going. If you do know where you want to go, identify key
uncertainties and try to resolve them through testing.
 Build with the user in mind. What do you hope to test with the user? What sorts of behaviors
do you expect? Answering these questions will help focus on key issues and help you receive
meaningful feedback in the testing phase.
 Don’t spend too much time and resources on one prototype.
 Treat your prototype as a disposable model. Move on before you find yourself getting
emotionally attached to it.
It’s OK if you don’t know what exactly you’re looking for. Early on, hardly anyone does. You’re
looking to fill in your blind spots, so keep an open mind and listen to what your tests tell you.
That’s the beauty of prototyping.
Using Wireframes: RippleQ
RippleQ is a social learning platform that companies and other organizations can use to foster
long-term training initiatives and reinforce cultural behaviors. Users within organizations that
use RippleQ have profile pages that are structurally similar to Facebook profile pages.
Founder Lloyd Nimetz (Stanford MBA ’08) first prototyped RippleQ by creating a sketch of the
first page users would see after logging in. Exhibit 3 shows an early prototype. After Nimetz had
iterated through many sketches, he wanted to create a more polished prototype that could be
shown to potential advisors and investors. He first used PowerPoint (Exhibit 4), then switched to
Balsamiq (Exhibit 5), a user-friendly wireframing tool that allowed him to create a more
sophisticated version of his PowerPoint prototype (also see Appendix A).
As Nimetz iterated from prototype to prototype, he was able to refine his audience. Early on, he
targeted individuals that wanted to track socially good behaviors like recycling, carpooling, and
other earth-friendly acts. Visualizing his concept in the form of a more detailed, PowerPoint
prototype allowed Nimetz to seek the advice of advisors, who challenged him to structure his
business around organizations, rather than individuals. This required multiple linked pages and
the ability for Nimetz to collaborate with his new partner – both of which Balsamiq easily
provided.
You don’t have to use the most full-functioned wireframing tool from the start. As Nimetz’s
experience shows, starting with a rudimentary form of prototyping and moving towards greater
functionality can allow your prototypes to mature along with your concept and your intended
market.
LATER PROTOTYPES
Early prototypes are usually quick and dirty, designed to test the marketability of a product
concept and to elicit key issues. Later prototypes respond to and incorporate the feedback
gathered from earlier prototypes. They often examine specific aspects of the product and use
more intricate tools than early prototypes do. These prototypes generally fall into one of four
buckets:
1. Technical: A prototype testing a technical issue tends to be narrow in scope and high
resolution. They might take longer to develop, and require more resources to execute.
2. Work flow or integration: Some later prototypes are as broad in scope as the initial
prototype, but tend to go deeper into how the specific functions work together. This can help
plan future development of the product.
3. Layouts, displays, and placement: Another later prototype can be as broad in scope as the
first prototype, going deeper on the physical or visual placement of the product’s features and
parts.
4. Difficult, controversial, and critical parts: In the interest of reducing uncertainty and
raising the odds of success, a prototype in this bin would extract certain key aspects that can
derail a product in the marketplace.
Any of these prototypes might take the form of a “looks-like” or “works-like” type.ix Looks-like
prototypes have the appearance of a final product but do not perform its essential functions. One
example is a sports car that cannot run but approximates the visual appearance in order to test
customer feedback on the car’s aerodynamics. Works-like prototypes have the essential functions
but do not have the appearance of the final product. An example of this is an online workflow
simulation of a factory line management system.
And Beyond…
There’s a place further down in the development process for other comprehensive prototypes –
perhaps ones with more complexity and depth than your initial prototype. Such prototypes can
expose unrelated and incidental problems, and restructure task dependencies. They can allow
teams to reconceptualize and streamline, or optimize the work flow.
In all your prototyping endeavors, remember that prototypes – early, later, and beyond – help
you figure out what you don’t know so you can increase your product’s odds of success in the
market. As Carolyn Snyder, author of Paper Prototyping reminds us: “It’s not the rattlesnake
you see that will bite you. It’s inherently difficult to know where your own blind spots are…
testing helps you find them.”x
Exhibit 1
Prototype of Dysert’s Washable Swiffer Mopping Pad
Source: “Swiffer Sweeper Mopping Pad Replacements,” DetroitKnitter Blog

<http://detroitknitter.blogspot.com/2010/07/prototype-2-swiffer-sweeper-mopping-pad.html> (accessed July 15,
2011). Used with permission.
Exhibit 2
Dysert’s Final Double-Sided Swiffer Pad
Source: “3 Swiffer-Style Pads – Double Sided,” DetroitKnitter Etsy Shop <http://www.etsy.com/listing/70003325/2-

reusable-wet-jet-style-pads-tan-scroll?ref=pr_shop > (accessed July 16, 2011). Used with permission.
Exhibit 3
RippleQ Sketch Prototype
Source: RippleQ records. Used with permission.
Exhibit 4
RippleQ PowerPoint Prototype
Exhibit 5
RippleQ Balsamiq Prototype
Appendix A
Wireframing Made Simple
The advent of web- and smartphone-based applications and services has spurred rapid
development in powerful, yet simple-to-use wireframing tools. Below is a sampling of tools you
may find useful, and a brief description of how they are used.
Microsoft PowerPoint and Apple Keynote: Both are primarily used for presentations, but they
can be repurposed to create wireframes. They don’t offer the customized functionality that
wireframing software does, so it could be tedious to use these to wireframe. But on the upside,
they are easy to use, you are most likely familiar with them already, and they’ll do if you don’t
need to get very detailed.
Balsamiq is useful for prototyping websites as well as smartphone and tablet applications. It
allows teams of users to quickly iterate through prototype versions. You may download a one-
week free trial version at http://builds.balsamiq.com/b/mockups-web-demo/ and quickly learn
how to use it by following the video tutorials at http://www.youtube.com/user/Balsamiq.
Balsamiq is widely used among both professionals and amateurs. Another tool, Napkee, enables
you to quickly convert your Balsamiq mockups into functional websites. A disadvantage of
Balsamiq is that it needs to be installed on your PC (a web-based version is in beta). An
alternative web-based tool is Mockingbird <https://gomockingbird.com/>.
If you wish to develop an application for Apple’s iOS, you may consider the following:
 Mockabilly (iPhone): “lite” version is free; full version available for purchase. For all users.
 MockApp (iPhone and iPad): free to those who help publicize it (honor system). For all
users.
 Blueprint (iPhone and iPad): $15. Visit http://www.groosoft.com/2010/12/blueprint-video-
tutorial.html for video tutorials. For all users.
 OmniGraffle (Mac and iPad): Mac version is $100; iPad version is $50. For advanced users.
An important caveat on the use of mockup tools is that while the appearance and functionality of
individual web pages are important, the way the user progresses from one to another (called the
user flow) is even more important. Thus, before creating mockups of individual pages or screens,
it is useful to build a flow diagram of the application that shows how the user goes from one
screen to the next to perform a given task. The next step is to identify the most important screens
and to create mockups of those.
i
“Prototype,” Merriam-Webster <http://www.merriam-webster.com/dictionary/prototype> (accessed July 13, 2011).
ii
See, for example, Ulrich, K. T. and Eppinger, S. D. (2008). Product Design and Development, Fourth Edition.
New York: McGraw-Hill. 246-263.
iii
Jmargeru. “Rapid Prototyping Defined,” <http://www-
personal.umich.edu/~jmargeru/prototyping/rapid_definition.html> (accessed September 12, 2011).
iv
Wikipedia contributors. “Website wireframe,” Wikipedia <http://en.wikipedia.org/wiki/Website_wireframe>
(accessed July 14, 2011).
v
“Swiffer Sweeper Mopping Pad Replacements,” DetroitKnitter Blog
<http://detroitknitter.blogspot.com/2010/07/prototype-2-swiffer-sweeper-mopping-pad.html> (accessed July 15,
2011).
vi
Based on Snyder, C. (2003), Paper Prototyping, San Francisco: Morgan Kauffman, pp. 25-47, and U.S. Patent
6,249,772, U.S. Patent Office.
vii
Snyder, Op. Cit.
viii
“Bootcamp Bootleg,” Stanford d.school < http://dschool.typepad.com/files/bootcampbootleg2010v2slim-1.pdf>
(accessed July 13, 2011). 2010. 34.
ix
Ulrich and Eppinger, Op. Cit. p. 247.
x
Snyder, Op. Cit. p. 47.

E414 PDF Eng

Uploaded by

Document Information

Original Title

Copyright

Available Formats

Share this document

Share or Embed Document

Sharing Options

Did you find this document useful?

Is this content inappropriate?

Copyright:

Available Formats

E414 PDF Eng

Uploaded by

Copyright:

Available Formats

CASE: E-414

PROTOTYPING: A QUICK INTRODUCTION

A prototype can be comprehensive, precise manifestations of your concept, like a satellite or

1. An original model on which something is patterned. Archetype.

Functions and Forms

Prototypes fulfill these functions by addressing three main questions:

HOW TO BUILD AN EARLY PROTOTYPE

Below are three examples of early prototypes in use.

Physical Prototype: Reusable Swiffer Sweeper Mopping Pads

Would You Name Your own Price? Priceline

1. The customer logs on to Priceline.com.

Would consumers be willing to commit to the opaque NYOP system?

The Priceline example illustrates several guidelines for successful prototyping:viii

Using Wireframes: RippleQ

Source: “Swiffer Sweeper Mopping Pad Replacements,” DetroitKnitter Blog

Source: “3 Swiffer-Style Pads – Double Sided,” DetroitKnitter Etsy Shop <http://www.etsy.com/listing/70003325/2-

Source: RippleQ records. Used with permission.

Source: RippleQ records. Used with permission.

Source: RippleQ records. Used with permission.

You might also like