sketchboards + prototypes

Dan Harrelson, Leah Buley

Sketchboards & PrototypesAgile 2008

1


[hand waving] Hello there.

2


Who are we?

3


Why are we here?

4


Agile + User Experience

5


A troubled history

6


Why all the fuss?

7


Designers in an agile world

*don’t let this go to your head8


What makes agile agile?

9


What makes design design?

10


The big picture (a.k.a, what you get from design)

11


One recipe for apple pie...

12


What we’re going to do today

13


Facebook for the Enterprise

( time to wake up, you’re about to get involved )

14


Your mission

15


3 scenarios

16


Meet your mates

instructions:

1. Introduce yourselves.

2. Pick a scenario.

3. Pick a name for your team.

17


Sketching

18


Why sketch?

19


“But I can’t draw!”

20


2 kinds of sketching

21


#1: Exploratory sketching

22


Techniques for exploratory sketching

23


Techniques for exploratory sketching

24


An example

25


#2: Refinement sketching

26


Techniques for refinement sketching

27



28



29


An example

30


Where does sketching fit in?

31


Let’s get sketching

instructions:

1. Working on your own, grab a 6-up template.

2. Fill in different ideas for the scenario your team has chosen.

3. Now grab a 1-up template.

4. Draw a screen that combines the best ideas from your 6-up template.

5. Go back over the 1-up template and emphasize what most important.

6. Do it in 10 minutes.

32


(An example)

33


Let’s get sketching

instructions:

1. Working on your own, grab a 6-up template.

2. Fill in different ideas for the scenario your team has chosen.

3. Now grab a 1-up template.

4. Draw a screen that combines the best ideas from your 6-up template.

5. Go back over the 1-up template and emphasize what most important.

6. Do it in 10 minutes.

34


How did it go?

35


Collaboration With Sketchboards

36


How a sketch becomes a sketchboard

37


Anatomy of a sketchboard

38


Movie time!

No that’s not DanYeah, that’s LeahYep, there’s lots of bald guys in our office

39


Sharing sketchboards

40


Pass the pen

41


Break!If you find chocolate donuts, can you bring a few back?

42


Where do sketchboards fit in?

43


Build a sketchboard

instructions:

1. Get together with your group, and create a sketchboard from everybody’s sketches.

2. Pair up with another table, and share your sketchboards with each other.

3. When the other team is sharing their sketchboard, give your input for how to make it better

4. Do it in twenty minutes.

44


(An example)

45


Build a sketchboard

instructions:

1. Get together with your group, and create a sketchboard from everybody’s sketches.

2. Pair up with another table, and share your sketchboards with each other.

3. When the other team is sharing their sketchboard, give your input for how to make it better

4. Do it in twenty minutes.

46


How did it go?

47


Recap

48


How a sketchboard becomes a prototype

49


sketchy

sketch goeshere Design Prototyping

50


The design prototype

smallquick

disposable

51


Different kinds of prototypes

52


Who makes the prototype?

53


Where does a design prototype fit in?

54


Define your design prototype

=

fidelity

elementstime

resources

55


Prototypes from sketches

56


How do you figure out what’s what?

57


Scope a design prototype

instructions:

1. With your team, look at sketchboard.

2. Place a colored post-it on each item that’s critical to the experience.

3. Place a different colored post-it on each item that’s complex for a user.

4. Rank each of the marked items using the matrix template.

5. Define an interactive prototype that addresses the critical and complex items.

58


How did it go?

59


Agile product development

60


The long “wow!”

61


The long “wow!”

62


Want to learn more?Experience

strategy

Be Agile

UnderstandingYour Users

63


Thanks!

64


Resources

[email protected] [email protected]

adaptivepath.com/slides/agile08.zip

adaptivepath.com/ideas/essays

65

mailto:[email protected]




http://adaptivepath.com/slides/agile08.zip


