Why Wireframe?

Caryn Farvour (Humphreys)
Vehikl News
Published in
2 min readJan 7, 2015

--

Wireframing is a highly valuable step in planning your development project. Wireframes can save you time, money and effort down the line by planning out architecture, functionality and content before ever beginning design or development.

Prototyping with wireframing allows designers to test various options for an application to ensure essential usability heuristics are met to create an effective user experience. The strongest business case is how fast and inexpensive it is to test ideas in wireframes with users so that once development starts, there is no question of the value of what is being designed.

What is Wireframing?

No… not this type of blueprint (image credit: Robert Lattin)

Wireframes are the architectural blueprint for your application. They are an illustration of the layout of an application.

A wireframe narrows the focus down to what is most important: how will it be put together, what goes on each page, where that content goes, why it goes there, how the application will display its status, and how it will respond to users.

In the example below from Dale Cody, you can see that the focus is less on the details of the content and more on how the content is arranged.

(image credit: Dale Cody)

What about the client?

Clients who aren’t familiar with wireframing, or working with User Experience designers (or whatever other multi-flavored title they may boast), may insist on seeing visuals early on in the project. They may ask your visual designers for mockups to show them ideas for colors, typefaces, and general ‘look and feel’. If you absolutely cannot convince your client of the value of plan before design, be sure to emphasize clearly (and often) that the mockups will, in no way, reflect final designs once the wireframing has gone through all its iterations and has landed on its final version.

Where does Visual Design fit in?

Client preferences for visuals and branding are important and valuable. Visual designers should be responsible for understanding the client’s needs to ensure that they are met once the wireframes are set and the project moves into visual design.

Cool Wireframe Resources

TutsPlus: A Beginner’s Guide to Wireframing

Wireframes Magazine

Web Without Words

I ♥ wireframes

Wirify

Originally published at transmission.vehikl.com on January 7, 2015.

--

--

Caryn Farvour (Humphreys)
Vehikl News

UX Designer, UI Developer, PC gamer, bibliophile, board gamer, coffee drinker, painter, photographer, unapologetic smartass.