Prototyping WorkshopPart 1

Quick & dirty prototypingprocess for small

projects.

2013

by Benoît Meunier

Build a digital prototype in one workshop with no coding? No problem.

THE CHALLENGE

The problem

The business canvas

1

Personas

2

Flow

{Adaptability in the moment

Research before doingImprovisation

...

3 4 5

3

Index Cards

4

iPad/Paper

{Low-FidelityLightweight

Lighthing fast

5 6 71 2

5

Omnigraffle

6

xScope

{Low/High-Fidelity

HeavyFast

3 4 7

7

Prototype

{High-Fidelity

MassiveSlow

5 64

“Take a risk, observe, choose, adapt, and change” — Keith

Johnstone

1

Personas

2

Flow

Index Cards

Convert Moleskine

Sharpie Fine Pointe

Framework

Human Emotions(Smileys faces)

Real person

Identification

Goals/...

Mary

Act it out!

Easy

Stakeholders Love

“Nail the basics first, detail the details later.” — Chris Anderson

One

Paper

Two

iPad

• Brainstorming

• Discovery

• Hours

Index Cards

Pigma® Micron® 05

Letraset ProMarker Twin-Tip True Blue

Sharpie Fine Pointe

Convert Moleskine

Cosmonaut

Action Method Dot Grid Book

iPad

X minutes

Ok!

Main interaction

I can feel it.

I can tap on it.

Link

Active

Hover/Click/Tap

Shared components

Title

Text

Images

“ The space between an idea and a concept is your lips. If you can’t say it out loud you can’t do it. ” — Nick Longo

Act it out with your team. Tell the story under x minutes.

Drafts by 37Signals

Stand up. Ask for their feedback.

If they understood your story, you’re good to go. Sketch some

more if needed.

Now, add details.

Annotate

Sharing is easy.

HandsArchiving can be easy.

Doxie Go

Now, what?

Three

Omnigraffle

Four

xScope

{Low/High-Fidelity

HeavyFast

One Two Five ...

We can talk about it

later.