Listen Now

Listen to this podcast on your favorite platform Spotify, Apple, Google, or Simplecast.

Episode Summary

If we’ve learned anything from the past three deep dives into the research, product brief, and exploration phases, it’s that there are lots of chances to reduce uncertainty throughout the design process. But nothing compares to the prototype. David Hoang, Director of Design at Webflow, says prototypes are about failing — and that’s a good thing. He makes a strong case for a new way to use the prototyping stage: to figure out the wrong turns, not just the right ones.

Episode Notes

Director of Design at Webflow David Hoang says that prototyping is an incredibly effective way to learn and to get immediate feedback, understand what your team can say no to, and de-risk design decisions.

• David's website
• David on Twitter
• David on LinkedIn
• Webflow
• How Did This Get Made?

By Design is a show about the process of designing exceptional digital experiences. In each episode, our host, Josh Brewer, dives deep into a specific stage of the design lifecycle with an industry leader. Our hope is that hearing their insight can help us shape a better future for design.

If you’re interested in improving the design process at your organization, see how Abstract can help.

Transcript

Josh: Welcome to By Design, a show about the process of designing exceptional digital experiences. I'm your host Josh Brewer. And in this series, we will look at the different stages in the lifecycle of designing digital products. Each week, we'll hear from experts with an intimate understanding of what particular stage what has, and hasn't worked for them and how we might all apply these insights in order to shape a better future for design.

There are many opportunities throughout the design process to reduce uncertainty, whether it's investing in research early, increasing inputs and clarifying expectations in the product brief or generating as many possible solutions as you can in the exploration phase. One of the most effective things you can do is to invest in prototyping early and often.

I'm a big advocate of getting something in people's hands, as soon as possible. That could be something as simple as a paper prototype or as complex as something interactive built in Framer. The point is to get something that allows you to get visceral feedback from the person, interacting with what you create.

Prototyping has been central to David Hoang’s process throughout his career. David is currently the director of design at Webflow, a company building tools to bridge this very divide between what's rendered and what's built and functional. His experience has revealed that prototyping is an incredibly effective way to learn and to get immediate feedback, not just from customers, but from each other as well.

It's also a tool that helps your team understand what you're going to say no to a tool, to de-risk design decisions, engineering commitments, and even the business itself. We start by getting to know a bit about David and then we get right into it. Let's go.

David: I have been working at Webflow for almost a year and a half now. It's been a wild journey and I have enjoyed every moment of it. As you can imagine for us prototyping and bridging design and engineering is super important. I'm currently sheltered in place in Santa Monica, California. There are worse places to be on lockdown. And prior to Webflow, I was leading product design at One Medical for the last four years. So I was in the Bay area, kind of new to Southern California.

Josh: Right on. Well, SoCal in general definitely has a whole vibe and no shortage of things to do. So even in the COVID world, still tons of beach to explore and trails to hike and all kinds of food to eat.

David: Yeah. Yeah. If there's, I don't want to say silver lining, but if there's anything that has really made me appreciate what we're going through, it's the outdoors and being able to be in a distant place, you know, where I can ride my bike around LA.

Josh: I really agree with you. I think the thing that's kind of kept me sane through this whole COVID period has been the ability to get outside, get back into nature quite often by myself, occasionally with my wife and my kids, but just being out hiking, observing, and just kind of breathing in, I think it's reminding me of how important that is, even if, you know, if you're not in a global pandemic,

David: Hundred percent.

Josh: What is something absurd that you love doing?

David: Oh man, where to start? Okay. So one thing I really love doing, I don't know how absurd it is. However, I would say when I describe it to people there, they're a little surprised. So I love, I love doing any sort of research around how process gets made. So it doesn't matter what it is like. I am just so fascinated, like the process of anything. I would say for me, one area I really love that's in my interest, but on my purview like film, you know?

So if there's any like making of, or behind the scenes of this thing, I'm just enamored by how things get made and then there's a podcast, that's How Did this Get Made? That I, that I really love. So whether it's something I'm really into in the subject matter or something I know nothing about, I think I'm so enamored by process and I will spend my weekends and my Friday nights, like just browsing through YouTube videos and just trying to find the next thing I can learn about.

