Sunday, June 2, 2013

W4: Making a Paper Prototype

Yes, this is a picture of my actual craft room.
I told you I am an avid crafter.
Okay, I feel right at home reading Carolyn Snyder's Chapter 4: Making a Paper Prototype (from Paper Prototyping: The Fast and Easy Way to Design and Refine User Interfaces). I am an avid crafter, and one of my favorite crafts is scrapbooking, so I already have pretty much everything she recommends from the card stocks to the 40 different colors of sharpies to the restickable glues and tapes and yes even the transparencies. (Hint: for the items she lists as being difficult to find in the office supply store, head to your local craft store...Michael's, Hobby Lobby, Joann's, etc...and check out the scrapbooking section.)

Summary:

The chapter is split into a few major sections:

  1. Paper Prototyping Materials - all of the office/scrapbooking supplies that you are likely to need (and those that Snyder doesn't recommend) to create an effective paper prototype.
  2. Creating a Background - Suggestions for how to represent the overall background/template of your interface.
  3. How to Prototype Interface Widgets - How to create the paper versions of things like buttons, check boxes, dialogue boxes, textfields, drop down lists, etc). She even suggests ways to represent cursors.
  4. Representing the Users' Choices
  5. Hand Drawn versus Screen Shots - Snyder suggests using good design, however using hand drawn and simple images/logos to represent it instead of complicated pictures/images, EXCEPT when representing specific information. The example she gave was showing merchandise for a clothing website, and in that case she recommends cutting out pictures of the items from a catalog.
  6. Simulating Interaction - Snyder gives suggestion for how to indicate interaction, such as tips and rollover messages, important sounds, drag and drop, animation, and scrolling, etc.
  7. Beyond the Computer Screen: Incorporating Other Elements - Snyder gives some explanations and examples of times when it might be necessary to represent non-software components of the instruction, such as Hardware Props (tape backup system, MP3 Player, etc) and Hardware devices (instrument panels, medical equipment, handheld devices, etc). Here is where she also addresses the role that real life people can play in the prototyping, such as a technique Snyder learned from Jared Spool called "Incredibly Intelligent Help." IIH is a technique where the facilitator acts as a "Help" command, recording the types of questions the testers have, and these can be the basis for creating the real Help section of the final product. Another roles include Human Actors (who represent call-line operators, online customer service reps, etc) and rarely "Wizard of Oz Testing" to represent very complicated interactions. All of this prototyping will also contribute to deciding what elements need to go into the Documentation, Help, and Training.
Comments:
Overall, I thought this chapter was very interesting to think of all of the ways we can represent our design and interaction using a few simple office supplies. As of right now, I'm still not sure exactly how the design for my project is going to play out, so I feel like I mostly read the suggestions quickly and plan on revisiting them as I really begin developing the prototype.

I do feel like many of her suggestions are way beyond the scope of a simple web-based training. It's obvious that her book is addressing web-based design, but also softwares, databases, etc.

I can really see the benefit of creating a prototype for more than just testing the user's user-ability. I think of times when I have been working with a developer who is trying to explain to me something that they want a module or app to be able to do, and it's difficult for them to make it clear what exactly they want. In the case of a very complicated design/software, I can see it being very helpful for a designer to be able to show the interaction to the programmers in this prototype so that they can see exactly the kind of interaction that the designer expects.

No comments:

Post a Comment