1. Using Light Weight Methods to
Drive Your Designs Forward
A hands-on workshop by Nicole Capuana

2. Get the tools we will use today
Prototype on Paper
● Download & create an
account at popapp.in
InvisionApp
● Create an account online
at invisionapp.com
Usability testing scorecard
● Download/make a copy of scorecard http://bit.ly/1IYbRXC

3. Hello!
● Director of User Experience at LeanDog
● Founding member of HER Ideas in Motion, a
non-profit teaching girls how to code,
design games, & build robots
● Organizer of Cleveland Lean Startup Circle
● Over 15 years in UX covering the whole
spectrum - HTML/CSS. interaction design,
visual design, information architecture, user
research, usability & content strategy

4. Logistics
Get up and move

5. About our day together
● We will work in teams of 4
● You’ll mostly work in pairs and as a group
● Each group has a kit of materials you will need
● You can’t know anyone in the group
● Introduce yourself to your team
● The rules are simple: be open and respect each other
Find/Form a Team

6. Today, you will learn:
● How to do a variety of methods that will propel your teams
towards making products that people love
● How easy these methods are and how you can start using
them immediately

7. The Challenge
CodeMash attendees could need help:
● connecting with other attendees
● finding their way around
● deciding which talks to go to
● something else?
Create a mobile app that makes CodeMash the most interesting,
engaging, and inclusive conference experience.

8. What would you want this app do?
(write it down)

9. Now crumple it up & throw it out

10. You are not the user

11. There’s lots of user personas here &
they all have different needs

12. Part 1
Getting started with user research
● Contextual Inquiry
● Interviews
● Empathy maps & personasMorning

13. We’re going to combine 2 methods
before we practice

14. The first rule of user research:
never ask anyone what they want.
— Erika Hall, Just Enough Research

15. Contextual Inquiry
Method #1

16. What is it?
It’s a research method that where you observe and interview users in context to:
● Understand how the user actually uses the product or accomplishes their tasks
in the real-world
● Have people talk about what they are doing and why they do what they do
● See the environment and context of use

17. How to do it?
● One on One with user
● Set an objective of what you want to learn
● Introduce yourself
● Tell them a little bit about what you’re doing and what the session is like
● Make sure to let them know you’re here to see how they work or use the product
and you are NOT evaluating them or their work
● Watch, listen, pay attention
● Take notes
● Ask questions, don’t assume anything - probe to find out why (not judgemental)
● Thank them
● Summarize your notes

18. User Interviews
Method #2

19. What is it?
● Another research method used to gain insight and empathy into users’
motivations, mental models, pain points, challenges, processes, and stories
● It is asking questions to hear from target users what they think, feel, and how
they go about getting their task done
● It uses open-ended questions to drive out stories
● It’s done one person at a time
● It is not a focus group
● It will give you some clarity but will also generate more questions you need to
answer

20. How to do it?
● Create a script to guide you and give you some consistency
● Go where your users are and ask them open-ended questions
● It is conversational but the user should be doing most of the talking - you need
to ask and really listen
● Get their stories out
● Ask follow-up questions, probe, find out why, dig deeper
● Avoid “do you like”, “yes/no”, and the “woulds”
● Don’t ask what they want
● Don’t pitch or sell a solution
● Be open

21. 3 Questions to Ask
● What are you trying to get done? Why?
● Can you show me how you currently do this?
● Can you show me what’s frustrating about
your current process?
Charles Liu at KISSmetrics

22. Let’s practice!
As a team draft the following:
● What questions do you want to find out about your users (5 minutes)
● Outline what to look out for in contextual inquiry (5 minutes)
● Create a script/guide for interviewing users (5 minutes)
● Break into pairs - make sure each pair has the script/guide
● Decide who will start as the interviewer and who will take notes (you will switch
so everyone has a chance to play that role)
● Find a pair on another team to interview and observe using the CodeMash app
or website (20 minutes total - each interview is 5 minutes)
● Find another pair to interview (20 minutes total)

23. 15 minute break

24. Empathy Maps
Method #3

25. What is it?
● It is a tool to create an artifact that quickly
paints a holistic picture of a target persona
● Based on what you’ve learned through your
interviews and observations
● Some data you will need to infer
● It surfaces behaviors, motivations, and
actions
● Consists of 6 sections - hears, thinks, sees,
feels, does, and says
● Serves as an initial persona to guide
development (refine as you learn more)