Josh: That's amazing. I would imagine you find a lot of similarities or, or maybe little nuggets that you can draw from different disciplines, that apply to the work that we do. I think designing our process is arguably as important as the design work that we do. Do you find that it sparks more creativity?

David: Yeah, it's interesting. The one that comes to mind, so I'm a huge music fan. I love Nine Inch Nails. Trent Reznor is probably one of my favorite artists. And I think I remember one time, I think it was the album Hesitation Marks where I just stumbled upon a track where he's recording a voice memo about talking through the process of creating the work.

And he talked about all these guiding principles and constraints, and I'm just like, holy crap. This is exactly like design. And I think, you know, that's the thing about any sort of design and prototyping. It's really exploring with constraints and creating rules to see what you can push. And it was just like a little eerie to hear Reznor or talk about something that like, you know, in a lot of ways he is a designer, right?

And so I think that example. Is always vivid in my mind, but yeah, I think any sort of inspiration, like outside of our industry, because I think that's important for us to look at how other industries or how other mediums explore, so we can kind of push our own. So we don't fall into the status quo of how things get done.

Josh: Right. You're probably interfacing with other people who have processes and ways that they do things and constraints that they're working with and against, and that notion that you have constraints and those. Are kind of the vehicle for some of the most creative exploration is something that I think in the course of my whole career, I've I keep bumping up against it and I feel like I've known it, but every time I get a chance to experience that even more deeply, you just kind of hit a spot of like, Oh right.

The constraint feels like a constraint. It feels like this, like closing in, but then it causes the human mind to do what it does best, which is begin to generate new possibilities. New ideas, new ways to think about solving a problem. And I don't know, the older I get, the more I'm actually interested in trying to apply constraints explicitly instead of just the ones that you kind of inherit.

David: Yeah. I think as I also get older, it's something kind of fresh on my mind too. I think it is something where I think we as designers think that the ultimate project is blue sky, no constraints. I'm like, what are the constraints? Like you don't give me the constraints because, that's how you really push things through. And it's just amazing, you know, after you do this over time, you learn to appreciate the creativity that constraints bring.

Josh: Yeah, absolutely. A number of musicians I've followed, they'll put things in place purposefully. They'll say, all right, I have one day. To get this concept out, right? Like it doesn't matter.

Whatever's there at the end of it. That's what we're working, you know, or it's a, I'm going to work in this mode or I'm going to use this set of words. There's so many ways that you can set boundaries that then spark and facilitate that creative opportunity. I know, even in the music side of things, To create something to really push the boundaries of something, I really do think the constraints, the constraints are important. Alright. When it comes to prototyping and when it comes to the design lifecycle, what immediately comes to mind for you? What are the common misconceptions? Maybe, maybe that's a good place to start. What are common misconceptions about prototyping as it pertains to the design lifecycle?

David: Yeah, I think for me, The first misconception I believe is that it's, it's a linear process and it's this — I hate to bring up the double diamond, but it's something we talk about this clean process and as you and I know design doesn't work like that, I think a lot of times people think prototypes is a way for stakeholders to kind of review screens and go through that.

And that's not the case. And it's not to say there isn't value in that. But I think prototyping is when, at the lowest fidelity you can start kind of building function around something. So, you know, for me, when I think of prototyping and I kind of close my eyes and think about all the great people I've worked with. It's really me working with an engineer right away, just to be, okay, we're gonna, we're going to build this little piece and put it on a phone or put it on a desktop for people to play around with. Prototyping is the tightest iteration cycle possible.

Josh: Can you say more about that? What, um, what makes it the tightest iteration, uh, cycle?

David: Yeah, I remember a former coworker of mine, a really good friend. He always said the number one way to be more productive is to reduce the iteration cycle. So the more you can get an immediate feedback loop. And if you can do that, like 10X or 20X over the time that you could in like a traditional sprint, you're learning so much more and it's not just learning from customers, but learning from each other and like really building that institutional knowledge.

