June 9

Wasting time with static wireframes?

We’re specifically referring here to wireframes that are whipped up in one of many free online wireframing tools, exported to a PDF and emailed over to clients for feedback, tweaked and changed accordingly, sent back to the client etc… etc… etc…

Image

What’s wrong with static wireframes?

As a starting point, nothing, but as the be-all and end-all of your website structure, quite a bit.

Firstly, after several rounds of amends you can end up locking yourself into a particular layout or hierarchy which may ultimately land designers with a paint by numbers approach to the design of the site, boring.

Secondly, the website/application being built is going to be served up to a browser on a variety of different devices and navigated in multiple different ways, not (like many static wireframes would be) passed around on a piece of paper in a meeting room.

Most importantly, how can anyone feel confident about a user journey by staring at printed pieces of paper, how can you ensure that your calls to action have enough prominence and lead your users on a logical journey through your website whilst scrolling through pages of a PDF. In our opinion, you can’t.

 

Clickable wireframes vs. MVP

I’ll make one exception for static wireframing here. If you are going to start developing clickable wireframes, getting out a pen and paper and sketching out some static wireframes can be an great internal starting point while you brainstorm ideas and before developers start whipping up code.

In this day and age there are so many open source front-end frameworks available, (even Buzzfeed has released one) developing clickable wireframes has become a breeze. Here at Eight Arms HQ, we use a custom framework based on Bootstrap to create super stripped back interactive prototypes of our sites and applications. If you don’t want to get your hands dirty there are other ux tools available that don’t require any coding.

Once built we present our wireframes to our clients and go through an Agile-style process of testing, collating feedback, refining, re-testing until we have something that will serve as a good basis to start the designs from.

 

So what’s the advantage of clickable wireframes?

Ultimately, they allow for a much more collaborative process and much higher level of engagement between us and our clients. It means that quick iterations can be built, tested and refined. It ensures that the key user journeys, calls to action and functionality are all nailed and tested in browser before we start designing anything, and most importantly it allows for a more considered, functional and effective end result.