Paper Prototypes

Often people ask us "how did you come up with the ideas for the Office 12 user
interface?"

That's a big question.  And the answer isn't simple.

What is easier to describe is the process by which we work to validate the
design choices that we make as we go along.  The very first ideas we have
are seldom right; instead we continually iterate and improve based on our
usability feedback loop.

One of the conundrums of an iterative design process is how to get feedback
early enough to impact the development process.  If we waited until the
development team was finished coding the product and then put the fully-working
software in the usability lab for the first time, we'd be in a world of hurt. 
There would be no time left to actually make the changes we would learn about.

As you might expect, we rely heavily on prototypes at the earliest design
stages.  We often create these prototypes in PowerPoint, believe it or not. 
(You can create surprisingly rich, interactive prototype experiences in
PowerPoint)

But even these prototypes take time to create--often more time than you have to
spare when you're trying out a risky, new, untested idea.

So, more times than not we use a cheap but surprisingly effective way of getting
quick usability feedback from real people: paper prototypes.

Paper prototypes are simply printouts of what the computer screen would look
like when running your software.  Usability subjects are given a pencil and
asked to pretend that it's the cursor and to virtually "click" just as they
would with a mouse.  Whomever is running the test (usually a usability
engineer or program manager) sits at the table with them and is responsible for
reacting to the subject's actions by updating the virtual screen with the right
printouts.  For example, if the subject launched a dialog box, I would find
a picture of that dialog box and lay it over the window they were looking at.

There are limitations to the kind of features that can be tested well with paper
prototypes.  A feature that relies on "feel" (such as the
Office 12
MiniBar
) doesn't lend itself to this kind of testing.

That said, there's no cheaper way to get real, actionable feedback about a
design.  Many of the Office 12 designs were first vetted in the paper
prototype stage, after which we refined the designs and tested them again. 
Most of the time, there was a strong correlation between the feedback we got at
the paper prototype stage and that we got with richer, interactive prototypes
(and even the fully working product!)

For more detailed information about this technique, I recommend Carolyn Snyder's
book
Paper Prototyping: The Fast and Easy Way to Design and Refine User Interfaces .

Comments

  • Anonymous
    January 06, 2006
    "Paper prototypes are simply printouts of what the computer screen would look like when running your software."

    So where do these images of the computer screen come from? It sounds like they're from something time-consuming like PowerPoint or Photoshop rather than a paper sketch.

  • Anonymous
    January 06, 2006
    The comment has been removed

  • Anonymous
    January 06, 2006
    I suspect Visio is the easiest way to spit out a UI image, but Power Point could work and even just spending a bit of time in the Visual Studio form designer with some version of what you want could do it.

  • Anonymous
    January 06, 2006
    The comment has been removed

  • Anonymous
    January 06, 2006
    The comment has been removed

  • Anonymous
    January 06, 2006
    The comment has been removed

  • Anonymous
    January 09, 2006
    Well, if there were computer-drawn paper prototypes of the ribbon early on, I'd expect the look wasn't really that unique yet, and so Visio would still be quite adequate.

  • Anonymous
    February 07, 2006
    It may seem based on my writing that the ideas behind the Office 12 user
    interface kind of popped out...

  • Anonymous
    February 20, 2006
    A couple of weeks ago when I talked about
    The
    Feature Bob Invented, I mentioned that we use PowerPoint...

  • Anonymous
    January 23, 2007
    PingBack from http://fly.ingsparks.de/2007-01-23/paper-prototyping-artikelsammlung/

  • Anonymous
    April 05, 2008
    PingBack from http://cyberwforum.com/cyberwblog/ui-first-software-development/

  • Anonymous
    April 10, 2008
    PingBack from http://www.webstudio.cl/blog/prototipos-de-papel-y-office-12/

  • Anonymous
    August 12, 2008
    The comment has been removed

  • Anonymous
    May 29, 2009
    PingBack from http://paidsurveyshub.info/story.php?title=jensen-harris-an-office-user-interface-blog-paper-prototypes

  • Anonymous
    June 16, 2009
    PingBack from http://workfromhomecareer.info/story.php?id=14498