Rapid Wireframing: What It Is & How to Do It

By Chelsea

a FigJam board screenshot. It shows stickers and colorful boxes outlining where to start, and how to use the tool.

Key Takeaways:

  • Rapid wireframing/design workshops are a great way to turn a weeks-long process into a 2-3 hour generative brainstorm.
  • Identifying 1-2 specific enhancements for this kind of workshop is key; it is not conducive to a full website redesign.
  • Rapid wireframing is ideal for fostering collaboration and building consensus among stakeholders.

An opportunity to speed up the wireframe and design process.

The wireframing and design process between agency and client typically follows a “we present and you give feedback” cadence, which can often lead to many rounds of back-and-forth around content organization, hierarchy, user pathways, and key elements.

Rapid wireframing or design workshops are a great way to circumvent that back-and-forth, and turn what is typically a weeks-long process into a 2-3 hour generative brainstorm where individuals from both the agency and the client side participate and share ideas. The concept is also known as “rapid prototyping” or “design studio.”

So, how does a rapid wireframing or design workshop work?

Rapid wireframing/design workshops consist of fast, iterative cycles of creating low-fidelity mockups that are then refined by the larger group. They can be done in small or large groups, but are most successful when participants have a foundational understanding of wireframing and/or the design elements already available on their organization’s website.

In practice, participants get a few short minutes to sketch out their ideas around how something might work on the website. This works best for discrete experiences that need optimization, like a particular user flow (ex. signing up for an email newsletter), a specific page (ex. homepage), or a big feature on your site (ex. interactive map). It pushes the most important priorities to the top, whether they are ideas, concerns, or barriers, allowing agency and client teams to identify key points of discussion in just a few hours.

The best parts about rapid wireframing? It gets everyone’s ideas out there quickly, allows the group to build on the best ones, and is a creative and fun event to inject into the workday.

An example of rapid wireframing and design in practice.

We recently partnered with our client Freedom House, an international democracy watchdog, to align on a vision for their country-specific pages and enhancements to the Freedom Map. We had two very specific scopes, and with a small team of just 2 clients and 4 ThinkShout staff, and did a one-hour rapid wireframing workshop for each.

The workshop itself started by giving each individual 7 minutes to sketch out their initial thoughts on the new feature. Each person then got 3 minutes to present their sketch to the whole group, followed by 1 minute of rapid feedback from the group that helped to identify the ideas everyone was excited about.

Typically, we would have gone through a second round of rapid wireframing, but time was tight and we had a small number of participants. Instead of a second round of rapid wireframing, we spent 10-15 minutes as a full group creating a second draft together.

In just an hour’s time, everyone had a chance to write down and communicate their thoughts, and build alignment on what would be designed in the next phase.

What could a rapid wireframing or design workshop do for you?

Even though one of the biggest benefits of rapid wireframing is speeding up the design process, that’s not the only one. It’s ideal for fostering collaboration and building consensus among stakeholders, and ultimately creating a better user experience.

If you’re interested in exploring this approach with a feature or page on your site, we’d love to help.

Love design workshops?

Get in touch