From wireframes to design

What do we do to ensure that our fantastic wireframes inspire fantastic graphic design and ultimately create a fantastic website?

What is a wireframe?

“A wireframe is a stripped-down visual representation of a single web page, devoid of any graphic treatment”

Definition from Strange Systems.

What are wireframes used for?

I spend a lot of time here at cxpartners creating wireframes. They are used to generate ideas, test with users, gain client signoff and ultimately create a blueprint for the website or application I’m working on.

Deliver the deck

What happens after I’ve delivered my wireframe deck to the development team? The back- and front-end programmers work their magic, the copywriters sharpen their pencils and the graphic designers need to apply their design concepts to the pages defined in the wireframes.

Don’t colour in the wireframes

Information architects often joke that a graphic designer’s task is to colour in wireframes – all the navigation and content is there (literally) in black and white, so the designer just needs to wave the corporate colours over the deck and the job’s a good ‘un.
This exposes a potential conflict between graphic design and information architecture – at what point does one person’s job end and another begin? How does it feel when a hefty wireframe deck lands on a graphic designer’s desk, and they feel that the only remaining task is to get the coloured pencils out? The last thing I want a designer to feel is that their creativity is stifled by the constraints of the wireframes.

Involve the designers from the start

Which is why cxpartners advocates a user-centred design process that involves key stakeholders from the outset. Stakeholders include clients and end-users, as well as coders and designers. Get whiteboarding with them from day one. Include them in key decisions. Bring them along to user testing. User-test early graphic design ideas. Ensure they see the wireframes evolve over time, and can influence that process.

Ownership & understanding

A designer with ownership and understanding of the wireframes will be able to interpret them with flexibility and creativity long after the original project has been delivered. Websites are constantly evolving and a design team with a thorough understanding of the thinking behind the wireframes will be able to make tweaks and additions whilst maintaining a great customer experience.

Ongoing relationship

I love to see my wireframes come to life, so of course cxpartners makes itself available to the production team throughout the design and development process. A quick phone call is usually all it takes to answer any questions. And I get to see my wireframes woven together with clever code and great graphic design into a website with fantastic user experience...

Find out more:

Wireframing and prototyping