I remember when my friend Izzy said that, it just changed my whole mindset of how I wanted to approach the work. And it's just like such a simple and beautiful thing.

Josh: I go back to early days in my career. And it didn't matter how you did it, but to get in there and get feedback from people that were actually like interacting with what you were building.

That was the most important thing. When we're doing that internally for ourselves. I've definitely run into folks who think it's too costly. Why are you worried about that? That's like, engineering's problem. You know, those types of concepts and challenges have definitely come up over the years. Have you run into that? And if so, how, you know, what are your responses to two comments like that and that kind of mentality around prototyping?

David: Yeah, it's a good question. I feel like prototyping is one of those things. Like people know it's important, but they don't know how it entails. So I've experienced times where you work at places where they're like, oh yeah, we love prototyping.

We think it's important. And then you start doing some work in the moment, things veer a little bit off course. There's a little bit of concern, like no signing off on stuff. It's that saying, it's “trust the process.” The point of prototyping is to fail as early as possible.

And if we are going off course and we're failing, that's a good sign because you know what, we're failing at a production, you know, and we're really iterating there. And I think that's kind of a, you know, it's a very normal thing to expect from people where they're ordinarily the majority of companies are probably so accustomed to the first feedback loop they get is when you ship stuff in production. And they're, they're not used to having what we're building stuff as we're going along in that regard. So I think that's the natural reaction. I get a lot and I think it takes a lot of muscles to be like, okay, anytime I start any sort of prototyping initiative, I'm like let's give some failure points, right? Let's get people used to seeing failures before they see successes, even times where there's a successful prototype. I'm like, I want to show some failures just to get everybody involved, used to that. We're going to fail more than we're going to succeed, but those are the learnings that we take in order to, you know, identify the, the successful solution.

Josh: Absolutely. And in a lot of ways I've heard others and I've definitely approached it this way, myself, which is a prototyping in a lot of ways is de-risking the design decisions. It's de-risking the engineering commitments. It's de-risking the business itself by trying to identify as early as possible areas that either break patterns or maybe we're trying to be creative and really create a new experience. You want to know as early as possible, whether or not that's physically challenging. Is it like a new paradigm that you're going to now have to build a whole entire educational, you know, kind of overlay on to teach people how to use this new thing?

I don’t know, there's just so many areas around de-risking the investment. It's about framing up. We are using this to learn. We're using it to understand you. You said we're going to fail. And I love that. We've definitely adopted that mentality internally at Abstract. And you know, the line that I always say is, you know, the only failure is a failure to learn.

If we make mistakes, that's fine. And in fact, that's great. It's what scares me most is when we don't learn from those, because then the odds are you're going to repeat them and you might even institutionalize them. If you're not careful, you know. For prototyping. Do you have any  experience that suggests what makes prototyping successful in the business context and how we operate? Are there any things that you've seen really make it more successful?

David: You know, I think that's something we as designers often, I think you mentioned framing and that's so important because I think we've so long not been represented at the executive level or the business level that, you know, we always felt misunderstood. And I do believe that's kind of evolving and there's more design leadership, but the seat at the table. And I think what we have now is to really help frame and articulate the decision-making process. So I think a lot of prototyping to me is helping people understand, like what we're saying no to.

And also I think another thing that's really important and a common mistake I see a lot of teams do with prototyping is you do want to have a clear thesis or a clear hypothesis of why you're prototyping, right? Because it can spin into such a vast infinite world of, you know, and...

Josh: Unending. Yeah, exactly.

David: So we want to kind of make sure we have some gravity to what we're doing. And I always encourage people like, hey, one thing from a business perspective, as you think about business acumen is everyone understands a portfolio, right? So I'm like treating this as a portfolio of opportunities or bets that the team wants to make, and you're using prototyping as a way to explore that, right? So we're diversifying how we're approaching what we're building in product or what we're building in brand and in that way. So I think by having that gravity and really treating it like a portfolio that people are deciding and choosing from helps people frame and then support like the prototyping effort.

