Comments on What You Should Know About Prototypes for User Testing

David Frahm — Thu, 01 Jul 2010 11:41:14 GMT

If you or the customer want hi-fi prototypes, then great – but why not work with the graphic designer to produce them? The comments here are as if the designer doesn’t even exist until the prototype is approved.

Everyone knows that IA and Graphic Design overlap considerably. Each person in those roles should allow the overlap to be worked on with the other.

anonymous — Tue, 11 Jan 2011 03:40:00 GMT

>I laughed out loud at that. How often does the >final visual design look like a “prettied up” version >of the wireframes?

>Truth is, most IAs want to be designers as well. >It’s a control thing.

If a design ends up being a “prettied up” version of the wireframe then that is the sole fault of the web designer or graphic artists who created the design.
There are pros and cons to using high, medium and low fidelty prototypes. The only way you can use low fidelity prototype wireframes is if you have an artist who is creative enough to look past the lines drawn on a wireframe to create something spectacular and origional, and if you have a marketer who can suspend reality and use their imagination when discussing wireframe layouts. A true internet marketer should be able to distinguish the difference between a wireframe and a design.

dkr — Fri, 26 Jan 2007 14:50:29 GMT

Just a quick one – great article, good points. One thing I can say from experience is that most times this really depends of who you are going to be showing this prototype to. I would never show a client, a marketing person or a designer a fully (heck anything that looks “done” at all – even halfway) rendered prototype – you’re just asking for a world of hurt.

It’ll be very hard to get them to suspend belief (read: judgement) long enough to get some good information out of them and you run the risk of them liking or disliking it too much.

I tend to like the low fidelity approach, but sometimes I like to show feedback and interactivity, again, depending on who I’m working with – I’ve found it best to do this as minimally as possible.

Tom Spitzer — Fri, 26 Jan 2007 14:50:29 GMT

First of all, let me remind you that its ‘Spitzer’. Certainly I’m in violent agreement with most of what Chris wrote.

I’d only add that in the last year we have been designing consumer kiosk and business applications that get developed in C#, so prototyping in HTML is completely out of the question! John Armitage joined us, having previously worked for Aaron Marcus and Viant, and brought expertise prototyping in Macromedia Director. We have found that Director can be a very powerful tool for medium fidelity prototyping, as well as for adding graphical elements once the core workflows are established. Our process has evolved into writing scenarios, animating the scenarios with black and white Director wireframes, getting user feedback, and then building out software support for the scenario.

We’re happy with this process. For recent projects, its been important that our prototypes include controls for display/edit of all the information that the application deals with (our users are librarians – if we miss a field, its a big deal), so the fidelity has been high from the standpoint of information content, but low from the standpoint of graphical treatment.

We’re in a between project breather and (because product development is in Jack’s and my blood) thinking about how to build a set of tools to enforce the process and open it up to other tools besides Director for wireframe production. Director is especially good because its easy to manage a library of reusable UI components (the cast).

- cheers

Boris — Fri, 26 Jan 2007 14:50:29 GMT

(at the risk of starting a thread.. :)

I guess the point I was trying to make was that low fidelity prototyping, in a situation where you need to share it with other people, is rather limiting due to ambiguity caused by “not all the elements being present” and invariably leads to misunderstandings. Many people are not able to fully conceptualise architecture and linking etc etc etc.

Cost is no issue when you have a quick HTML based prototyping tool. (and I really mean basic here… No grpahics no nuthing, just a site structure, navigation system and wireframe/”page description diagram” boxes.)

I’ve developed everything from brochure websites (“hi, this is our company, thanks for visiting”) to full blown e-commerce systems (world wide online grocery shopping network)... But my specialty is web-based GUIs for embedded systems (wireless LAN routers, etc). In the 8 years I’ve been doing this I’ve dealt with mom-and-pop business owners, top-tier executives, management types of all levels and all departments and ultra-brainiac engineers and scientists. NEVER have I dealt with a “client” who could or wanted to understand the underlying process. “Show me what you are going to do” or “show me what you want me to do” is what it’s always about.

And it is important to adapt, tailor your output for the person who is going to recieve it. Don’t show a CEO the taxonomy, and don’t hand a designer a page layout design.

;)

lsq — Fri, 26 Jan 2007 14:50:29 GMT

I strongly disagree with Boris—I’ve tested many a site with low fidelity prototype (vision wireframes being my prototype of choice) and find them an invaluable tool. It does, I imagine, depend on what you’re trying to get out of the test.

