52
Hi, Failcon people.

Good design faster slides failcon 2010

Embed Size (px)

DESCRIPTION

Slides from Leah Buley's FailCon Workshop on Good Design Faster

Citation preview

Page 1: Good design faster slides   failcon 2010

Hi, Failcon people.

Page 2: Good design faster slides   failcon 2010

Emphasis on User Experience

Lo-fi Methods, Tools, Tips & Tricks

Product & Service Design

Based in San Francisco

A bit about me

Leah Buley

Page 3: Good design faster slides   failcon 2010
Page 4: Good design faster slides   failcon 2010

Good Design Faster is an immersive workshop

that takes you from back-of-the-napkin sketching to interactive prototyping in two short days.  Learn an agile, fast-paced approach that yields surprisingly good results in surprisingly little time. Transform the way you tackle designing for fluid interactions, service design, and multi-channel experiences.

Page 5: Good design faster slides   failcon 2010

My own story of failure

Page 6: Good design faster slides   failcon 2010

My own story of failure

Page 7: Good design faster slides   failcon 2010

Leah Buley,

Page 8: Good design faster slides   failcon 2010

Leah Buley,

Page 9: Good design faster slides   failcon 2010

An approach that...

Page 10: Good design faster slides   failcon 2010

1. Sketch and explore ideas

Page 11: Good design faster slides   failcon 2010

2. Bring lots of ideas together

Page 12: Good design faster slides   failcon 2010

3. Share and iterate with the team

Page 13: Good design faster slides   failcon 2010

Bring lots of ideas together

Our Process

PEOPLE!

Sketch and explore ideas

Share & iterate with the team

Page 14: Good design faster slides   failcon 2010

Bring lots of ideas together

Our Process

PEOPLE!

Sketch and explore ideas

Share & iterate with the team

Page 15: Good design faster slides   failcon 2010

Rules of thumb for design sketching

Use markers and pens, not pencils• our goal is fast rather than perfect

If you mess up, keep going

If you really mess up, grab a new page

Yellow marker

Gray marker

Sharpie markers

Page 16: Good design faster slides   failcon 2010

Sketching tools

Yellow marker

Fat

Regular

Small

Gray marker

Sharpie markers

Start here

Page 17: Good design faster slides   failcon 2010

Sketching tools

Yellow marker

Fat

Regular

Small

Gray marker

Sharpie markers

Start here

More attention

Page 18: Good design faster slides   failcon 2010

Sketching tools

Yellow marker

Fat

Regular

Small

Gray marker

Sharpie markers

Start here

More attention

Look at me!

Page 19: Good design faster slides   failcon 2010

Sketching tools

Yellow marker

Fat

Regular

Small

Gray marker

Sharpie markers

Start here

More attention

Depth:Pop forward

Push back

Look at me!

Page 20: Good design faster slides   failcon 2010

ACTIVITY ONE:Cheat #3: line weight

Courtesy of Brandon Schauer

Page 21: Good design faster slides   failcon 2010

ACTIVITY ONE:Cheat #1: highlighting

Build-a-Bike

Courtesy of Rachel Glaves

Page 22: Good design faster slides   failcon 2010

ACTIVITY ONE:Cheat #2: shading / warm gray

Courtesy of Rachel Glaves

Page 23: Good design faster slides   failcon 2010

Helpful sketching patterns

Header

Tab

User Picture

Photo

Video

Filler text

Pop-upModule

ArrowsLarger ones can

communicate weight, or act as labels

Side-scrolling Module

Drop ShadowsCommunicate depth and

bring attention to callouts or popup boxes

Calendar

Page curl

Mouse CursorQuietly indicates a

rollover state

CalloutsCan show alerts, help, guidance or

sketch annotations

Page 24: Good design faster slides   failcon 2010

What to sketch when

Page 25: Good design faster slides   failcon 2010

Exploratory sketches

Wildly varied

Meaningful only to you

Low fidelity

Unsubtle

Page 26: Good design faster slides   failcon 2010

Refinement sketches

More realistic

Interpretable by others

Higher fidelity

Within a framework

Page 27: Good design faster slides   failcon 2010

ACTIVITY ONE:

1. Grab a sketching template

2. Fill in the boxes with 6 DIFFERENT ideas for the same problem—a mobile app for Failcon.

3. If you get stuck, find your favorite sketch, and then think of its OPPOSITE.

4. If you get stuck again, sketch something that feels SOCIAL, or PERSONAL, or INFORMATIVE, or SURPRISING.

INSTRUCTIONS

Exploratory Sketching | An Experiment

in 10 minutes

Page 28: Good design faster slides   failcon 2010

Bring lots of ideas together

Our Process

PEOPLE!

Sketch and explore ideas

Share & iterate with the team

Page 29: Good design faster slides   failcon 2010

Enter Sketchboards

Page 30: Good design faster slides   failcon 2010

How to make a sketchboard

Page 31: Good design faster slides   failcon 2010

In this case, size matters

Page 32: Good design faster slides   failcon 2010

The structure can change (use stickies to keep it flexible)

Page 33: Good design faster slides   failcon 2010

Include anything that drives your thinking

Page 34: Good design faster slides   failcon 2010
Page 35: Good design faster slides   failcon 2010

A healthy sketchboard has depth and breadth

Page 36: Good design faster slides   failcon 2010
Page 37: Good design faster slides   failcon 2010

Bring lots of ideas together

Our Process

PEOPLE!

Sketch and explore ideas

Share & iterate with the team

Page 38: Good design faster slides   failcon 2010

How?

Page 39: Good design faster slides   failcon 2010

How?

Page 40: Good design faster slides   failcon 2010

The goal

Page 41: Good design faster slides   failcon 2010

Tips for getting good feedback

Page 42: Good design faster slides   failcon 2010

ACTIVITY ONE:

1. Working quickly, add a stickie note to the sketchboard for every question or concern that you have

2. As a group, talk through the stickies, and decide how to improve the design to address issues raised

3. Re-sketch whatever is necessary

INSTRUCTIONS

How to run a black hat session

Try to limit to 20 minutes

Page 43: Good design faster slides   failcon 2010

It really works

Page 44: Good design faster slides   failcon 2010

I want to try this on my marriage!”Good Design Faster Attendee from Portland, OR Startup

Page 45: Good design faster slides   failcon 2010

There is a drastic difference in the way stakeholders are getting involved and it is really great. The only problem was getting a war room.”

Good Design Faster Attendee from Consumer Reports

Page 46: Good design faster slides   failcon 2010

THE most effective method for creating a shared understanding of the end users experience, and for identifying new opportunities for improvement or change.”Designer at ThoughtWorks

Page 47: Good design faster slides   failcon 2010

Bringing it all together

Page 48: Good design faster slides   failcon 2010

The 5-day sprint

Page 49: Good design faster slides   failcon 2010

Iterating sprints

Page 50: Good design faster slides   failcon 2010

Sketchboards are just a jumping off point

Front Office

Back Office

Customer Action

Page 51: Good design faster slides   failcon 2010
Page 52: Good design faster slides   failcon 2010

Sketchboards: Discover Better + Faster UX SolutionsBrandon Schauer | http://www.adaptivepath.com/ideas/essays/archives/000863.php

Leah [email protected]

Resources to get you started

Made possible by the brilliance ofBrandon SchauerRachel GlavesKate Rutter

Good Design Faster, Boston, Nov 2011http://www.uie.com/events/uiconf

The User Experience Team of One (a book in the making)http://www.rosenfeldmedia.com