Josh: That's fantastic advice. In regards to the types of prototyping that you see utilized. I kind of feel like everyone has a different picture in their head of what you mean when you say the word prototype. Are there places in times where the fidelity of the prototype itself really becomes critical?

David: I think so. It's hard, you know, because I think ultimately. Prototyping is a capability. It's not necessarily a tool, right? It could be a series of tools. And I think one thing it's important to kind of go broad, I think with the different tools you use to start, because it's going to depend on how your organization set up and how people give feedback and how they experience it.

Right. I think the thing I would ask Josh is like, where do people fill in the rest of the imagination, the prototype, and what things do you need to show? And you emphasize what you need to show that. So I think it's going to vary across different organizations. You know, you're a large company with like hundreds of designers. It’s probably a good investment to standardize what you use to build prototyping tools, to be able to move, like that's the way to move faster. Right. But if you're at a startup where it's one or two designers, maybe zero designers. And you need to prototype there's a little bit more lenience in what you use.

So I think that's kind of what I would say. It's like, you know, where, where does the business need their imagination filled? In that area and prototype that.

Josh: That's a really good framework for thinking about it is, where does someone imagining along with you kind of end because they don't have the context that you have. And so the prototype acts as the ability to really fill that in. And the one thing I love about designers is we are scrappy and willing to kind of use duct tape and twine if that's what's necessary, but at the end of the day, it's I think the type of prototyping, really, if I think from what you're saying, and in my own experience, it really is about what are you trying to answer?

So if it's a specific interaction and you need to like between the design team, the product and engineering team y'all need to agree on how are we going to transition animations on this type of object? Right. That is an incredibly specific thing that you're trying to answer. And, you know, paper prototyping is not probably the right tool for the job in that case.

But it's still prototyping. It's something, it's a step beyond the static screen. And to me, thinking from the beginning about movement, about navigation, wayfinding, for example, how you move in and out of states. I've found that prototyping for me often exposes dead ends, blind spots that I missed. Other people missed. Somehow we just, you know, you look at it enough screens and your brain fills in the gaps and it turns out there might not have been anything there. You just filled it in.

David: Yeah. And I think, I think that's where storytelling is so important. And also when you think about storyboards and other industries that's like for film, right? That's the reason they do storyboards is to identify like, where are those gaps and those completely missing parts in the narrative to be able to hash that out. And then I think another thing too, it's like, based on where you are in the organization, you might have a different mental model that, so it helps align these sort of moments. So, you know, instead of try and do these things at high fidelity, you're really trying to figure out the steps to that narrative. That's why like, you know, bodystorming is such a great way to prototype. When we did that a lot at One Medical where it's like, we're literally just going to do a walkthrough of this patient and doctor experience and where do we pause? Where do we find gaps? And we, we notate that to earmarked as like, you know, this is something we're going to need to figure out and really understand like the flow and, and, you know, when you go through it, it becomes so much more apparent than like, looking at a visual that's static and trying to talk, talk your way out of it.

Josh: Yep. I could not agree more with that. You mentioned different, uh, decision-making factors that apply to prototyping. And I'm curious in your experience, are there any best practices or tips or anything that you'd want to share with what can really make that successful?

David: For me, I think one of the lost arts, I believe is the art of demos, you know, because I think it's so important. I, uh, you know, making sure that the experience of the prototype and going through it is framed in the right way, the way I've done it. It's just really recording and synthesizing feedback based on reaction to the demo. Like it's so funny where it's like, we're so ingrained to do usability testing, user testing with our customers. But why not have the same treatment with our stakeholders?

Josh: Absolutely.

David: Often it's emailed over and it does cost time to set up these demos, but the impact and the alignment you get, I think is so much more valuable than trying to do it any other way and design is the ultimate storytelling, you know, as designers gain more influence.

I think sometimes we feel a little bit adverse to designing and creating screens. And, you know, the thing I tell people all the time is like, yeah, certainly. So you get more tenured and more senior in your career, you're probably doing less design, but the power of that, right? Like what other function or practice can sit with every single stakeholder around each department, the company, and be able to like, synthesize and unify through like a story in a prototype right there.