With the strongly functional sites that I work in, I’m testing to look for:
- do users understand the gist of the navigation? (and sure, a take-away might be that a particular element needs more graphic prominance, but you’re also going to get great feedback on how your scheme fits into their conception of things)
- am the prototype missing things functionally that people expect—i.e. features, fields, etc
- how does the flow in accomplishing tasks work for them?

The cheapness and earliness of the process (if I’m using wireframes, generally I’m going to do them anyway) to my mind altogether makes up for any mis-understandings caused by lack of graphic design. And then you can test the graphic design later when you’re sure that the foundation is solid.

Boris — Fri, 26 Jan 2007 14:50:29 GMT

Low fidelity prototyping is only good when presenting to other IA’s / people in the dev team who have the brains to “fill in the blanks”. I have been in enough meetings with marketing (or whoever thinks they are in charge) with hand drawn layouts and paper trees and entire week long discussions only to in the end hear “oh, we didn’t *get it* that way…”

It’s all about details people! The more elements you make clear, the better the communication. When protyping a web project, the key elements to convey are:
1- what content goes where
2- how do i get from here to there
3- how did I get from there to here
4- (arguably) how the content is layed-out on the screen. (not in my book but anyways, it makes VP feel happy when they see a layout even though they don’t get the context).

SO.. high fidelity my friends. “The devil is in the details”. “Ambiguity: the devil’s volleyball…” (No I ain’t no christian freak, I just like good quotes ;)

SO, I guess I should someday make public my PHP-based rapid site prototyping system… build up an entire site architecture in minutes, and even set complete wireframes of layouts using CSS.. also in minutes… And the best part? Once the client/boss signs off, you slap in some colors and graphics and the site is done! Bwahahahahaha…

Cheers !

Dan Kapusta — Tue, 11 Jan 2011 03:40:01 GMT

I’ve worked on several large-ish scale prototypes (from 10 to 50+ pages (paper and HTML)) in the past and count myself on the high fidelity team. The basic reason why is the ‘suspension of disbelief’ issue seems to rear its head everytime I present a prototype. Rather than bore folks with the longer story here, I’ve blogged my experience…

http://inmyexperience.com/archives/000164.shtml

Excellent article Chris.

Chris Farnum — Fri, 26 Jan 2007 14:50:29 GMT

J-
I think it depends enormously on the personalities involved. It also depends on their skill sets. I find that when I work with highly creative graphic designers I need to really keep the level of visual detail low-end on my deliverables so that I don’t step on toes. Sometimes, text-only description is the way to go. When I work with programmers or other folks less interested in visual design, I tend to offer more detail. Many times in the past I’ve groaned when I have seen a final design stick too close to my wireframe layout. One of the best antidotes is to communicate as much as possible with the rest of the team so that they get a good sense of which aspects of your wireframes are open to interpretation.

Now, wireframes that you create to use as prototypes on the other hand often need to have some sort of rudimentary visual design applied. The trick is to try to get the respondents to NOT react to your clunky layout. Again, communication is helpful. Another trick is the pencil sketch idea I mentioned in the article. If the respondents see that the design is hand drawn and rough, they are less likely to take the visual design seriously.

j. hatfield — Fri, 26 Jan 2007 14:50:29 GMT

i am an ia and would sometimes love to be a visual designer as well, but, alas, (sigh) i have no talent in the visual realm.

it would be great to be a one man/woman show, but that’s usually not how it works, right?

wireframes are tricky since there is overlap between identification of functional page elements and how to position them on the page from a usability perspective (another overlap area).

ow does one often deal with this? does it depend on the personalities invoved?

Steve — Tue, 11 Jan 2011 03:40:02 GMT

> I laughed out loud at that. How often does the final visual
> design look like a “prettied up” version of the wireframes?

> Truth is, most IAs want to be designers as well. It’s a control thing.

I agree, many times I’ve created wireframes, the finished design also ends up being a “prettied up” wireframe design.

On the other hand, I’ve created well laid out wireframes which make clear hierarchical sense, only to find the designer has ripped apart all the page elements with a completely different design layout, that actually looks more confusing than the original wireframe.

Is this a case of designers trying to be IAs? I think this ‘control thing’ works both ways.

David — Tue, 11 Jan 2011 03:40:02 GMT

> An information architecture wireframe
> is NOT graphic design. I swear, it’s really not!!!

I laughed out loud at that. How often does the final visual design look like a “prettied up” version of the wireframes?

Truth is, most IAs want to be designers as well. It’s a control thing.

Cheers, d