26. How to do it?
● Get a large poster or wall space
● Draw out the sections around a large circle at the center
● From all of your interviews and observations, write one finding per sticky note
and place on the section it relates to
● The more interviews you have, multiple personas will emerge (it’s a bit magical)
● As a group, identify patterns and themes that emerge, discuss the insights and
decide who the persona is
● Draw a picture of the persona in the middle and give them a name
● Draft a key scenario for this persona that meets their needs when using your
product
● Identify features that would help this persona

27. Let’s practice!
We’ll use the Paul Boag adaptation today
● Discuss as a team findings
from all your interviews
● Write one finding per sticky
note and place on the map
● What does the map tell
you? Who is this person?
● After all findings on map,
draw a picture of the
persona that emerges in
the middle

28. Show & Tell
Who are our personas?

29. Morning Retro
Method #4

30. What is it?
● A regularly scheduled checkpoint where a team reflects upon their recent
activity to celebrate successes, identify opportunities for improvement, and
recognize innovation possibilities

31. How to do it?
● There’s lot’s a ways to structure it
● The simplest is what did we do well, what can we improve on, and what did we
learn
● Set on a regular cadence, held in safe environment
● Short
● Not a bitch session
● Generate 1-2 key action items for the group to work on
● At the next retro, report on action item progress

32. Reflecting on this morning:
What did you
learn?
What did you
do well with?
What did you
want more
help with?

33. After lunch, come back to:
● Play the whole product game,
● Quickly generate design ideas
● Create a clickable prototype
● Write, run and assess a usability test

34. Lunch :)
I challenge you to interview a few more people & observe attendees

35. Part 2
● Envision the whole
● Generate ideas & designs
● Build a prototype
● Test with users
● Assess usabilityAfternoon

36. Welcome back
● Who is new?
● Did anyone interview people over lunch?
● Get back together with your teams
● If your team lost someone, please raise your hand and a new person can join
you
● Review your personas goals

37. The Challenge
CodeMash attendees could need help:
● connecting with other attendees
● finding their way around
● deciding which talks to go to
● something else?
Create a mobile app that makes CodeMash the most interesting,
engaging, and inclusive conference experience.

38. Whole Product Game
Method #5

39. What is it?
● Created by Innovation Games
● Typically, use at the start of a project
● The psychology of game play and physical activity instantly engages the players
● Brings the different perspectives and ideas out
● Generates discussions for what goes into making a great product
● Helps the team reach a shared understanding of the product

40. Let’s play
For the app you will design to meet
our challenge - think of what goes
into it
● Write one idea per sticky note
● Write as many ideas as you have
● Place the notes in the ring you
feel it belongs in
● After you’ve all put your ideas on
the board, review and discuss

41. Design Studio Method
Method #6

42. What is a Design Studio?
● A way to rapidly generate and explore many ideas and solutions to a problem
through sketching, iteration, and critique
● It won’t generate the final solution
● The evangelists: Will Evans and Todd Zaki Warfel
● Use when starting a project, you’re stuck, or you’re tackling a new feature
● It’s a sketching exercise
● It’s not meant to be perfect just enough to convey the concept

43. Why use Design Studio?
● Ideas come from everyone and anywhere
● Allows for divergence and then convergence of ideas
● Builds upon great ideas
● Brings the whole team together (differing perspectives, collaboration,
investment in the problem by contributing)
● Speeds design
● Creates a shared understanding & ownership
● And everyone loves it!

44. How to do it?
● Get your supplies - markers, plain sheets of paper
● You’ll need a timer
● Explain that if you can draw a circle, square, triangle and line, your participants
can do it
● Cycle through as many rounds of sketch, pitch, critique as time for (you could
spend a whole day doing this)
● Remember 5-3-2

45. Ready?

46. Individually
sketch
6-8 concepts
that meet the
goals of your
users

47. 3 minutes
to pitch - how you addressed the goals

48. 2 minutes
to critique - based on goals, not what you like
2-3 ways solves problem or meets goals 1-2 ways to improve

49. Now as a team
combine,
refine, and re-
sketch
concepts

50. 3 minutes
find another team to pitch to - how you addressed the
goals

51. 2 minutes
to critique - based on goals, not what you like
2-3 ways solves problem or meets goals 1-2 ways to improve

52. 15 minute break

53. Make a Prototype
Method #7

55. Paper prototyping
● Fast & iterative
● Easy to change
● Test key concepts
before you invest
in the details
● Test physicality

56. Tools
Excellent review of tools
by Cooper - http://www.cooper.
com/prototyping-tools
Some tools:
● are free, some cost a bit but not much
● most have a trial or free version for 1
project
● are for mobile design only, others cover
complex interactions & animations
● have extensive UI libraries or building
kits to get you started quickly
● allow on device testing
● allow for real-time collaboration and
annotations

