1/22/17

A Paper Prototyping Workshop


Recently, I had a chance to sit in on a Paper Prototyping Workshop presented to a group of high school kids.  Here's the workshop description:
"We'll learn about design thinking and prototyping and then guest speaker Daniel Wood, UX Designer at Liquid Agency, will give us tips on designing a user interface.  For the rest of the session we'll launch into a series of hands-on exercises that will guide us from brainstorming app ideas through creating paper prototypes to testing our user interfaces with real users."
I had two reasons for attending the workshop.  A secondary goal was to see if I could get any tips for improving the way we use paper prototypes at work, but my primary goal was to see how to conduct a full-day workshop. Previously, I had conducted one-hour exercises at work but I was about to help with a full-day workshop at PNSQC in the fall of 2016, and I wanted to understand the arc of a multi-hour session.  This blog post documents the workshop, and adds some observations about the paper prototyping process I plan to document the workshop, but also to make some observations about 

Step 1 - Understand the problem space

The kids heard heard a short 15-minute lecture from a UX design expert, then spent the rest of the hour generating ideas for apps. The kids were asked to list sets of users (such as "gamers," "pet owners," or "elderly people"), various industries ("medicine," "entertainment") and technologies ("mobile," "VR," "IoT"). They wrote these ideas on sticky nodes and then combined the notes to create ideas for apps.

Often software systems are generically called "solutions" because they are built to solve a problem.  Identifying and understanding the problem early is core to developing a good solution. The lecturer pointed out that to provide a good solution, the designer must understand the audience. He suggested the kids use empathy to put themselves into different viewpoints -- seeing from the point of view of the user.  He also suggested that design concepts should be kept small, digestible -- easily understood.  At this phase of design, don't try to invent new concepts.

Steps 2 & 3 - Generate and share ideas
Next, the kids listened to a talk about storytelling, then broke into small groups where they could agree on a set of ideas they wanted to work on. Storytelling and sharing ideas is a fairly simple process with a large benefits.  First, you have a story to tell, and by telling the story it helps shape your ideas into fully-formed concepts that others can understand. Also, you can see how other react to those stories and whether there is a common concept that excites interest in the solution.  Others on the team will have different viewpoints and may have suggestions that strengthen the story, or ideas that will push the story into a new realm.  This storytelling phase is key to forming a complete vision of the solution.

Although it was fairly free-form, kids liked this portion of the workshop. The open-ended space allowed them to imagine and follow odd tangents.  During their discussion, some of the stories evolved. But the limited time (1 hour) helped frame the session and to eventually focus them on a single solution for their groups.

Step 4 - Develop disposable paper prototypes
Finally it was time to create the paper prototypes. The kids grabbed paper, crayons and markers, scissors and string to create the UI for their app prototypes.  The adult coaches ranged around the room providing advice about standard UI components and suggestions for how to work as a team.  The kids innovated in all sorts of ways: folding paper, gluing together "buttons" and literal drop-down pick lists.

This segment reminded me that a successful workshop needs to have all the materials on-hand and ready.  If you're going to use sticky notes, make not to run out.  Not everyone brings writing implements, so have plenty of pens and markers on hand.  Try to predict the needs of the students in the workshop.

This session left lots of space, so the kids were free to take breaks or use the restrooms.  Remember: breaks are important.

Step 5 - Test and iterate the design
The final leg of the workshop was the rapid iteration session. Kids shared their "apps" with each other and the experts.  Sometimes the workflows didn't work as expected, so they revised the prototypes and retested them.  The key was to get a large set of tests and opinions in a small amount of time for relatively little investment.  The kids were encouraged to discard solutions that did not work, or were potentially problematic.  After this session the kids gathered to reflect on the day's work and share their thoughts and insights.


From this workshop, I gathered several key takeaways:

  • Lecture is good for a basic understanding, but hands-on learning seals the deal.
  • Provide space for ideas. Don't expect participants to be 100% efficient as they learn.
  • Don't expect to do more than one exercise per hour, unless the second exercise builds on the results of the first.
  • Provide any supplies that might be needed. You don't want to interrupt the session to track down paper and pencils.
  • A full-day workshop can be intense and possibly fatiguing. Breaks and food help keep the energy going and keep everyone happy.
  • If possible, ask people to help document the workshop by tweeting or taking photos

Thanks to Gage Choat for allowing me to sit in and observe the workshop.