Paper Prototyping for Agile Development

Paper prototypingfor Agile Development Agile Eastern Europe 2011

Who am I? Max Gaponov Certiﬁed Scrum Product Owner Agile coach, CIO at Banki.ru mgaponov@gmail.com

What are we going to talk about?

What is a Prototype? Prototype is a working model of future system

What ﬁelds do use prototyping?• Architecture• Engineering• Automobile industry• Art• Software

This talk was a prototype ﬁrst ;)

What prototypes are made for?• Know more about a product• Get a feedback• Get information about possible problems during production• Get an ability to change something before production

Prototype is documentation• Far more compact than text• Does not take much time to understand• Simpliﬁes development• Reduces development time

Prototype is communication — So, it’s all clear? — Sure!!!

What do we need for prototyping? We need to understand process of use of a product:

How product is born? Surface Skeleton Structure Scope Strategy

Time and place for prototyping Surface Prototyping Skeleton Structure Scope Strategy

Prototyping ways are many• Paper Prototyping• HTML/CSS/JS• PowerPoint/Keynote• Axure RP Pro/iRise• Excel/Numbers

Why paper prototyping?

It’s simple!

Who can draw?

And when you were children? ;)

The only important thing is understanding

Paper prototypes have right ﬁdelity

Paper prototypes can be done together!

Some more coins into the pig...• Paper prototyping is the fastest way• Help to force decisions• Irrelevant to technical skills• There is no court for paper prototypes

What tools do we need?• Paper• Transparent ﬁlm• Post-it notes• Scissors• Removable tape• Pens, pencils, markers

Some more tools...

I’ve got my own...

Simple example: site search What to do: As a user I can search a site to ﬁnd content that interests me. How to demo: User types text into a search form, push a «Search» button and gets a page with search results.

Let’s build a prototype for search

Take a look and add some details

Little bit harder: photo gallery What to do: As a registered user I can create and edit galleries so I can share my fotos with my friends. How to demo: Gallery creation/edit; load a photo; sign a photo; access setup to gallery; show a gallery.

In animation and movies they use storyboards

We can use sketchboards

Galleries sketchboard

Let’s build a gallery edit prototype

We can add a photo

Photo added...

We can setup access to gallery

Access granted...

They often say paper prototypes lack interactivity

Let’s edit personal data

Let’s add a child

Is that interactive? Absolutely, yep...

Paper prototypes testing

What do we need for testing?• Target group• Testing tasks• Helpers

Our helpers Faciman Compuman Watchman Mr. Smith. He Manipulates a Listens and writessolves problems ;) prototype down everything according to user actions

What are testing tasks?• Goal• Input data• User steps• Notes

How to analyze test results?• All tasks completed?• User remarks?• Watchman notes?

Let’s reﬁnine search prototype a bit

Let’s reﬁne galleries

Rename a gallery on edit page

Turn a photo

It’s better now!

Then test again... and reﬁne again... Prototyping is a process

And one more thing Paper prototyping is a mindset

Home readingUser Experience: Prototyping:• About Face, Alan • Prototyping: A Cooper Practitioner’s Guide,• The Elements of User Todd Zaki Warfel Experience, Jesse James • Paper Prototyping: The Garrett Fast and Easy Way to• Jeff Patton articles and Design and Reﬁne User talks Interfaces, Carolyn Snyder

Thanks!

http://agileee.org	201
http://paper.li	15

Paper Prototyping for Agile Development

by Max Gaponov on Sep 27, 2011

Accessibility

Categories

Tags

Upload Details

Usage Rights

2 Embeds 216

Statistics

Paper Prototyping for Agile Development — Presentation Transcript