Live Wireframing

Workshops are obviously a great way of exchanging ideas and pushing the design process forward but they are also a fantastic opportunity to strengthen the bond with the client and instill in them a sense of ownership.

Recently, we conducted a series of concepting workshops with a client based several timezones and a few thousand miles away. Time being scarce, we needed to use the face-to-face time we had with them as efficiently as possible.

Instead of working independently and sharing completed wireframes to the client, we ran a live wireframing workshop which would give us wireframes of key flows and also be approved by the client on the spot.

A whiteboard with a defined screen area was set up with a webcam pointed at it. The webcam pushed a live feed to a laptop running LiveView, software which allows you to view designs on a monitor on an iOS device. This allowed us to preview sketches on the device as we drew on the whiteboard.

livewireframing 1

Having the ability to quickly show the client how screens worked on the device, we were able to work through a large amount of iterations by instantly seeing what was working and what wasn't.

More importantly, we brought the client into the design process by encouraging them to involve themselves in creating wireframes. Initially the client was apprehensive about approaching the whiteboard but as the session went on they began to enjoy themselves and the ideas kept coming. Communicating with sketches also helped ease linguistic differences. By getting the client to express themselves with Sharpies rather than words the communication flowed more readily.

livewireframing 2

The impermanent nature of whiteboards are ideal for this as it encourages participants to labour less over fine details and instead try as many things as possible.

Whiteboards are also more conducive to conversation. By standing around a central focus which everyone can see and can point at, add to and subtract from, discussion flows freely, and this discussion helped us arrive at our solution whilst strengthening our relationship with the client.

The constant engagement with the client gave them a sense of shared ownership. By involving them in design decisions we fostered trust and understanding in one session which would have taken weeks of wireframes and emails back and forward otherwise.

When the live wireframing session finished we used the best designs captured to build a prototype of the product, as designed by the client with a guiding hand from us. T

he client then had an artefact to take back with them which they could sell to their stakeholders and be able to articulate everything good about it because they were involved in the process.

livewireframing 5

Sharing the journey with the client and being transparent is key to establishing trust. By involving a client from the early stages they become more invested in the project which is essential to guarantee a great final product.

You can view a time lapse of a session below. Embedded content:

Video credit: Shaun Tollerton