The following is written primarily for Product Managers (PMs), but a lot of the advice applies to any non-professional designer that needs to communicate their ideas in a visual way.
So if you’re a founder, developer, marketer, business analyst, etc., this newsletter is for you too!
|
|
Should PMs create wireframes?
|
|
Sometimes even the simplest questions can elicit very strong reactions. “Should PMs create wireframes?” is one such question. If you look around the web, there is a lot of debate, but no definitive answer.
We built Balsamiq Wireframes specifically for non-professional designers, and have been talking to hundreds of them about wireframing.
This newsletter is our effort to give you the ultimate guide for when and how PMs should create wireframes (and when they shouldn’t).
|
|
When there’s no Product Designer available
|
|
This is the easy case. Over the years we have learned that Balsamiq’s sweet spot is with people who have to act as Product Designer, until they can afford to hire one. These are often founders, but also PMs in smaller companies.
If you don’t have a professional product designer on the team, and cannot hire one, it is absolutely your job to create wireframes.
As the PM, you have the clearest idea of what customers want, so this task normally falls on you. Depending on your situation, there might be someone in development, marketing, support, or even the CEO, who has a knack for UX. In these cases, they could build the wireframes instead, with your help.
Basically, someone HAS to do it. Everyone knows that these wireframes aren’t going to be world-class, but it is what it is. You have to make do with what you have, until you can hire a professional.
|
|
 Note that this case also sometimes applies in larger companies, when all of the UX designers are busy with other projects, or not available to your team (for instance, if you’re building internal tools). In these cases, it’s totally acceptable for PMs to create initial wireframes, while waiting for a designer to free up. |
|
|
When you do have Product Designers on staff
|
|
This is the more interesting case, which benefits from a more nuanced answer.
What to do depends on several factors:
|
|
Do you have Empowered Teams or Feature Teams?
|
|
Many of you probably already heard of these terms, coined by product management guru Marty Cagan.
In an empowered team, the product designer is the one responsible for solving the Usability risk for a certain new initiative. So in this case the PM would just state what problem the product needs to solve, and rely on the designer and broader UX team to fully come up with a design that solves it in a way that delights users while serving the needs of the business at the same time.
Alas, the vast majority of PMs don’t have access to what Marty calls a “true product designer”, let alone a whole UX group who can do user research, IA, wireframing, prototyping, user testing, and visual design. Not to mention the time pressure they’re put under by their executive teams. This is what Marty calls feature teams.
In these cases, the PM usually has to give a bit more detail to the designer, in one form or another. Often this is done via user stories. We argue that wireframes are a great part of user stories, because a picture is truly worth 1000 words.
Look at this great example from the Product Plan blog:
|
|
A wireframe is much richer, clearer, and more efficient than a long list of bulleted text.
|
|
How senior are the PM and the designer?
|
|
Sometimes a designer just joined the team, and is not yet as knowledgeable of your product, market, and team processes.
In these cases, it might make sense for you as the PM to create the initial wireframes for a period, until the designer ramps up.
Just have a conversation about it between you two.
|
|
Is the designer co-located or remote? In the same time zone or not?
|
|
If you’re sitting right next to the designer, or are in the same timezone, that’s ideal! You’ve heard about Pair Programming, right? Well, Pair Designing is fantastic, too. It feels expensive to sit together for hours, but it saves time in the long run. In these cases the designer usually “drives”, but the PM can quickly jump in with suggestions. This is why we built Real-Time Collaboration and Alternates in Balsamiq Wireframes. If you have a chance to do one of those sessions, take it!
In other cases you don’t have the luxury of being in the same timezone, or simply prefer to work in a calmer, more asynchronous way. That’s when written communication is much more important, and wireframes can be a rich way for you and the designer to collaborate. You’re both creating wireframes. Read on for good ground rules to make it work.
|
|
What kind of wireframes are you creating?
|
|
There are many types of wireframes. If you need to explain a complex user flow, you can create what we call a wireflow. That’s totally normal for a PM to create, as it’s just a rich way to explain the who, what, and why, without delving much into the how. Your designer will appreciate it.
|
|
In other cases, you might create a quick-and-dirty wireframe to show to your executives to explain what a feature is roughly going to be about, in order to get approval to work on it. Or to talk to engineering, to see if it’s even possible.
In these cases everyone understands that your wireframe is just a starting point, so by all means go ahead and create it without disturbing your busy designer.
|
|
If instead you’re starting to think about the details of how a specific new feature will work, that’s when you need to tread carefully. Creating such wireframes might feel to the designer like you’re stepping on their toes, so a lot of PMs shy away from doing it.
We believe that’s a shame, since wireframes can be very useful in this phase of the design process as well.
Instead, we have come up with a set of ground rules that will turn this potentially frustrating interaction into a smooth, efficient, and collaborative relationship. We called it “The Wireframes Contract” and it applies to anyone with an idea.
To make it easier to share, we gave it its own page!
|
|
It’s just a set of simple rules, but it can really make a huge difference. It boils down to agreeing to have two sets of wireframes: one made by the PM, and one made by the Product Designer. Check it out!
We haven’t shared it with anyone yet, because we want you, our inner circle, to have a chance to give us feedback on it first. Please reply to this email and let us know what you think!
|
|
Knowing how to wireframe makes you a stronger PM — just like knowing a bit about coding, software engineering methodologies, or marketing. It helps you meet your teammates halfway, it helps you understand and speak their language, and drive the product forward.
Wireframes help you ideate quickly, gather feedback, show complex flows, and build alignment across teams. Having a basic knowledge of how to wireframe is a PM superpower!
|
|
Happy customer of the month
|
|
Where would Visual Studio be if there was no @balsamiq?! — Sayed I. Hashimi, Senior Program Manager at Microsoft
|
|
Product news
|
 |
