Most design processes have a step that puts a product team in front of stakeholders, with the goal of getting their approval on design decisions. It’s a crucial step because the faster you get buy-in on your designs, the more time you can invest in building a real solution. Many young designers incorrectly assume that getting approval on their work at this point is achieved by creating the best design possible; however, stakeholders may not buy into the work if the objectives of the design are not clear to them.
It’s your job as a designer to communicate design decisions so that everyone who sees your design gets a deeper understanding of your vision. This is not an easy task, especially when you’re at the beginning of the design process and need to rely on static design artifacts, such as sketches or wireframes.
Wireframes are particularly hard for stakeholders to conceptualize and force reviewers to use their imagination to understand how something will look and work once it is finished. The next time you’re presenting wireframes to stakeholders, follow a few simple rules to increase your chances of success. The following list of wireframe best practices will help you conduct effective presentations.
Use PDFs for presentations
While wireframes can be presented using prototyping tools, using PDFs is a much better solution when presenting. This format is easily accessible; it doesn’t require installing any additional software or creating accounts with online tools. Stakeholders can download a PDF file, view it offline, and prepare a set of questions before the actual presentation, making the time you have together more productive.
Explain what they see
A wireframe is used primarily by designers. Most stakeholders have never come across these UI tools before. When presenting wireframes to clients, remember that this could be their first time seeing one, and there will be a learning curve that you need to manage.
False impression is a typical problem during wireframe reviews. This happens when stakeholders see your wireframes and assume that the visual design at this stage (all those boxes and arrows) will be the same as the visual design at the end of the design process. It’s not that uncommon to hear, “Well, I don’t like that the design is in black and white. Can we add colors and visuals into the layout?” When you receive such comments, explain that what stakeholders are looking at is just a concept, and then get them to focus on the type of feedback you want them to share. Better yet, set those expectations before you even begin.
Provide examples and references
Wireframing is a technique of using basic design elements to share complex concepts. Not everyone has the imagination or background necessary to understand how a finished product will look or work based on a few grey boxes, and this likely may include your stakeholders.
You can make it easier for people to imagine the future state of a project by pairing wireframes with real-world examples that are aligned with your overall design direction. These might be works of other designers from Behance or Dribbble or even real-world apps or websites that you want to use as a reference for your design.
Combine the references in the format of a mood board and rely on it during the presentation. By doing so, you make it easier for stakeholders to understand the outcome they will have at the end of the design process.
A mood board is a collage of screens and UI elements that communicates the direction of a design. Image credit Ludmila Shevchenko. Validate the flow
Clarity is an essential property of good design—this is true when presenting wireframes to clients too. Ensure that all wireframes in your presentation have clear labels or numbers and that they are arranged in the correct order that you want them to be presented. Before sending the presentation to your stakeholders, review the flow according to the logic of how an individual would maneuver through the website. Do not review this during the actual presentation. Each wireframe in your flow should feel like part of the same story.
Focus on the needs of your stakeholders
Typically, business executives measure design using conversion metrics. They want to know when and how users start using the product and at what steps of the user journey they convert (e.g., purchase products, subscribe for newsletters, and ask for more info). It’s important to focus on the return of investment (ROI) drivers, such as increased sales, lead generation, increased productivity, or long-term user loyalty when presenting your design decisions. The Business Model Canvas is a helpful reference when talking to stakeholders about customer relationships.
The Business Model Canvas is a lean start-up template for developing new or documenting existing business models. Image credit Wikipedia.Avoid using UX jargon
The UX community has its own language. Designers describe what they do using special terms—heuristic analysis, tree testing, and error-prone conditions. Stakeholders, who are most often business executives, are not part of this community. To conduct an effective presentation, speak the language that your target audience understands. It’s better to avoid specific design techniques and rely on simple terms that everyone can understand, no matter what field they work in.
Don’t rely on the slides to deliver your message
Designers typically format their presentations with slides to effectively demonstrate the wireframe for their audience. The basic rule of a good presentation is simple: “Don’t make your audience read your slides.” It’s best to keep the text to a minimum. Your audience wants to hear you speak, not read lengthy notes.
Avoid presenting everything all at once
Every presentation should focus on one aspect of your design or a specific idea that you want to share with your audience. It’s better to avoid sharing too many details at once. If you have more than 10 wireframes to show, stop for a moment and think about what message you want to convey in your presentation and how you can help the audience best absorb the information.
Use a storytelling format
Presenting wireframes without context are meaningless. When stakeholders don’t have context, they evaluate wireframes as a collection of individual screens, not as a specific flow. Plus, it’s tough to critique a design without knowing a user’s goal.
It’s helpful to use a storytelling approach to present your wireframes. Organize a set of screens in the context of a scenario in which your user plays a vital role in navigating through your website mockup tool. Use the storyboarding technique to visualize the journey. A scenario should demonstrate the user’s motivation for the action, the end goal they have, and how they plan to achieve this goal. If you have existing personas, you can rely on them in your scenarios. This approach will help your audience better understand what you’re showing them and visualize the user experience.
Annotate your design
Speak to the key points and functionality in your design. Your comments should create context around the interaction and highlight important moments. But don’t go too far. There’s no need to annotate every single piece of your wireframe. Focus only on key elements or areas to keep the presentation clean and useful.
Only annotate essential parts of your design. Image credit Ben Hayward. Create a simple prototype using wireframe screens
Most people better understand how things work when they can interact with the design. Wireframe tools like Adobe XD make it relatively easy to turn static wireframes into a low-fidelity prototype, which will be available online. You can embed the prototype link in a slide at the end of your presentation, providing stakeholders with an opportunity to develop a deeper understanding of how your design will work.
Create prototypes from wireframes using Adobe XD. Image credit Adobe.Practice presenting wireframes
Conveying a future state of your design is a challenge, especially when you’re only at the beginning of the design process. Familiarize yourself with wireframing fundamentals and be ready to experiment and try various approaches when presenting your ideas. Practice makes perfect: You’ll soon get to the point where you’re able to use only basic elements, like those boxes and arrows, to present complex ideas with maximum clarity.