In episode 677, Tracy Osborn interviews Leon Barnard from Balsamiq about wireframing and design. They discuss the book “Wireframing for Everyone” written by Leon and his co-authors from Balsamiq and they emphasize the value of low-fidelity wireframes for founders. They also cover how wireframing can improve ideation and communication processes among teams. To wrap up, they recommend resources for non-designers interested in learning more about wireframing and design.
Episode Sponsor:
Life as a founder can put a strain on even the strongest relationships, but spending dedicated quality time with your better half can help you recharge and refocus. If you’re ready to unwind from the daily startup grind, head over to cratedwithlove.com to level up your next date night. And for listeners of this podcast, you can use code STARTUPS during checkout for an exclusive 15% off your first order.
Topics we cover:
- 3:29 – TinySeed applications for Fall 2023 are open
- 5:00 – Leon’s passion for wireframing
- 8:32 – Designing in low fidelity wireframes
- 11:03 – Wireframing, ideation, and iteration
- 16:21 – Communicating design with wireframing
- 21:22 – Using wireframing to iterate on already existing, high fidelity content
- 24:35 – Writing about wireframing within the broader context of general design principles
- 28:16 – Additional resources for non-designers to gain confidence in design
- 32:36 – Asking questions informs good design
Links from the Show:
- MicroConf is leveling up!
- Tracy Osborn (@tracymakes) | X
- Leon Barnard (@leonbarnard) | X
- Leon Barnard | LinkedIn
- Balsamiq (@balsamiq) | X
- Wireframing for Everyone by Michael Angeles, Leon Barnard, and Billy Carlson
- Balsamiq Wireframing Academy
- Sketching User Experiences by Bill Buxton
- Don’t Make Me Think by Steve Krug
- UX for Lean Startups by Laura Klein
If you have questions about starting or scaling a software business that you’d like for us to cover, please submit your question for an upcoming episode. We’d love to hear from you!
Subscribe & Review: iTunes | Spotify | Google
Uh-oh, you’re not going to make yourself throw up, are you?
Tracy Osborn:
I’m like, “Wait, I have a list. [inaudible] I can fix this.”
Rob Walling:
Yeah. Yeah. Have you ever seen Pitch Perfect, the show about the a capella singers?
Tracy Osborn:
No, I haven’t.
Rob Walling:
The women in college and they… It’s super fun. It’s like-
Tracy Osborn:
That sounds cool.
Rob Walling:
… tongue in cheek doesn’t take itself too seriously. Good songs like Glee-ish. I’m not the biggest fan of Glee, but at least, it has cool music every 10 minutes. Anyways, there’s one of them that projectile vomits when she gets nervous, so when you were going like this, I’m like, “Uh-oh, are you Pitch Perfecting?
Tracy Osborn:
That’s my interview prep, right?
Rob Walling:
Yeah, that’s the interview prep. Welcome back to Startups For The Rest of Us. I’m Rob Walling, and this week, I’m joined by Tracy Osborn. You know her as tracymakes on x.com, and she spoke with Leon Barnard of Balsamiq. They talk about how to design faster and more effectively with wireframing. Tracy, welcome to the show.
Tracy Osborn:
Yeah. Happy to be here. Happy to be part of the podcast.
Rob Walling:
Yeah. We’re trying something a little different this week. We are longtime friends with Balsamiq as people know. This podcast as well as MicroConf have long followed Peldi. Peldi spoken at MicroConf many times and has been a long longtime supporter. Balsamiq reached out and said, “We’ve written a book. Several of our team members have written a book,” and I thought this is a great opportunity to talk about wireframing and design on the podcast, but I don’t have expertise in it, and frankly, my interest level with it is not as high as other folks I know, so I sent you an email. I said, “Tracy, you want to handle this?” And you said?
Tracy Osborn:
Absolutely.
Rob Walling:
I tease it a little bit. You interviewed Leon. What’s the book and what’s it about?
Tracy Osborn:
When people see the word wireframing, they think of something like the super designers out there who focus on all the super designy stuff, and wireframing seems like a concept that only applies to someone who has a degree or who is doing that as their full-time job. I left at the opportunity to do this interview because this wireframing is something that I’ve had in my toolbox since I have a graphic design degree, but it’s not something I see often talked about in the startup entrepreneur non-designer world. It looks kind of intimidating. It looks like it’s something that might slow down your processes, but in reality, it’s something that can help you go faster and do more and communicate better with other folks out there. So, it was really exciting to kind of leap into with Leon.
Rob Walling:
Well, we shouldn’t leave out Leon’s co-authors. There’s actually three authors of the book and all three of them work at Balsamiq, and who better to write a book like this than folks who are day-to-day 40 hours a week thinking about wireframing, building software products for people who want to wireframe? There’s probably software entrepreneurs listening to this or aspiring founders who may think they don’t care about wireframing. Why would they need to know that? So, as a final pitch before we dive in, Tracy, why should someone listen to this episode?
Tracy Osborn:
Wireframing helps you figure out the ideas you want for the way that your website works, whether that’s the front end or the back end, it allows you to try different concepts in a faster way, allows you to take those concepts to folks who may give you feedback or the design you’re working with so you can share what you want to work on, allows you to talk with your team members about what you want to do without having to have a full-fledged final mockup, and overall allows founders to work faster.
Rob Walling:
Before we dive into the episode, I have two announcements for you. The first is that TinySeed applications for our Fall 2023 Accelerator batch will be open from September 4th to the 16th. We are funding companies in two batches. We have our Americas and our EMEA batch. That’s Europe, Middle East, and Africa. And if you have at least $500 in MRR and you are looking for the perfect amount of funding, as well as world-class mentorship you can’t get anywhere else, and a tight-knit community unlike any you’ve been part of, head to tinyseed.com/apply. If it’s from September 4th to the 16th, applications will be open and you can apply there. It usually takes about 10 minutes. If they’re not open, you can enter your email to be notified when we open the doors. I hope to see your application.
My second announcement is that while some of you might have spent the summer vacationing or spending time at the lake, our team at MicroConf has been gearing up for one of the biggest announcements we’ve ever made. The last time we made a major announcement was in 2019, so I don’t want to jinx it, but there are some pretty amazing things coming down the line to help you build, launch, and grow your SaaS business. If you want to be the first to hear about it, head over to futureofmicroconf.com and sign up for our announcement event that’s going to happen on September 14th of 2023. You won’t want to miss it. Book is Wireframing for Everyone. It’s available on Amazon. With that, let’s dive into your conversation.
Tracy Osborn:
Leon, thank you so much for joining us here at Startups For The Rest of Us. I left on this chance to run this interview because I have a degree in draft design and I’m personally already aware around the benefits of wireframing and why you should use wireframing, but when I joined the startup world and started working with the entrepreneurs and founders, I found that the term wireframing wasn’t often used. So, what brought you to this wireframing world and what drives your passion to it? Maybe you can kind of explain what wireframing is for the audience that is listening to the podcast.
Leon Barnard:
Sure. Happy to answer these questions. I’m really excited to be here. I started my career as a UX designer, and when I started a long, long time ago, the default tools for UX designers were things like Photoshop, and designers were expected to create these pixel perfect mockups. And then, when I was in my first job, I was realizing that that work was not making its way into the product, except for maybe icons or some of these graphic assets that the tools that we were expected to use were not really actually very effective for helping to build a product. So, I found myself turning to tools like PowerPoint and Visio to capture ideas and concepts that I thought would be much more useful in having actual conversations.
I don’t know if I even knew the term wireframing at that time. And then, when this tool Balsamiq came out and I heard it was for creating wireframes, I was like, “Oh, this is the tool for me. This is a tool that will help me communicate my design ideas,” which is a very different process from say, building something that looks like a final product because I was finding that really, in the organization I worked at, it was enterprise software. It was very developer focused. It was the developers that were leading things. So, I needed a way to participate in those conversations and insert myself into the conversations. And I found that having these sketchy low-fidelity artifacts, which is what wireframes are, they’re like a digital version of a napkin sketch. It was really a great way to get more engagement with the people who are actually having an effect on the product.
Tracy Osborn:
Yeah. I think that’s a term that most entrepreneurs or founders have heard is the napkin sketch. The stories of that brilliant entrepreneur who has this big company, it all started because that person was at a restaurant sketching on a napkin their first ideas or prototypes. So, that’s a wireframe in a sense.
Leon Barnard:
Yes, exactly, but it’s funny because the product Balsamiq was originally called Balsamiq Mockups because that’s what they were called at Adobe, where the founder worked prior to this. Some people also call them prototypes because they’re a way to kind of prototype the interaction of a product, but I think wireframe is the best term because it’s a sketch. It’s an outline. It’s meant to be low-fidelity, which means mostly black and white, not as many details, and obviously it comes from the world of industrial design, pre-digital days where you were building something made of frame, made out of wire, which obviously wasn’t going to be the final thing. So, yes, I think wireframe is a good term for people to understand and use, but I understand there’s a lot of terms out there in every industry, so if people are not using the right technically correct term, then that’s okay. Part of the book is helping to explain the difference between a wireframe and other types of artifacts.
Tracy Osborn:
So, a founder could look at a wireframe that they’re going to put into more founder terms, that they might be used to that napkin sketch, those lines and boxes, things that are super low-fidelity like you mentioned. So, what are some of the specific differences and the reasons why you should start with low-fidelity for wireframing? First, is the urge to start adding those details. I know that I had to struggle with this as a designer because I’ll start with my page and I say, “What do I want on this page? What do I want? How do I want things to work?” You’re like, “Okay, cool. I have my headline on the top, and then I have my images.” And then, you’re like, “Ooh, what is my headline going to say? What are things I could use in my headline?” And then like, “Oh, what is that photo going to be?” So, the initial prototype I’m working on is moving more and more high-fidelity, just more and more detail there.
So, can you expand on some of the reasons why you want to keep something low-fidelity and maybe go into the ideation process there or reducing that urge to move into high-fidelity, something that has more content?
Leon Barnard:
Yeah. You really captured some of the traps that are out there, and really, it’s just human nature. People aren’t wrong or bad for doing it. It’s so easy to get ahead of ourselves when we get into design. Especially when you’re building a product and you have other competitors to look at, you want to make something real. It’s kind of in our nature, and that’s what’s so attractive about the napkin sketches, that there’s only so far you can take it, but with digital tools today, you can make something that looks and feels real in an afternoon. But the big challenge is, is that the right product? Is that the product you should be building? Is that what people are going to pay you to ship?
In my experience, what I’ve found is that if you really ask the right questions and do the right work upfront, then the design details can come later and they kind of fall into place, but if you get things wrong in the beginning and you’re not answering those fundamental questions about what is the goal of this product, who are my users, what is this trying to serve, what information needs to go on there and what doesn’t, then that’s really what’s going to be most useful. And a wireframe, especially if you’re using a tool that’s dedicated only for wireframing, then it kind of forces you to do that and makes it hard even to get into some of those details because the design process has separate distinct phases, and there’s a right time and a place for different levels of detail.
Tracy Osborn:
Right. I think that’s a great place to dive into in terms of that, how-to, how do founders get started and how they start using wireframes for ideation because another urge I think a lot of people might have is to create one wireframe, and then take that one wireframe and go to different people in their company, to their customers and get feedback on that one wireframe. I think your book does a really good job of talking about the value of creating lots of different ideas. So, maybe from a founder’s perspective, what does that look like? How do you use wireframes to start generating those ideas and start going through different thoughts you might have or different directions you want to take?
Leon Barnard:
Yeah. The first chapter of our book, Wireframing for Everyone, is really dedicated to explaining why wireframes matter, and really more than that, the value of low-fidelity and iteration and coming up with lots of different ideas. We reference examples from other industries where a very successful chef is going to try 10 different dishes for every one that they’re actually going to put out there, and the same with a lot of other industries and examples. So, your first idea is often not your best idea and you can build it. It’s great that you can build that idea right so quickly, but you really owe it to yourself and your audience to try to come up with as many ideas as you can early on, and that’s really going to help you generate better ideas, kind of merge and combine ideas. So, it’s really all about making time for creativity in the beginning and allowing yourself to be creative.
It doesn’t have to take a long time because you’re not investing a lot of time to make something that looks final. You’re just letting your imagination go wild and being okay with that, and reserving judgment and all of that kind of things, that kind of brainstorming mentality. And that can be really useful because you can do it in an afternoon and you’ve got 10, 20 different ideas that you didn’t have when you started, and you’ve learned things that you didn’t know that you knew maybe, or you’ve found out questions that you didn’t know that you needed answers to. Just spending a day to do that, it’s going to get you off on such a better foot than trying and going ahead and building your first idea.
Tracy Osborn:
Yeah. For example, they’re working on their landing page for their product, so rather than creating one wireframe with their initial idea and just building it, I don’t know, do you have a rule of thumb for how many different iterations, something where someone can say like, “This is a good amount of ideas out there”? I think your book goes into… There’s the obvious ideas, but there’s also tactics that you have in your book and how to find the nonobvious ideas, how to step out of there. So, specifically, how would a founder go through this process if they’re say, creating a landing page?
Leon Barnard:
Yeah. Yeah. Thanks for bringing that up. Yeah. There’s a whole art to creativity, and sometimes, often the best way to be more creative is to impose constraints. If you just say, “Oh, let just come up with a landing page,” then you’re like, “Well…” You’re only maybe going to come up with what you already can picture in your head. But if you say, what if I can’t use any text or what if it has to be text only, or let me start with a mobile version of it, or let me do it in the… What if it has to be targeted at children? Coming up with kind of these sometimes artificial constraints or sometimes they can be realistic constraints. What if I’m targeting people in countries that don’t have good access to the internet and the whole page needs to load and be half a megabyte or something like that?
So, there are some techniques that you can use or you can just tap into that subconscious and say, “Okay, I’m going to make myself to eight different ideas in five minutes.” So, you don’t really engage the judgmental part of your brain, and you just let that more primitive subconscious part kind of kick into high gear. And then, there’s also this idea of just really pushing yourself to create one more. When you’re tired and you don’t think you can have any more ideas, maybe just saying, “Okay, let me just do one more that just might be crazy and might not make any sense.” But then maybe there’s one little piece of it that you end up using in the final product. So, there’s a couple strategies, but most of them involve either pushing yourself or imposing some kind of constraints in order to stimulate your creativity.
Tracy Osborn:
Right. So, rather than looking at a page saying, “I’m creating a landing page,” you’re asking yourself different questions as you’re going through this. Whether using a tool like Balsamiq or pen and paper, creating really quick sketches of boxes and lines and different ways of laying this information out in different ways of approaching this process, wireframing really allows someone to go through each of these ideas very quickly because you can imagine that mocking up every single one of these questions, how would this be for mobile, how would it be for mobile for people of low bandwidth, trying to do a full mockup on those would be quite difficult and very time-consuming. So, wireframing is really there, so you can iterate so quickly and just go through all these ideas and try to see if you can get to that nugget, that really special idea that you weren’t thinking of in the beginning.
Leon Barnard:
Yeah, exactly. The cost of having bad ideas or ideas that don’t go anywhere is so low that there’s not really any penalty to creating an idea that you’re not sure about because it doesn’t cost you very much time.
Tracy Osborn:
We’ve covered why wireframes should be low-fidelity and quick and easy and whatnot for ideation and the process of creating wireframes. Can we go a little bit more into the value of wireframes for communication? Again, for a founder who’s listening to this podcast, there’s probably a lot of situations where they have the ideas in their head or maybe some really basic wireframes of kind of the direction they want to go, and now they’re hiring a contract designer, maybe someone who has a lot of context about their company or they’re working with the developer to implement that vision. How can wireframing be used as a tool to aid in communication?
Leon Barnard:
Yeah. Here’s where it’s a little bit tricky because the temptation is to build something that looks final and the assumption that if you make say, a mockup or a pixel perfect version of something that you can hand off to somebody, that they will understand it, and if you say, “Oh, if I create a wireframe, then there’s going to be a lot of things that they understand,” but what we don’t realize is what’s not communicated in even some of the high-fidelity things. So, it’s often better just to have something low-fidelity, and then have a conversation around it because you can hand off something that looks final and get something back that’s totally different because you didn’t specify how it should be on mobile or how it should resize, for example. So, they’re a really good tool to aid in communication, but not to be seen as a replacement for communication. So, kind of like “a picture is worth a thousand words,” but also you can talk about that picture.
And then, also with wireframes, one of the key concepts to understand is that you can annotate them. Because they’re not going to be mistaken for the final design, you can put pictures. You can put words on them. You can put little sticky notes and arrows, and you can use say, bright red or pink or something to say, “Oh, when you click this, it should do this.” So, feel free to mix in words and instructions and sticky notes and all kinds of things to help them be easier to understand, but the best way to communicate is to sit down with somebody in front of that wireframe and talk them through it, so they can ask questions. They can even give you ideas and maybe in your session, you can make changes there on the fly that ultimately communication is best between people. And just because you can create something that looks final, don’t mistake that as a reason not to have a conversation with somebody because there’s so many nuances and so many details, and talking to somebody about something is such a rich forum for that.
Tracy Osborn:
Right. In one situation, you might have this full design up for a landing page, and of course a designer’s going to take a look at it and just implement it. Maybe not the designer, but maybe the contractor or developer you hired. However, if you have a wireframe that has annotations with additional context of the things you want to do and the way that things are working, and then the wireframe itself being low-fidelity feels easier to have a conversation about because it’s not final. So, the other person on the other side of the screen can look at it and using their own imagination kind of go into different directions and have a better conversation or have an easier time having a conversation with you because they know that things are not in the final state. I think that’s a really interesting point that you make in this book as another one of the powers of the low-fidelity or maybe even medium-fidelity at this point. Maybe you’ve started to add in some of those headlines in order to have those conversations with other people.
Leon Barnard:
Yeah. I mean, that word conversation is so important. Wireframes help you have a conversation and they help you get feedback, so if you show somebody something that isn’t final, you’re going to have a conversation. That’s where the value, that’s what you want. You want to have that conversation. So, that’s what’s really valuable I’d say about wireframes.
Rob Walling:
Life as a founder can put a strain on even the strongest relationships, but spending dedicated quality time with your better half can help you recharge and refocus, and who better to help you make the most of those moments than our friends at Created with Love? Picture this, you and your partner wrapped up in laughter in friendly competition, all thanks to Created With Love’s handcrafted board games tailored specifically for couples. These games not only reignite the connection between you, but also give you a much needed breather from your startup’s never-ending demands. From cooperative problem-solving challenges to competitive head-to-head showdowns Created with Love offers a variety of game types that cater to every couple’s unique tastes.
Say goodbye to boring date nights and say hello to fun, delivered right to your doorstep, and with Created With Love’s monthly subscription boxes, you can hit pause on the endless TV binge-watching and play something new every month. If you’re ready to unwind from the daily startup grind, head over to createdwithlove.com. That’s C-R-A-T-E-D with love to level up your next date night. For listeners of this podcast, you can use code, startups, during checkout for an exclusive 15% off your first order.
Tracy Osborn:
A founder, say, you’re listening to this and they’re interested about working with wireframes, are probably not starting from a completely blank slate. Usually, they’ll have a landing page already designed. Maybe they have their onboarding flow that’s already set, and they’re looking at that saying, “Okay, I want to change this. I know that there’s problems here and I want to change it.” And I think the urge there would be to just start moving things around within that live page or start working with their existing components that are right there. How can these folks use the process of wireframing instead of going from, say, high-fidelity to high-fidelity? Where does wireframing come into play here when you already have something that’s launched and out of the world and you’re not starting from scratch?
Leon Barnard:
That’s a great question. I think it goes back to that idea of things being low-cost, so you can experiment with things much more easily. One of the things that we encourage in the book is, when you’re starting a wireframe, to start really low-fidelity, so start with some words. So, I would say if you’re doing a redesign for a landing page, just start by writing down some of the changes that you want to make, some of the things that you think are working and are not working, and start writing those down even on a wireframe and maybe just playing around with some of the words saying, “Oh, I want to have a call to action here. I want to do a better job of highlighting some of the features here.” And maybe even just laying out in sticky note or having box placeholders for where you think things should go to really take you out of being stuck on that current design.
You’re going to get a lot more creative ideas if you just say, “Well, let me just focus on the content for a second and not get hung up on how it looks currently, and come up with five different variations of just having things in different places without really thinking about the appearance so much.” I think that’s just going to open you up to so many new and different ideas that are really centered around, “Okay, what is the content? What are people’s goals?” Rather than thinking about what visual elements might track people’s eye or even how should the navigation be, but just really not having to think about, “Oh, I’m building a user interface,” but think about, “I’m focused on the content, the information that’s going to be on here, and I can almost step outside of what I think of as the design, but the content, the information on there is the first step in design as well.” So, it allows you to work at different layers of abstraction or different layers of design, kind of the layer zero or something, which is just the non-visual level.
Tracy Osborn:
I think that’s a really great point to jump into in terms of this design process because your book is Wireframing for Everyone, so the instinct when we’re reading that is specifically about wireframe, but I think this book, it’s a really succinct, easy to read 150-ish pages book is not just wireframing, or at least it explains why wireframing isn’t just the actual process of creating boxes and lines and doing this layout. A lot of it is around that customer research process and why that’s important and why that goes into it. The other parts of the book… We talked about communication already. There’s parts of the book that go onto visual hierarchy, which I think is really important.
So, it’s all these design principles, these pieces that really help someone who’s a non-designer understand what the design process is and how it’s not just say, creating a layout, but it’s really understanding the goals behind the website and what you’re trying to build, and then having this tool so you can iterate on that. What went into the decision between you and your co-authors, Michael Angeles and Billy Carlson? What went into the decision to create a book where the focus wasn’t just on wireframing, or were there iterations that this book went into? Did you start just on wireframing and then realizing that the topic had to be broader? I’m kind of curious about the background there.
Leon Barnard:
Yeah. Thanks for recognizing that and bringing that up. Yeah. I would say this book is not just about wireframing, and the reason we added for everyone to the title is to show that wireframing is a technique that everybody can use because it’s something that can apply to all parts of the process to many roles, and there’s this idea of there’s a wireframe as an artifact, but wireframing as an act is really a way of thinking about things that you want to invest time, into exploration and discovery, and answering fundamental questions early on. So, the other nice thing about the book is it all comes from real-world experience.
I was a mentor for a bootcamp. I’ve seen a lot of educational resources for UX designers, and they talk about wireframing, wireframes, how to create them, but they don’t tell you how things work in the real world. So, the three of us authors, we all worked for different types of software companies in our lives and we saw what wireframes can do, the value that they can provide, and it’s really as a way of getting people engaged in having those design conversations, having more people have a seat at the table in the design process. So, as far as the three of us writing it, we all had slightly different backgrounds. None of us were authors, so we were really nervous about how are we actually going to write a book. So, A, it was nice that we had three people working on it, and B, it was really great that we worked with A Book Apart as editors to help us craft it into something that all worked together and helped us cut out a lot of fluff.
Billy has a background in graphic design, so he really understands how that element of it can improve your wireframe I worked a lot with developers and PMs to try to understand the software development process and where design and different types of design can fit in. Michael Angeles is a great UI designer, big advocate for wireframes, and he’s really good at finding ways to give feedback and communicate with people to kind of come together on things. So, we all had different areas of expertise, but we all knew that the wireframe is just an artifact. It’s just a tool. It doesn’t add any value on its own because it’s not something that ships to the customer. So, it’s really what they can be used for that’s the most important thing.
I mean, anybody can learn how to wireframe in half an hour, but that’s not going to help you necessarily be more successful at getting your design ideas into the final product because really, kind of a unifying theme in the book is that what matters is what ships and wireframes are a way to bring people on the team together to ship something that everybody’s happy with and works for the customer, as well as for the business and everything like that. So, it’s really just a piece of the puzzle.
Tracy Osborn:
Other than your book, what two to three resources would you recommend for folks who are non-designers wanting to, say, jump into this area and feel a bit more confident in starting out with doing design and starting to create things from scratch?
Leon Barnard:
Sure. I’m going to bring up the resources chapter or section right here, but one of the things that was fun was to dig into some of those resources and reread them. I think one of the biggest inspirations was a book called Sketching User Experiences by Bill Buxton. It’s very philosophical. It’s a fun read. It’s very abstract, but it really talks about the sketching process, and there’s so much emphasis on creativity, and just coming out of that, it’s hard to think of why you wouldn’t spend time upfront doing this and just what value it provides. We wanted kind of a condensed version of that, that was also more applicable to real software processes. So Sketching User Experiences is a great book.
We love books like Don’t Make Me Think by Steve Krug, which is a great way of seeing how a UX designer sees the world, that it’s not about the layout. It’s not about the aesthetics. It’s about finding a way that your user can use your application in an intuitive way and trying to put yourself in their shoes. So, our book is kind of a summary of a lot of other books or topics from other books. But then also another book that we really like is UX for Lean Startups by Laura Klein, and she talks about wireframes in it. So, we kind of felt like our book would be inserted into the point where she talks about wireframes and it’s like, “Okay, now here’s a deeper dive into them but about how to work in a lean kind of agile way where you’re not spending a lot of time doing work that isn’t adding value to the product.” So, I love the ideas of lean UX and lean and kind of lean startup mentality, so I think it fits really nicely into those books as well.
Tracy Osborn:
I’m also a huge fan of all the lean startup world, lean UX world because that’s something I think a lot of founders… It’s really useful for founders as we’re building our companies, as we are trying to avoid the tendencies to really expand how much work we have to do and figure out the ways that we can kind of tighten up our work. So, this is a great example of something that might look like we’re adding more work to our plate, as if we’re trying to cover all the aspects of building a startup, by adding the wireframing part. As you are working on your ideas for your landing page, it might feel like, “Oh, I could just cut this out and save myself more time.” And I think that we’ve really covered in this why that process, while it might take more time, saves you more time in the long run when you’re trying to be efficient with building your startup because you can land on a better idea faster due to these wireframes. Is that correct?
Leon Barnard:
Yes. I mean, I think it absolutely fits in. I mean, lean is all about doing experiments and seeing what works and what doesn’t work, and in the same way, that can feel like a waste of time. Why am I going to do the work to come up with two different ideas for a landing page when I could just spend less time and build one? But it’s all about experiment and test and iterate, and that’s exactly what wireframes allow you to do is come up with 10 different ideas in the same amount of time that it would take you to come up with one more polished idea, and then test those, get feedback, put them in front of customers maybe.
So, find out if you’re on the right track before you start coding because that’s when things get expensive. It’s once you start investing in code, once you ship a full-fledged product that’s out in the world, it’s harder to make changes to it, but it’s easy to make changes when you’re in the early phases when it’s mostly internal. So, it really, I think, is going to save you time in the long run.
Tracy Osborn:
I love that point. I think that’s a really great way to start wrapping things up. So, to go through some of our points that we’ve put out here, wireframing is the process of creating these low-fidelity mockups of the things that you’re trying to design, and you can use those low-fidelity mockups to help in your ideation process and run for many different ideas and you can use those mockups in the communication process to work better with the designers and contractors and team members as you are building your product. Is there any other things that you want to leave us with as we wrap up?
Leon Barnard:
Yeah. One of the messages that we want to get across, especially for startup founders, people who don’t have a designer, is that design work is not maybe what you think it is. Common mistake we see non-designers make is trying to act as a designer or do what they think a designer does, which is making something that looks cool, but a good designer is someone who asks a lot of questions. What is the use case? Who’s going to be using it? How often are they going to be using it?
So, think about wireframes as a tool to help you answer those questions, help come up with ideas around those key important questions, and resist that temptation to try to make something that looks finished. So, use wireframes as just one tool, just the way that you would use the other tools in your toolbox. Don’t think about, “Okay, now I’m doing the design,” but just think of them as a tool at your disposal to help solve certain problems that you have. It’s just one of the tools among many, so don’t get stuck on these categories about, “Oh, now I’m a designer,” or, “Now, I’m designing.” Really, it’s all part of the same thing, which is helping you come up with the right solution for the problem that you’re trying to solve.
Tracy Osborn:
That’s fantastic. I love it. Let’s end on that. Thank you so much, Leon. It’s been a joy to talk with you. If folks want to follow up with you, you can be found on LinkedIn under your name or at Twitter on Leon… Is it Barnard? I forgot to ask-
Leon Barnard:
Yeah, Barnard.
Tracy Osborn:
… at the beginning, Barnard. @leonbarnard. Your book can be found by searching for Wireframing for Everyone. It’s on Amazon. It’s also on your publisher’s website, A Book Apart. And if people want to jump into more about wireframing, Balsamiq, your employer has Wireframing Academy with tons of more content about wireframing for free, and that can be found at balsamiq.com/learn. We’ll make sure to add all these links into the show notes. Leon, anything else you want to point people to?
Leon Barnard:
I don’t think so. I would love to get your feedback on it. I’d love to see some reviews. This is something that I love talking about, so I really appreciate having the opportunity.
Tracy Osborn:
Appreciate you taking the time with us. Thank you so much for being here and giving us such a great overview of this often hidden part of the design process.
Leon Barnard:
Thanks, Tracy.
Rob Walling:
Thanks so much to Leon for coming on the show. Again, the book is Wireframing for Everyone published by A Book Apart. It’s available on Amazon or wherever greater books are sold. Thanks again to Tracy Osborn for putting in the work and interviewing Leon. If you want to keep up with her, you can follow her @tracymakes on Twitter or x.com wherever you get your social media fixed. Thank you for joining me this, and every week. Whether it’s been 10 episodes or 10 years, I appreciate you coming back. If you keep listening, I’ll keep recording. This is Rob Walling signing off from episode 677.