Wirestorming: An innovative, collaborative way to design
Here at Sunlight, we’re always developing new apps and tools to hold government more accountable. We often have to build websites for these tools, so wireframing — creating a visual guide that represents the framework of a website — is an important step in the design process.
The Sunlight team has starting using an extremely effective process at crafting a first-draft wireframe called “wirestorming.” Wirestorming is an innovative and collaborative way to create a wireframe, straying from the archaic notion that they are for designers and designers alone. The essential component of wirestorming is involving people across departments while wireframing to get a more complete perspective of how it should look. During previous wirestorming sessions at Sunlight, for example, we’ve included developers and the communications teams; after all, the tech folks are the ones who build the things and the communications team are ones who will be marketing the things, so each group has something to add to the design process.
Our key responsibility as a design team is to distill complicated ideas and features to lucid visuals and concepts, but we can’t make crucial decisions during this process without understanding these ideas and features first; wirestorming helps us achieve this understanding.
working on the floor with awesome for an awesome collaborative wirestorm session today!
(wireframe brainstorming) pic.twitter.com/dmQQ3ejgFR
— Olivia Cheng (@heyits0livia) July 23, 2015
I fell on wirestorming by chance when I was invited by the fine folks at 18F to join a website redesign meeting with the FEC they were hosting. I was struck by how effective it was! I was shoulder to shoulder with customer service, operations and an executive — with Sharpies and notebooks in hand. We were all equal. I could feel the gap between design and client become closer during this process, and it was then that I became addicted. I left with the question: “Why do we, as designers, spend countless hours solo behind a computer solving problems that we could solve in minutes with the folks who know the problem to be solved better than we do?”
So I brought the idea of wirestorming back to Sunlight, and it’s been a successful process in crafting multiple projects. In one instance, we worked with the criminal justice and crime labs teams, and it was amazing to see how the team came forth and ended up talking and wireframing more than me, the designer. It was both exciting and humbling.
We had about three dozen questions that spoke to problems we wanted to solve, each one called a “How Might We.” (For example, “How might we remove some clutter from this page?”) These three words append each statement, offering thought and a chance to to solve a problem. The group did a quick vote to help narrow down our problem statements to five that we wanted to address on the homepage and the rest of the site.
Wireframes are not just for designers #uxdesign #UXhuddle @sunlightlabs pic.twitter.com/6dj4HLouJS
— Nikki Grad (@nikgrad) July 23, 2015
Once these were identified, we jotted them down in a Google Doc that was projected onto a big screen so everyone could view them clearly. Breaking into two groups of five, we then huddled with Sharpies and notebooks to take a first stab at features and content that would support those problem statements. We drew black lines which became buttons, text, maps and other features. The groups started thinking critically about the datasets that were collected, how we wanted folks to access the data and the overall story we want to tell. Everyone was able to have their voice heard in creating the look of this new tool, making the design process easier and ultimately forming a better product.
Wirestorming has proven to be an effective strategy to design new websites and tools here at Sunlight, and we highly encourage others to try it!