of 7
8/3/2019 Method 10x10 Pro to Typing
1/7
8/3/2019 Method 10x10 Pro to Typing
2/7
Prototyping: The Wright Way to Fail Jeremy Jackson, Lead Technologist
10x10Method, Inc.
Lookfor
Failure
and
IteratefromP
rototype
s
Embracing Failure
On the morning o December 17, 1903, Orville and Wilbur
Wright eyed another chance at getting their ying machine
o the ground. The brothers and fve other men humped their
600-pound machine over a quarter mile uphill and placed it
on a 60-oot monorail. They had done the same thing three
days earlier but crashed, breaking several parts in their ying
prototype.
This day was dierent. Undeterred by their ailure a mere 72
hours ago, the ying machine made its way down the monorail
and picked up speed. Wilbur ran along the side o the plane,
steadying the wing. As the machine let the ground, a camera
shutter opened, capturing one o the most inspiring moments
in human history. Twelve seconds and 120 eet later, what was
previously impossible was now a reality.
That day, the Wright brothers fnally arrived at an ultimate suc-
cess, but the path was flled with disappointing detours and a
daunting string o ailures. Innovation and ailure go hand
in hand.
Fearing ailure sties creativity and progress. I youre not ailing,
youre not going to innovate. Do your product or service a avor:
embrace ailure and blueprint a plan that aords you the oppor-
tunity to do it early and oten. Rapid prototyping can help you
do just that.
01 02 03 04 05
01
Communicate ideas more clearly with
prototyping
02
Low fdelity prototypes, such as
pen and paper sketches, help get ideas
across
03
Prototyping, like design, is a cyclical
and iterative process. Test and refne
the prototype
04
Look or weaknesses and remedy
ailures early on
05
Iteration o the process leads to
a successul, innovative solution
8/3/2019 Method 10x10 Pro to Typing
3/7
Prototyping: The Wright Way to Fail Jeremy Jackson, Lead Technologist
10x10Method, Inc.
Get Your Point Across
Lets ace it: in the world o interace design, image exports
and slide decks are not the most eective way to convey an
idea. Even or a system with just a modest amount o complexity,
static visual renderings represent a decidedly small sampling
o the entire solution. Instead, adapting the design process to
include rapid prototyping will not only help communicate your
ideas, but allow you to harness one o the virtues o creating
something truly innovative: ailure.
Rapid prototyping is the process o quickly building the main
eature paths o an interace. One o the largest benefts o
prototypes is that they provide an easy way to get your idea in
ront o potential end-users and key client stakeholders. Getting
the idea out o the designers head and into a demonstrable
ormat is an eective process or eliminating initial short-
comings and misplaced design assumptions.
In tandem with design explorations, rapid prototyping is a
cyclical and iterative process. The basic cycle allows or testing
and refnement o the product or service early and oten: ideate,
prototype, test, analyze, refne, and repeat. The key under-
standing in adapting a design process into an iterative one
is that ailure must be expected and embraced. This process
also creates opportunity to remedy those ailures early on and
more efciently.
The Good News
Prototyping can occur at any phase in the design process
and doesnt necessarily require specialized development
knowledge. Deciding what and how to prototype depends on
what the product or services needs are, the questions to be
answered, and the level o technical resources available. That
said, eective results can be garnered rom various levels o
fdelity level that can be chosen to prototype in.
Low-Fidelity Prototyping
Starting the prototyping process at the pencil and paper level
is the least expensive and astest way to visualize and iterate
on design ideas. It requires no specialized technical knowledge,
but allows or translation o an idea out o a designers head
and into the physical world almost immediately.
Good low-fdelity prototypes can be ar more valuable orconveying interaces than simply showing general content
placement and page structure. Hand drawn screens can
be very eective or communicating page ow and missing
UI elements.
When designing the NCAA March Madness On Demand
iPhone app, Method designers used a series o simple interace
sketches to create an application walk-through. These sketches
were then imported to a slide deck in Keynote, which provided
a clear demonstration o important parts o the system screen
ow to key stakeholders. Failures in the orm o missing states,
and interace elements were uncovered and easily remedied
during this process.
T
homasEdison
Inventor,Scientist
8/3/2019 Method 10x10 Pro to Typing
4/7
Prototyping: The Wright Way to Fail Jeremy Jackson, Lead Technologist
10x10Method, Inc.
Medium-Fidelity Prototyping
Oten executed as wirerames, medium-fdelity prototypes
are intended to highlight only the most macro-aesthetic details
o an interaces content and design. Usually executed in black
and white or grayscale only, prototyping at this level can provide
meaningul insights on the inormation architecture, screen ows,
and high-level interaction points. Additionally, when showing
a working wirerame prototype to an end-user or stakeholder,
a design team can eectively evaluate how efciently the design
allows users to achieve their goals.
Medium-fdelity prototyping can be eective in conveying a
visual representation o an idea to stakeholders in the very early
stages o the product liecycle. When creating prototypes at this
level, know exactly what you want to test. Then, develop just
enough interace detail to gather meaningul results, which will
inorm necessary refnements.
Perhaps the most benefcial aspect o prototyping at this level
is that it provides a quick entry point to baseline user-testing.
We recently used a wirerame-level prototype at Method to
validate navigation structures and taxonomy or a very brand-
centric e-commerce system. With just a ew hours o commit-
ment, we were able to gather meaningul data rom real users.
Medium-fdelity prototypes are perect or high-level testing
in areas such as navigational elements, screen ows and basic
content presentation.
High-Fidelity Prototyping
High-fdelity prototypes are intended to portray the end-visionor the interace and usually include realistic content, refned
interactions, transitions, and animated eects. Prototyping in
high-fdelity is clearly the most time consuming way to proto-
type, but goes a long way in usability testing and design
presentations.
Because they show design directions as well as the interactive
interace experience, high-fdelity prototypes have an important
role in defning a vision or a product or service that executivescan clearly visualize.
Working prototypes with a high level o fnish can easily be
mistaken or the fnal product. When creating the prototype,
resist the urge to pack in as many eatures as possible. Remain
ocused and ensure that the general idea or your product is
being clearly conveyed. Gear your eorts toward the most used
eatures. Try to demonstrate one third o the interace, at most.
High-fdelity prototypes can take a variety o orms. They can
be coded as working HTML, CSS and Javascript interaces, or
they can maniest themselves as non-interactive motion studies.
Choose the technique that best tells your solutions story and
allows to you test any weaknesses in the system.
Thumbplay, a cloud-based streaming music service, partnered
with Method to design their next generation app or web-
enabled televisions. Working in close collaboration, Methods
designers and technologists create a ully animated, true-to-lie
prototype which allowed exploration o key service eatures and
history states. The prototype was easily shared and demon-
strated through a web browser, which was used or user testing
and or Thumbplays stakeholders to see the service come
to lie. This demonstration proved instrumental in validating
a number o visual and user experience design decisions that
were made throughout the design process, and in creating
a successul service.
Factors to consider when prototyping
01 02 03
Be selective. Dont prototype every eature.
In most systems, ocusing your prototypes
on the 20-30% o the application where the
user will spend the majority o the time is
generally sufcient to thoroughly test your idea.
Rapid prototyping should be, well, rapid.
Work quickly and dont necessarily worry
about getting everything just exactly perect.
The aster you can express your ideas, the
more time youll have to identiy ailures and
rework them.
Prototypes dont need to live on.
Dont waste time creating production-level code.
The goal is to express an idea, no more. Ideally,
not all o the ideas you test will work. Thats
the point. Prototyping gives you the opportunity
to validate the good ideas and move on quickly
rom the bad ones.
8/3/2019 Method 10x10 Pro to Typing
5/7
Prototyping: The Wright Way to Fail Jeremy Jackson, Lead Technologist
10x10Method, Inc.
Maintain Focus
Successul prototyping requires restraint and a deep under-
standing o the requirements, technical specifcations, and how
to process eedback. Core to this is an acknowledgement that,
in order to be nimble, prototypes oten only need to ocus on
the portions o the interace where the user will spend themajority o their time. It must be accepted that the prototype will
not be exact or perect because it is not the end product. The
prototype is simply the expression o an idea and the means
by which to test and validate that idea.
A technical understanding o the systems limitations is critical
to creating a successul product. While the desktop or mobile
browser is a really great way to show prototypes, it does not
always reect the reality o the end platorm the product was
intended and designed or. I a product prototype is or a web
enabled TV or set-top box sotware, the limitations o the
products platorm must not be orgotten. A mobile browsers
processing capabilities may be superior to todays web-TV
or set-top box, and thereore not an accurate system toprototype on.
Once a successul prototype has been created, the compelling
process to evolving the product or service can begin. At this
point, the idea can be tested, quickly allowing or bad ideas
to be killed o and the good ideas to be iterated on. Its natural
selection or interace design. Feedback must be interpreted
and implemented with precision and ocus. Not all eedback
is good. Like any design presentation, seeking eedback on a
prototype is best kept in small groups. As eedback comes in,
the scope o the project must be monitored to maintain ocus on
parsing the eedback within the areas that were set out to test.
Creating something innovative is indeed a risky undertaking. To
do it, you have to crash oten beore you are able to y. Famed
inventor o the Dyson vacuum, James Dyson crashed requently
over the 15 years it took or him to crat 5,127 prototypes o
his bagless vacuum cleaner. Although he eventually got it right,
there was no singular defning ah-ha moment.
Dysons is an extreme example to be sure, but his eelings
on ailure ring true to any healthy, iterative design process:
On the road to invention, ailures are just problems that have yet
to be solved.1 Rather than shy away rom ailure, prototype and
use what you learn to your products advantage.
1
No Innovators Dilemma Here: In Praise o Failure
by James Dyson http://www.wired.com/epicenter/2011/04/in-praise-o-ailure
Interpret
Feedback
and
ValidateIdeas
8/3/2019 Method 10x10 Pro to Typing
6/7
Method, Inc.
Learning to Play the Game
By Adam Dole, Design Researcher
Cables Lost Generation
Unlocking the Infnite Library
Entertain Me Now
Place, Space and the Mobile Interace
Mind the Gap
Parenting 101
The Consumer as King(pin)
Wrap It, Pack It, and Stack It
Power to the People
Welcome to the Metaverse
About the Author
need text
About 10x10
2010 marks Methods 10 year anniver-
sary, and we are only looking orward.
Written by our own industry leaders, we
are launching the 10x10 series, which will
ocus on game changing topics that will
undamentally impact todays brands and
their search or new revenue streams.
1
2
3
4
5
6
7
8
9
10
10x10
Thisisthe
TenthIssue
next
BrandsasPatterns
Rapid Prototyping
By Jeremy Jackson
Lead Technologist
About the Author
Jeremy is a Lead Technologist at Method.
His areas o expertise are in ront-end tech-
nologies, where he crats lean, accessible,
and refned custom interaces. With nearly
a decade o experience, he has created many
prototypes and successul products or a
variety o brands, most recently or Comcast
and Time Warner Cable.
About 10x10
2010 marks Methods 10 year anniversary,
and we are only looking orward. Written by
our own industry leaders, we are launching
the 10x10 series, which will ocus on game-
changing topics that will undamentally
impact todays brands and their search or
new revenue streams.
10
1
2
3
4
5
6
7
8
9
10
11
10x10
Cables Lost Generation
Unlocking the Infnite Library
Entertain Me Now
Place, Space and the Mobile Interace
Gaming or Behavior Change
Changing Retail Currency
Lets Get Physical (with Services)
Innovation: Wrapped, Packed and Stacked
Whats So Funny About Innovation?
Rapid Prototyping
Brands as Patterns
8/3/2019 Method 10x10 Pro to Typing
7/7
Method
About Method
Method is a brand experience agency with ofcesbased in San Francisco, New York and London. Our
clients are best described as owners o progressive,
era-defning brands, and include Google, Comcast,
Nordstrom, Sony, Samsung, Nokia, Microsot, Time
Warner, Intel, and BBC. Collaboratively, we help them
create products, services and businesses that are
smart, beautiul and extendable.
For more inormation visit www.method.com.
Locations
San Francisco
New York
London
Contact
Lindsay Liu
Marketing Manager
646.825.5242
10x10
method.com