How do you prototype?
The USiT team has had a running conversation of late about prototyping techniques and tools. We have been debating the value of sketching, both in terms of quickly producing and documenting ideas as well as for prototyping (where low fidelity can be a useful attribute when putting designs in front of a user).
Some of this was exposed through the comments on a recent blog post regarding wireframes, in particular Chris’ comment on a sketchy wireframe stencil. So we’ve collectively been thinking about documenting and prototyping and how important “sketchiness” is.
To further fuel the discussion, I want to refer to Russell Wilson’s review of 16 user interface prototyping tools. I like how he categorises his “picks” into “Low fidelity mockups for idea exploration and communication”, “Interactive prototypes to test and communicate interactions” and “High fidelity drawing tool”. This is much more useful than saying one uses Axure (for instance) to prototype, like any one tool or technique could ever fit all situations. There are some interesting comments on Russell’s post too.
Also on this topic, Todd Warfel is running a survey on prototyping tools for his upcoming book. Be sure to check it out and have your say, this is adding some clarity around the various characteristics and pros and cons of prototyping techniques that will be of use to the entire community.
And it will help answer the question raised in the title of this post :)
A related link mockupstogo.net
It’s a site with: “A user-contributed collection of ready-to-use UI components and design patterns built using Balsamiq Mockups.”
Also I agree with Bill Buxton in Sketching the User Interface (p295) where he says:
Another thought; while I think software that produces “sketchy” look prototypes is useful I don’t think such output is a complete substitute for free hand drawing. Drawing lets you to get “off road”, discover different things and have more rewarding high-speed accidents.
Snappy naming scheme ;) I’d rename them “napkin”, “notebook”, “printout”. First you scribble something in about ten seconds - eg. the result your get when all you have to write on is a napkin or coaster in the pub. Then you refine while sober into a hand-drawn sketch on your notepad/grid paper. Then you refine it into a clean wireframe in a digital format that gets printed out with actual straight lines and text other people can read (who has decent handwriting any more?).
I love the application of alcohol in this process, but I must admit I haven’t mastered it yet. When I look at the coaster in the morning it usually has something with flames on it and other equally dark and disturbing imagery.
Claude Monet sums up the ‘prototype’ process pretty well for me…
“You must begin by drawing … Draw simply and directly, with charcoal, crayon or whatever, above all observing the contours, because you can never be too sure of holding on to them, once you start to paint.”
Frank Gehry has a very interesting take on this subject too…
‘..I know I draw without taking my pen off the page. I just keep going, and that my drawings I think of them as scribbles. I don’t think they mean anything to anybody except to me, and then at the end of the day, the end of the project they wheel out these little drawings and they’re damn close to what the finished building is and it’s the drawing..’
From my perspective I find a hand drawn sketch can visualise an idea circulating in my head quickly and effectively. By the time I’ve opened MS Visio on my PC it is too late to record the thought.
On this topic, this site might be of interest: http://wireframes.linowski.ca/
Also on this topic (and beyond) it is well worth reading ‘Beyond prototype fidelity: environmental and social fidelity‘ on the Adaptive Path Blog.