|
|
As usual, we did our monthly release. This one had some performance improvements when launching the app, and some bug fixes.
We also fixed a few potential security issues, and worked on quite a few behind-the-scenes chores.
We are working on some exciting new features, which will come out in the next few months. Stay tuned!
|
|
Wireframing Academy news
|
 |
|
|
We are still hard at work in the latter phases of editing our book about wireframing, to be published by A Book Apart. We’re so grateful to have awesome editors there to work with – they’re helping us make it so much better. We’re eager to get it out there, but, as in wireframing, iteration is key!
In the meantime, enjoy our latest article, called “How to Help People Avoid and Recover From Errors in Your UI Design”. It’s got some great, simple tips in written and video form, by our amazing collaborator Donna Spencer.
Last, but not least, our next webinar is on July 21st at the usual time. We’re trying something a little different this time and asking you to do a wireframing exercise before or during the session so that we can give you live feedback. We’re calling it “A Hands-On Introduction to UI Design with Wireframes”. Visit our Webinars page for details and to sign up!
|
|
Work continues on many fronts. We’re interviewing candidates for our Business Manager position, we’re adjusting to our new organizational structure, and I co-hosted the Bootstrapped podcast once again, this time talking about sponsorships.
- Help us make Balsamiq Better! Come talk to us about how you found us, and how we can improve Balsamiq for you!
- Notable recipients of our Free Software Program:
- ACEM is the non-profit organization responsible for training emergency physicians and advancement of professional standards in emergency medicine in Australia and New Zealand.
- A Moment of Magic provides programs and initiatives to help lift the psychological burden many medically underserved children and families experience.
- Red Skelton Rescue & Service Dog Society provides service dogs to military Veterans suffering from post-traumatic stress, traumatic brain injury, and military sexual trauma, working to prevent suicide and improve military Veterans’ mental health.
|
|
That's it for this month!
|
|
As you saw, there are lots of arguments in favor of PMs (and other stakeholders) creating wireframes. Not always EVERY wireframe, mind you, but some anyways. 😊
Let us know your thoughts by replying to this email!
|
|
 |
Peldi for the Balsamiq Team |
|
|
Most new customers find Balsamiq via recommendation...
|
|
If you know someone who might enjoy this newsletter, we would be most grateful for the introduction. Could you please forward this email to them?
If this newsletter was forwarded to you, please subscribe!
|
|
|
|
|