There's literally the CEO, like unlikely, unless the CEO is a designer. Right. But it's like, you know, something where, I think we forget that sometimes the big impact we can have as being a designer at that, at that leadership table. And I think prototyping is like a really great way of framing that where if the story was told in a way through a doc or slides versus a prototype, it can make or break the outcome of, you know, what, what the business chooses and that framing and articulation is so important.

Josh: This is really good. And I'm thinking, as we talk through this, you've hit on this theme a couple of times that as designers, we're constantly designing, and you mentioned that we might, as we get further in our careers, end up designing our design process. We might be designing our teams. We might be designing a non-technical or non-screen oriented experience inside of the company. I appreciate you bringing this up. Because I do feel like occasionally we get a little too narrow in myopic in the screen design aspect of our job. Right. And how valuable design is when it isn't constrained to just the screen.

When it's really seen as a discipline that can be brought to bear on all kinds of problems. Large public companies that I can think of having talked to some of the VPs and C-level executives. And what I hear from them constantly is the work is to help everyone else effectively kind of become designers.

You know, nobody's saying that out loud and I know that might even be a little controversial, but like, if you have a hand in making decisions, if you are a part of shaping and molding the experience that the customer is going to ultimately have, whether you like it or not, you're designing it, you might be unintentionally designing it, but, but you're in there.

I really appreciate you bringing that forward and highlighting that prototyping is another vehicle that we have. It's another way that we can help expose more of the company to how we think about the problems that we're solving and how we can approach it in a creative way.

David: Yeah, there's something I often say when I say system design before design systems and when you make decisions, everything's system design. And I think especially nowadays when we're kind of talking about how systems are designed to set up incentives for certain people and maybe not others. And I think an example of prototyping in a non, you know, and I say it in quotes in a non-designer way is maybe how you roll things out or how you think about org design.

I think one area that designers help the most is thinking about candidate experience recruiting, right? That's designed, you can prototype it, you can try different, different scripts or different ways to make sure that. You're being considered for every decision made, because like you mentioned, if we don't equip people to think about design and to design that way, sometimes there's like unintended consequences or decisions that are made without knowing it.

So the more we can kind of shine a light for people to feel comfortable, experimenting, getting feedback, and then making decisions on that. That is like a company-wide benefit, not just design.

Josh: The thing that hit me when you said that was that there's a, almost an embracing of the iterative process that I'm going to throw away 10 times what I'm going to keep I'm hearing in some of what you're sharing, a mentality or almost a way of thinking that became more about how do we iterate towards a result of that we are looking for, and then likely that's going to mean we're going to redesign some part of this. I don't know that I've seen that really be the experience, especially at the large corporate, uh, end of the spectrum, but how powerful that would be, if that mindset became more deeply ingrained in business.

David: And I think it's so important. You know, one thing, a common thread that comes to mind for me is I've spent almost the last half decade working at startups that are growing pretty fast, right? Like the hyper growth stage. And I think like, you know, my time at One Medical, I always tell people I was there for four years.

It felt like I worked at four different companies that whole time. And, you know, as you think about that, like that input and that feedback is so important at the organization level where you're like prototyping the company in a lot of ways.

Josh: Yeah.You know, startups effectively are like just an experiment to figure out the business and the organization that's required to make that thing work at scale. But it, you know, I've lived through that as well in my career. Wow. Okay. Bringing it back to prototypes a little bit, given where we are, what do you imagine five years from now? The design lifecycle has kind of evolved into and where does prototyping fit in that? So five years from now, we've got a crystal ball.

David: Yeah. Oh man. I'm going to dream big. And then dream with a lot of hope too, because I can think there's maybe a way there's probably reasons why this wouldn't happen, but let me kind of be a total hypocrite and drop some constraints for a moment. I think, um, interoperability is going to be so mission critical because I think with prototyping tools today, I don't know if there's going to be this all in one suite. Like this is the prototyping tool and we're going to like, basically be like an IDE, like for dev tool. I think many companies would, would hope and strive for that. But it's just something where the makeup of businesses and customer needs is going to be so specific and custom to that, that I think the interoperability where tools playing nice with one another, along with datasets is going to be important.

