Designing the prototyping process
Webflow Design Director David Hoang on seeing failure as a learning opportunity
You’ve gathered all your research, combed through the insights, and now you’re ready to start prototyping your idea. It’s an exciting, if slightly daunting, phase of the design process. David Hoang, Design Director at Webflow, knows this all too well.
What makes David’s approach to prototyping so well-rounded is that, prior to working at Webflow, he was designing in-person experiences (a.k.a. service delivery) at One Medical. That experience became foundational to his overall design philosophy.
“I often say system design before design systems, because when you make decisions, everything's system design,” he says.
For David, it’s just as important to intentionally design a system for how you prototype and not just dive headfirst into creating the prototype itself. Here are some of his tips.
What’s in a prototype?
“Prototyping is a capability, not necessarily a tool,” says David. Certain factors — like the size of your team and how people will give feedback or experience the prototype — will affect your overall prototyping experience and the types of insights and responses you get back.
All of these things should be taken into account when you think about your process and what can potentially influence your decisions. However there are some universal truths to approaching the prototyping phase:
- Get immediate feedback. You want to be learning as often and quickly as possible. David says to start with “the lowest fidelity that you can begin building function around something.”
- Understand what your team can say ‘no’ to. Constraints are the mother of invention, so make sure everyone’s on the same page about the requirements and limitations.
- De-risk design decisions. Learn to frame up the context for your designs to get better feedback and develop some business acumen so you can better communicate with stakeholders outside of the design team.
If you’re a startup with a team of just a few people, you probably don’t need to sweat over having too many design tools. David advises that, as with all scrappy teams, use the tools you have at hand — even ones simple as slide decks and storyboards — to get the flow of your designs across.
For larger teams, many hands can make for complex work. By standardizing your prototyping process and your tool set for prototyping ahead of time, David says it can make larger teams operate much more efficiently. It also allows them to iterate more often, which is really the ultimate goal of this phase in the design process.
Designing your team’s prototyping process
You can usually get yourself a barebones sketch that marks point A to point B, but there are going to be lots of nuanced parts to the overall flow that you’ll need to figure out along the way.
“The thing I would ask is: Where do people fill in the rest of the imagination around the prototype?” says David. “What more do you need to show?”
Put failing first
Failing is the whole point of the prototyping process, but not everyone is accustomed to seeing failure as a learning opportunity. That’s why David advises that design leaders help their teams build up that muscle.
“Get people used to seeing failures before they see successes. I want to show some failures to get everybody involved and used to that,” he says. “We're going to fail more than we're going to succeed, but those are the lessons that will guide us to the successful solution.”
When things go off course, that’s when you know you’re on to something.
Increase learning opportunities by testing non-linearly
It can be easy to slip into the habit of treating the prototyping phase like a design review phase. One way to shake up the status quo is by testing multiple hypotheses at once.
“Prototyping is the tightest iteration cycle possible,” says David. The tighter the feedback loop, the more of them you can do in any given sprint. But make sure you’re not just sourcing feedback from customers. David says that this phase is amazing for helping teams build up their institutional knowledge.
When in doubt, try “bodystorming”
When designing the patient doctor experience, David and his team used “bodystorming” to literally walk in people’s shoes.
“We’d do a walkthrough of the patient and doctor experience and we’d make notes, like where do we pause? Where do we find gaps?” he says. “We earmark places where we need to circle back and really understand the flow.”
Return to the lost art of the demo
David wants internal demos to come back big time. He argues that while things like usability testing with customers are a no-brainer, teams can sometimes forget that they have access to another viable source of feedback: internal teammates and business stakeholders.
The trick is to ensure that you’re framing up your prototype and walking people through your decisions the right way.
“If the story was told through a series of slides versus a prototype, it can make or break the outcome of what the business chooses, so that framing and articulation is super important,” he says.
Beyond demos, David says it’s important that designers, and especially design leaders, build some business acumen by treating their various hypotheses as “bets.” He likens it to managing a stock portfolio, “you want to diversify your investments to increase your chances for success.”
Not only is this a useful metaphor for explaining design decisions and potential directions to non-designers, framing your hypotheses in terms of investments attaches more gravity and makes the stakes of these decisions more clear.
When all else fails, David finds it useful to seek inspiration outside of his industry. “I’m obsessed with behind the scenes anything,” he says. Part of the continued work of a designer is to stay curious and David does that by studying the process behind how things get made — movies, music albums, anything.
“I think it’s important for us to look at how other industries and mediums do their exploration, so that we can push our own,” he says.
Spoken like a true designer.
This post is part of an ongoing series featuring snippets from our podcast: By Design — a show about designing exceptional digital products and experiences. Each episode, our host and co-founder Josh Brewer dives deep into every stage of the product life cycle along with industry experts.