Rapid paper prototyping
-
Upload
lauren-johnson -
Category
Design
-
view
68 -
download
0
Transcript of Rapid paper prototyping
Rapid Paper Prototypingsketch, test, repeat
What is Paper Prototyping?A quick form of mocking up ideas, also called
"throwaway prototyping"Usually paper and pencil, though it can be done
digitallyAllows you to test concepts in a low-fidelity, low-
budget way
What is the process?Define the project requirementsSketch sketch sketch sketchFinalize paper prototypes and interaction flowsPresent to usersRefine & repeat as needed
What are the benefits?CheapQuickWhole team process that fosters brainstorming,
creativity, and discussionEasier to critiqueSimulates interaction with low-tech involvementIdentifies issues before building
What are the alternatives?Evolutionary Prototyping, which many development teams use. In this process, a robust, functional prototype is built and then tested on users. The concept is then refined, features are added, and a new version is tested.
Or, you know, not testing at all.
Throwaway Prototyping vs. Evolutionary Prototyping: A cage matchEvolutionary Prototyping builds quick and constantly refines
Evolutionary Prototyping works best with tech-heavy teams that have the resources to iterate a live project
Throwaway Prototyping vs. Evolutionary Prototyping: A cage matchThrowaway Prototyping refines before building
Throwaway Prototyping works best for small teams, teams with multiple parties interested in the development process, and teams that need to be able to test multiple design theories and options
Crazy Excuses Against Paper Prototyping
“I’m already doing wireframes, isn’t this twice the work?”
Crazy Excuses Against Paper Prototyping
“I don’t ever use a pencil, let alone paper.”
Crazy Excuses Against Paper Prototyping
“This looks like a kid made it.”
Crazy Excuses Against Paper Prototyping
“I would rather just start building.”
Crazy Excuses Against Paper Prototyping
“Users won’t take this seriously.”
What should I do before starting?Audience discovery: define your user groupsNeeds analysis: what do users need? what does the
client need? what is the goal?Content analysis: who, what, when, where, why,
how.Information architecture: organize that data!
What makes it rapid?Start sketching using the concepts of gesture drawing:
“A gesture drawing is work of art defined by rapid execution. Typical situations involve an artist drawing a series of poses taken by a model in a short amount of time, often as little as 30 seconds, or as long as 2 minutes. Gesture drawing is often performed as a warm-up for a life drawing session.”
What makes it rapid?
image courtesy Flickr user ‘Lil: http://www.flickr.com/photos/86653584@N00/2272093183/in/photolist-4sM59p-5vVE5R
But sketching takes time we don’t have!The multi-billion dollar movie, animation, and gaming industries all sketch prototypes, except they call them storyboards.
They have realized the value in conceptualizing and testing ideas before committing resources to actually build them.
“You can't do sketches enough. Sketch everything and keep your curiosity fresh.”
- John Singer Sargent
Sketch A LOT.Aim for quantity over qualitySpend no more than 2 minutes on a sketchTry out as many ideas as possibleDon’t focus on “bad” ideas; all ideas are good ideasKeep swimming forward
Now what?Embrace ideation and creativitySort through your ideas and find the interesting
onesGet as many sets of eyeballs on them as possibleFind common, recurring patternsIterate and refine a few choice ideasThink about the flow of interaction
Can I start building stuff now?
NO.
“The thing about models, about using them, is that a model doesn’t have to be a total theory of a field. It doesn’t have to be a golden thread that sort of leads you through a labyrinth. A model, a true model, in the experimental and feeling-your-way sense, can just be a kind of tentative walk through the experience by which you can retreat, consolidate yourself, regroup, and take a try again.”
- Charles Eames
Paper for interactionIt’s time to raid the junk drawer. You may need
scissorspost-it’s (various sizes and flags)glue sticksindex cardshighlighterstape
Paper for interactionTake your sketch, and refine global elementsIf you would like, cut out global elements for reuse
in the testing processSketch additional interaction pathsCreate “special” affordances: dropdown menus
from accordion folded paper, modal windows, error messages with highlighters, sliding features, infinite scrolls, and on and on
ExamplesAccount Creation Flow http://vimeo.com/6085753#App Testing http://www.youtube.com/watch?v=3fk0uWer6IQMobile Game http://www.youtube.com/watch?v=IPr6MgF93jQColoring App for Kids http://www.youtube.com/watch?v=9wQkLthhHKA
image courtesy Flickr user Samuel Mann: http://www.flickr.com/photos/21218849@N03/7984581635
image courtesy Flickr user Squidsoup: http://www.flickr.com/photos/squidsoup/4074959111
image courtesy Flickr user Samuel Mann: http://www.flickr.com/photos/21218849@N03/8019065947
Test early and often
Jakob Nielsen says that 5 users is the ideal testing pool
“Elaborate usability tests are a waste of resources. The best results come from testing no more than 5 users and running as many small tests as you can afford.”Why You Only Need to Test with 5 Users by Jakob Nielsen: http://www.nngroup.com/articles/why-you-only-need-to-test-with-5-users/
Assemble your testing teamYou will needSomeone to plan/facilitate the testingSomeone to execute the testing (in place of
technology)Someone to observe and document the testing5-ish users
Flip the ScriptOnce you are done testing, give your user paper and pencil and let them sketch their own ideas and solutions.
Let’s Get Digital+ Prototyping on Paper (POP) app http://popapp.in + InVision http://www.invisionapp.com | sample1 | sample2
Both allow you to take your sketches and turn them into deployable, interactive prototypes for testing.
POP can be downloaded on iOS or Android, InVision runs through the browser. Both are free.
Additional ResourcesExcerpts from Carolyn Snyder’s Book “Paper
Prototyping” http://www.paperprototyping.com/download.htmlUXPin Notepads http://uxpin.com/products.htmlUI Stencils http://www.uistencils.com/products/website-stencil-kit
Iterate as neededContinue to refine your sketches and expand upon the interaction until you feel confident that the idea is ready to build.
Yes, then you can start building.