Like we need to figure out a way to make things work together because for me, the big dream is that prototyping tools are ubiquitous. So you can take any dataset with any like front end prototyping tool and get started versus kind of being kind of constrained by the, like the gating of like proprietary elements.

So I hope in five years from now that there's going to be this deep collaboration with anyone who's making creator tools or offering tools to be like, okay, look. We got to figure out a way to be extensible across each other to be able to prototype. And I think we get there. Uh, the prototyping possibilities are pretty endless for what people can do and achieve.

Josh: That's a, that's a good dream. I have seen in the last number of years here at Abstract, that the idea that we have compatible tooling that we have design data, whether it's data sets to your point, which we didn't even get into that. But man, I feel like that's a whole other episode we could talk about actually making sure you're using real data using customers, you know what they're going to see, and, and making the experiences as real as possible is extremely valuable. Interoperability is an interesting one because you're hitting on a theme that's near and dear to my heart, which is in our industry, I think not only design as a practice and as a business function will be served by interoperability, but I also deeply believe that the rest of the organization, the business itself will see tremendous gains if that work can be shared, if somehow we're able to kind of marry the design side of things with the data side of things, with some of the core, basic architecture pieces that the engineering team is building. And I'm hopeful, especially when I look at design systems and, and the approaches that some really creative folks are taking to make it more accessible, more approachable.

So many of the things we do, the primitives are pretty obvious. There, you're not, you know, like a select as a select and sure, you might make it look a little bit different, but like at the end of the day, we have a core set of objects that pretty much make up, you know, the Legos that we're working with.

And if I'm drawing in one tool and you're prototyping in another, but I can't, you can't use what I just did, that's a serious tax on innovation. That's a serious tax on the business itself that's investing in design and in designing great experiences. And so I have a lot of hope that we have some pretty creative minds that are already trying to solve for this.

So I'm with you and my support of like five years from now, I deeply, deeply hope we are in a world of interoperability.

David: Yeah. And I think, you know, one thing that comes to mind is like, we've, we've done so many of these things over and over again. Why are we repeating this? You know, like for me, when I think about engineering, I'm just like, okay, goodness, how many times do we need to like come up with authentication? Like there's so many standard patterns and practices in that regard and the same with design, right? Is that like, you know, by building common language and common protocols, like there's, there's so much more we can do in that regard. I'm optimistic about that sort of future because I think customers, as people start, like creating their own things are going to demand it. Right. It's really not about like the company saying, Hey, this is your stack. It's the, you know, the no code developer, the designer, that's like, this is my stack. How are you going to support me? And I think it's up for the companies to figure out that, that interoperability.

Josh: And I feel like we have some good patterns open source on the engineering side of things. I feel like has, has really paved a lot of the way for these things to happen on the engineering side of things. Right? Best practices emerge and tooling and infrastructure. I mean, it basically, it's like survival of the fittest in some real ways, right?

If enough people can demonstrate that this actually solve the problem for us, it's one less thing we have to go spend a ton of cycles on. We can. We can safely start from, you know, the floor just keeps getting higher and higher that we're starting from. So again, I guess I'm with you in the hopeful boat that if I just look at the trajectory of digital product design and development, I'm hopeful that design is going to get some of that wind in it sales that engineering has had as well.

David: I do too.

Josh: David it is, it has been amazing. And a pleasure to talk with you, uh, before we bounce and wrap this up. Is there anything that you'd like to share with our listeners?

David: Stay curious, you know, I think that's, that's important. I think design, you know, you and I have done this for a long time and I feel like I remember the days where we had to just fight to have a seat at the table. And I do think we've made progress. And I think it's like, stay curious, figure out how we evolve to serve both business and customer needs. And I think that's, it's exciting. I think there's, this is truly like a golden age of design tools and prototyping tools that when I got started with never imagined the possibilities of it. So I'm just excited to see what people create and innovate from it.

Josh: Couldn't three more. Thank you so much for spending time with us. Take care.

David: Thanks for having me.