Tips to Utilize Wireframes to Tell an Effective Product Story
Summary
Key Insights
-
•
Staying in low-fidelity wireframes during early concept phases enables quicker iteration and focused problem-solving.
-
•
Collaborative sketching sessions with multiple rounds build trust and generate stronger, shared concepts.
-
•
Using thick markers for sketching helps keep ideas high-level and prevents premature focus on details.
-
•
Wireframes should be crafted digitally to look polished and presentable, even if low fidelity.
-
•
Leveraging existing UI patterns or design system components maintains consistency and speeds up wireframe creation.
-
•
Presenting wireframes within the full context of the product and user flow aids stakeholder understanding.
-
•
Leaving ambiguous areas in wireframes as question marks encourages constructive feedback and discussions.
-
•
Storytelling in presentations, including personas, problem statements, and business impact, improves stakeholder buy-in.
-
•
Content design should be integrated early during wireframe development, pairing writers with designers.
-
•
Low-fidelity wireframes can and should be created by non-designers with the right tools and team collaboration.
Notable Quotes
"Staying in low fidelity throughout this early concept development phase allows for really strict focus on the problem slash solution space."
"Wire frames plus a little bit of storytelling is awesome."
"There’s nothing aesthetic to grab onto, so you’re not gonna be focusing on type styles, fonts, colors, photos."
"I want your sketching to be really high level—I want you to explore concepts, not refine content."
"Low fidelity does not mean low quality."
"If you don’t know what should go in a specific area, it is really powerful to leave it as a question mark."
"Tell a story of design: start with the background, introduce the users, demonstrate how it will work."
"Be very clear on exactly what type of feedback you’re looking for because you’re gonna get a lot better feedback."
"I find the existing patterns in my product and use those because it’s easier to bring things back in."
"Non-designers can build wireframes really quickly using easy drag-and-drop components from a design system."
Or choose a question:
More Videos
"Are you creative? Such a loaded question, isn't it?"
Dr. Karl JeffriesThe Science of Creativity for DesignOps
January 8, 2024
"Making your chief legal officer your best friend as a designer makes a lot of sense."
Amy MarquezINVEST: Discussion
June 15, 2018
"The core of it is really putting yourself in that other person’s shoes—it’s basic but essential empathy."
Steve Portigal Chris Chapo Kelly Goto Christian RohrerDiscussion
May 13, 2015
"Dedicated staffing gives designers deep vertical mastery but limits horizontal experience."
Alicia MootyDesign Staffing Models
September 30, 2021
"We may not have tech prowess but our sticky notes, card sorts, and test reports are our real superpowers."
Ana Maria Montero Barrantes Aditi Dhar Michelle Kaplan Nate Osborne Matt LaurenceThe Authentic UX Talent Show
January 8, 2024
"You can’t really advocate for UX or move an organization forward without interacting with your team and business colleagues."
Lada Gorlenko Sharbani Dhar Sébastien Malo Rob Mitzel Ivana Ng Michal Anne RogondinoTheme 1: Discussion
January 8, 2024
"The legacy of folders and nested structures causes real problems in finding research and scaling repositories."
Sofia QuinteroThe Product Philosophy Behind EnjoyHQ
March 10, 2021
"Innovation is very much a team sport."
Laura KleinUnique challenges of innovation in enterprises
April 23, 2020
"You’ve got to take control of the backlog and position your team as value-driven, not just servicing individual teams."
Andrew MichaelBuilding a Product Insights Team
March 10, 2022
