Co.Design

Wanna Create A Great Product? Fail Early, Fail Fast, Fail Often

Prototyping is underutilized in product development. And you don't need specialized knowledge to develop them.

On the morning of December 17, 1903, Orville and Wilbur Wright eyed another chance at getting their flying machine off the ground. The brothers and five other men lugged their 600-pound machine over a quarter mile uphill and placed it on a 60-foot monorail. They had done the same thing three days earlier but crashed, breaking several parts in their flying prototype.

This day was different. Undeterred by their failure a mere 72 hours ago, the flying machine made its way down the monorail and picked up speed. Wilbur ran along the side of the plane, steadying the wing. As the machine left the ground, a camera shutter opened, capturing one the most inspiring moments in human history. Twelve seconds and 120 feet later, what was previously impossible was now a reality.

That day, the Wright brothers finally arrived at an ultimate success, but the path was filled with disappointing detours and a daunting string of failures. Innovation and failure go hand in hand.

Fearing failure stifles creativity and progress. If you're not failing, you're not going to innovate. Do your product or service a favor: embrace failure and blueprint a plan that affords you the opportunity to do it early and often. Prototyping can help you do just that.

If you're not failing, you're not going to innovate.

Get Your Point Across

Rapid prototyping is the process of quickly building the main feature paths of an interface. One of the largest benefits of prototypes is that they provide an easy way to get your idea in front of potential end-users and key client stakeholders. Getting the idea out of the designer's head and into a demonstrable format is an effective process for eliminating initial shortcomings and misplaced design assumptions.

And let's face it: In the world of interface design, image exports and slide decks are not the most effective way to convey an idea. Even for a system with just a modest amount of complexity, static visual renderings represent a decidedly small sampling of the entire solution. Including quick prototyping in the design process will not only help communicate your ideas but allow you to harness one of the virtues of creating something truly innovative: failure.

In tandem with design explorations, rapid prototyping is a cyclical and iterative process. The basic cycle allows for testing and refining of the product or service early and often: ideate, prototype, test, analyze, refine, and repeat. The key understanding in adapting a design process to an iterative one is that failure must be expected and embraced. This process also creates opportunity to remedy those failures early on — and more efficiently.

The Good News

Prototyping can occur at any phase in the design process and doesn't necessarily require specialized development knowledge. Deciding what and how to mock up depends on what the product's or service's needs are, the questions to be answered, and the level of technical resources available. That said, effective results can be garnered from various levels of fidelity.

Rapid-Prototyping

1. Low-Fidelity Prototyping
Starting the prototyping process at the pencil-and-paper level is the least expensive and fastest way to visualize and iterate design ideas. It give's a designer's idea physical expression almost immediately — with no specialized technical knowledge required.

Good low-fidelity prototypes can be far more valuable for conveying interfaces than simply showing general content placement and page structure. Hand-drawn screens can be very effective at communicating page flow and missing UI elements.

When designing the NCAA March Madness On Demand iPhone app, Method designers used a series of simple interface sketches to create an application walk-through. These sketches were then imported to a slide deck in Keynote, which provided a clear demonstration of important parts of the system screen flow to key stakeholders. Failures, in the form of missing states and interface elements, were uncovered and easily remedied during this process.

2. Medium-Fidelity Prototyping
Often executed as wireframes, medium-fidelity prototypes are intended to highlight only the most macro-aesthetic details of an interface's content and design. Usually rendered in black and white or grayscale only, prototyping at this level can provide meaningful insights into the information architecture, screen flows, and high-level interaction points. Additionally, when showing a working wireframe prototype to an end-user or stakeholder, a design team can effectively evaluate how efficiently the design allows users to achieve their goals.

Medium-fidelity prototyping can be effective in conveying a visual representation of an idea in the very early stages of the product lifecycle. When creating prototypes at this level, know exactly what you want to test, then develop just enough interface detail to gather meaningful results that will inform necessary refinements.

Perhaps the most beneficial aspect of prototyping at this level is that it provides a quick entry point to baseline user testing. We recently used a wireframe-level prototype at Method to validate navigation structures and taxonomy for a very brand-centric e-commerce system. With just a few hours of commitment, we were able to gather meaningful data from real users. Medium-fidelity prototypes are perfect for high-level testing in areas such as navigational elements, screen flows, and basic content presentation.

3. High-Fidelity Prototyping
High-fidelity prototypes are intended to portray the end vision for the interface and usually include realistic content, refined interactions, transitions, and animated effects. Prototyping in high-fidelity is clearly the most time-consuming way to prototype, but it goes a long way in usability testing and design presentations.

Because they show design directions as well as the interactive interface experience, high-fidelity prototypes have an important role in defining a vision for a product or service that executives can clearly visualize.

Highly polished prototypes can easily be mistaken for the final product. When creating the prototype, resist the urge to pack in as many features as possible. Remain focused and ensure that the general concept is being clearly conveyed. Gear your efforts toward the most-used features. Try to demonstrate one-third of the interface, at most.

Prototype

High-fidelity prototypes can take a variety of forms: They can be coded as working HTML, CSS, and Javascript interfaces, or they can manifest themselves as non-interactive motion studies. Choose the technique that best tells your solution's 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 for Web-enabled televisions. Method's designers and technologists worked together closely to create a fully animated, true-to-life prototype that allowed user testing of key service features and history states. The prototype was easily shared and demonstrated through a Web browser and, ultimately, proved instrumental in validating a number of visual and user-experience design decisions and creating a successful service.

Maintain Your Focus
Successful prototyping requires restraint and a deep understanding of the requirements and technical specifications, and how to process feedback. Essential to this is an acknowledgement that, in order to be nimble, prototypes often need only focus on the portions of the interface the user will use most often. The prototype will not be exact or perfect, because it is not the end product; it is simply the expression of an idea and the means by which to test and validate that idea.

A technical understanding of the system's limitations is critical to creating a successful product. While the desktop or mobile browser is a really great way to show prototypes, it does not always reflect the end platform the product was intended and designed for. If a product prototype is for a Web-enabled TV or set-top box software, the limitations of the product's platform must not be forgotten. A mobile browser's processing capabilities may be superior to today's Web-TV or set-top box and, therefore, not an accurate system to prototype on.

Feedback must be interpreted with focus. Not all feedback is good.

Once a successful 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 for bad ideas to be killed off and the good ideas to be iterated. It's natural selection for interface design. Feedback must be interpreted and implemented with precision and focus. Not all feedback is good. Like any design presentation, seeking feedback on a prototype is best kept to small groups. As feedback comes in, the scope of the project must be monitored to maintain focus on parsing the feedback within the areas that were set out to test.

Creating something innovative is indeed a risky undertaking. To do it, you have to crash often before you are able to fly. The inventor James Dyson crashed 5,127 times before perfecting his bagless vacuum cleaner. Although he eventually got it right, there was no singular defining "aha" moment. Dyson's process is an extreme example, to be sure, but his feelings on failure ring to true to any healthy, iterative design process: "On the road to invention, failures are just problems that have yet to be solved." Rather than shy away from failure, prototype and use what you learn to your product's advantage.

This is the tenth piece in the 10x10 series by the innovation firm Method. Read more from the series here.

Add New Comment

3 Comments

  • magicbeans Incubator

    This is a really excellent article. The underlining motivational tone drives home this excellent outline on how to succeed! Magic Beans approves!