58. Let’s practice!
● Take the concepts you honed in Design Studio and re-sketch a more detailed
version on the long post-its
● You want to create a flow within the app (we will be testing this concept with
users to see how the design works for the user)
● Take photos of the screens
● Upload the photos to either POP or InvisionApp
● Create hotspots to link together and animate your mockups
● Get the prototype on the team’s phones

59. If your photos aren’t in the right orientation
There is a bit of a bug in InvisionApp - sometimes your photos will come in oriented
wrong. You can do 2 things:
1. Open the photos in an editor and edit them
2. or download the InvisonApp (iOS only)
○ Login to app
○ Then from your photo stream, go to share photos and more (...)
○ Then choose Invision as the option to share
○ Bring up the window and name the screen
○ Select the prototype to send it to

60. User Testing
Method #8

61. What is it?
● A moderated test with target users to uncover usability issues with the product
● Participants have to complete key actions and tasks
● It can be formal or informal
● At minimum there is a facilitator and an observer
● You will always learn something

62. How to do it?
Logistics for setting up your test
● Find your target users (get out of the building or recruit)
● Set objectives of what you need to answer or learn overall and at scenario levels
● Create 2 scripts - one for the participant and one for the moderator
○ The participant guide is task based and provides the scenario for context and then the tasks they
have to complete
○ The moderator guide has the questions for each task or scenario - put the test objectives on this
script
● Determine who will moderate and who will be record notes, videos
● Determine where you will run the test
● Print a copy of the moderator script for each observer
● Print a participant script

63. Sample script
Objective: User can set and use a cue timer
Scenario: You need to set up a cue timer for your upcoming gig. You’ll have the stage for 5 minutes.
Your tasks:
● Launch the Stage Timer app and set up your timer. You want to know when you hit the 4 minute and 4:
30 marks.
● Answer the facilitator’s questions.
For the facilitator:
1. How do you create a new timer?
2. How do you play/activate a timer?
3. What do the colors mean?

64. How to do it?
Getting ready to start the test
● Introduce yourself to the participant
● Tell them that they are helping to assess the product and it is NOT a test of
them or their abilities
● Ask them to think out loud as they go through their tasks
● Tell them that you will be asking them some questions and the observer will be
taking notes
● Tell them that it’s natural that they might have questions and you may respond
with a question like “what do you think it does”
● Record the session if you can because you won’t remember everything

65. How to do it?
Scoring & assessing the test
After each participant:
● Collectively assess what you observed - what worked, what didn’t, where the
participant struggled
● Use a scorecard to quickly surface the components that need further attention
● Use affinity mapping to identify themes across participants

66. Using the scorecard
Get it at http://bit.ly/1IYbRXC
● Break your scenario into key actions
● Using 0-1, score each participant for
each key action
● You may have to add more rows and
slightly adjust the formulas - the main
tab is the one named scorecard
● The scorecard will calculate a score for
each action and an overall score of the
scenario
○ 50% or lower is highlighted red
○ 51%-70% is highlighted yellow
The scorecard is a means to help
teams get consensus and direction
on what to focus on

67. Let’s practice!
● Create scripts for a task within your app (5 minutes)
● Set up a scorecard for your test (10 minutes)
● Determine who will moderate and who will take notes
● Find another team, run a test with a person from that team
● Switch and repeat (15 minutes)

68. Afternoon Retro
Revisiting Method #4

69. Reflecting on this afternoon:
What did you
learn?
What did you
do well with?
What did you
want more
help with?

70. It takes practice
involve the whole team so everyone is focused on
making the best experience

71. Resources
Rocket Surgery Made Easy: The
Do-It-Yourself Guide to Finding
and Fixing Usability Problems
by Steve Krug
Universal Methods of Design: 100 Ways
to Research Complex Problems, Develop
Innovative Ideas, and Design Effective
Solutions
by Bella Martin, Bruce Hanington
Articles, videos, templates
● How Reframing a Problem Unlocks Innovation
● 8-up template
● Todd Zaki Warfel (video)
● Design Studio: A Method for Concepting,
● Critique & Iteration
● Speed Design Studio -
● Design Studio for context-aware products
● Introduction to Design Studio Methodology
● Design of Design Studio
● Design Studio and Agile UX Process and Pitfalls
● How Prototyping is Replacing Documentation
● Vive le Prototype
● Building Clickthrough Prototypes To Support
Participatory Design
● State of the Prototyping Union – A Review of the
Top 5 Mobile Prototyping Tools

72. Thanks!
P.S. - I’m hiring :)
@ncapuana