Wireframing for Bentley Motors

Wireframing is one of those nuts and bolts jobs that all UX designers must have as part of their toolset. If you're working lean chances are you're relying on marker and paper, if you have more time perhaps you're using Balsamiq, if you're lucky enough to have a good lead in or are exploring options you're probably using Axure - my personal preference - or even Visio or Omnigraffle.
It doesn't matter what you use, wireframing is an essential for communicating ideas quickly and effectively. That was never more apparent than working with the rapidly changing demands of Bentley Motors.

Touch Interaction

At this stage the Business Requirements and System Design had been largely agreed, which was unfortunate as the system design was based on mouse not touch interaction. So my first task was to take the existing interaction design - including mouseovers - and introduce finger friendly navigation and interaction.

Documentation Redesign

The existing designs were drawn up in Adobe InDesign, perfect for presentation but less so for rapid interactive prototyping, so my second task was to recreate and redesign these in Axure. Given the time restraints this meant that a certain amount of the polish had to go as well, however that wasn't a bad thing as it allowed the Stakeholders to concentrate on the UX rather than the style of the UI.

Information Architecture (IA)

The underlying site structure and navigation was the next step, luckily I was working with an exceptional IA and together we developed the taxonomy and reconstructed the content map, making it simple, more manageable and logical.

Wireframe Prototypes

A series of rapid prototypes, including mobile versions, were created and tested with the results feeding back into my designs to ensure that user requirements shaped the new site structure and interface design and also ensuring that changing business needs were continuously met.

High Fidelity Wireframes

As the wireframes became closer to the final iteration I started working with the Creative Design Team to construct a real High-Fidelity prototype and with the Development Team to produce Functional Specifications, marrying the graphics to the interaction and content and then on to the code, a mixture of HTML5, CSS3 and JQuery. The final solution was handed over in October 2011.