Why Wire Frames Need Design

UX professionals shouldn't be afraid of stepping on the toes of web designers! That is the message from Stephen Turberk over at UX'ers home turf Boxes And Arrows.

Turbek recounts how a black and white wireframe can often alienate it's audience because it is so far from looking like the real thing. This is especially a problem when conducting usability tests with wireframes, writes Turbek:

"Visual affordances, such as color and underlining links are key to using a site, and these cues make a significant difference in a usability test. Users cannot confidently predict how they would use a page if they don’t recognize links or can’t read what the page expects them to."

I tend to agree with Turbek and see a necessity for including such basic elements as logos,  brand colors and some graphics when wireframing. Otherwise the person or group who are giving feedback will be too far removed from the onset. Over time this practice has landed me quite a few comments from both UX colleagues and web designers who think I have stepped over the line. It seems to be the common perception that wireframes ought to be toned down - invisible almost! 

Like me, Stephen Turbek doesn't think so and puts it this way:

"Just because project teams understand the purpose of wire frames, that doesn’t mean everyone will. Similar to listening to someone sing out loud to his iPod: we only hear the singing, while the person hears the whole orchestra. Likewise, the test subject knows only that “the page isn’t going to look like what they see,” but what they see is all they have to react to."

Eloquently put!

Share on Facebook |

Comments

[Andrea]

Henrik,

Thanks for sharing this information. While graybox wireframing is great for internal teams or clients with technical backgrounds, many clients simply don't connect simple wireframes with more detailed ones. Wireframes and prototypes don't need to be completely polished off for clients to understand how the website works, but they do need to be able to interact with the wireframes to get past confusion.

If you haven't yet tried ProtoShare, I'd be interested in gaining your feedback on implementing a web-based collaborative tool into your wireframing process. Feel free to contact me for a free trial.

Andrea
andrea [at] protoshare.com

[Henrik Harsbo]

Hi Andrea

I use Axure RP for my wire frames - and I like it a lot. I haven't tried ProtoShare. What are the main advantages?

Cheers

Henrik