The Power of Prototyping @ Cascade SF/Eventbrite

THE POWER OF PROTOTYPING

INTUIT EXPERIENCE DESIGN

VINCE TEODORO

VINCE TEODORO

ROLE/BUSINESS UNIT

SR INTERACTION DESIGNER (QUICKBOOKS PAYMENTS) INN

PREVIOUS EXPERIENCES

YODLEE, ELLIE MAE, AKIRA CREATIVE GROUP, NORTHRUP GRUMMAN

Elevating the craft of "DESIGN!

through !LEAN UX & !

PROTOTYPING!

INTUIT TENURE

2.5 YEARS

@vinceteodoro vinceteodoro.com

5

POWER OF PROTOTYPING

6

PROTOTYPING EXPERIENCES DESIGN AT INTUIT

DESIGN!FOR DELIGHT!

USER-CENTERED DESIGN THINKING METHODOLOGY

7


Design For Delight

8


LEAN UX

9

PROTOTYPING EXPERIENCES

WHAT’S A PROTOTYPE? A prototype is an early, testable version of an idea.

10

PROTOTYPING EXPERIENCES DANIEL ROMANO CREATIVE DIRECTOR @ DISNEY INTERACTIVE

11


WHY PROTOTYPE? ü To answer questions.

ü Validate assumptions.

ü To visualize ideas & share them with others.

ü Fail early and cheaply.

12


ü  Quick – Create multiple versions fast and iterate faster.

ü  Cheap – You won’t mind throwing it away.

ü  Minimal – Contains core features you want to test.

ü  Testable – You can put it in front of people to use.

ü  Measurable – Get numbers and data behind what works and what doesn’t.

WHAT MAKES A GOOD PROTOTYPE?

13


WHAT’S THE APPROPRIATE FIDELITY? WILL ULTIMATELY DEPEND ON YOUR GOALS & OBJECTIVES

_ Who will use it? _ What are you trying to learn? _ Will this method communicate or test well?

14


PROTOTYPES CAN COME IN MANY FORMS AND FIDELITIES

15


DISCOVER DEFINE DEVELOP DELIVER

Paper prototypes

Clickable prototypes

Functional prototypes

High-fidelity Visual, motion,

responsive

•  Minutes •  Higher-level

feedback

•  Minutes/Hours •  Test general

flow

•  Hours/Days •  Test logic &

interactions

•  Days •  Refine final visual

assets & animations

16


ELMO MONSTER MAKING APP BY IDEO

17


BUT THERE’S SOOOO MANY TOOLS OUT THERE!

BUT DON’T FEEL OVERWHELMED LIKE THIS GUY. JUST TRY SOMETHING. THEN TRY ANOTHER. YOU WON’T REGRET IT.

18


FIND A PROTOTYPING TOOL THAT ALLOWS YOU TO BE FLUID WITH YOUR DESIGNS. THIS IS CRITICAL IN COLLABORATIVE & ITERATIVE PROTOTYPING.

19


20


21


22


LET’S DIVE INTO A TOOL THAT’S WORKED FOR US.

TOOLS/AXURE

23

PROTOTYPING EXPERIENCES WHAT IS AXURE? Wireframe and mockup software designed to help users create prototypes of apps and websites Without facing Any coding.

OVER 60% OF THE FORTUNE 100 USE AXURE RP

“

24


SO WHY AXURE?

25

PROTOTYPING EXPERIENCES SIMPLE. IT WORKS FOR OUR NEEDS. ü  Easy to follow video tutorials

(beginners to advanced levels). ü  Shared projects & libraries. ü  Responsive design support. ü  Easy to deploy prototypes. ü  Great for designing desktop

and mobile. ü  Amazing axure & community

support.

26

PROTOTYPING EXPERIENCES TEAM PROJECTS

* SVN – SubVersion - http://en.wikipedia.org/wiki/Apache_Subversion

27


28


29

PROTOTYPING EXPERIENCES STRENGTHS & WEAKNESSES

ü  Prototyping detailed interactions ü  Showing sequence of events and

animations ü  Collaborative design via team

projects ü  Concept design ü  Telling your product’s end-to-end

story ü  Mobile prototypes ü  Ease sharing of prototypes

ü  Pixel-level design ü  Production-ready code ü  UI pattern explorations ü  Animation explorations ü  HTML embedding

GOOD FOR NOT GOOD FOR

30


HARMONY DESIGN SYSTEM Making the prototype library accessible to the community.

HARMONY.INTUIT.COM

31


AXURE WIDGET LIBRARY DEMO

32


33

PROTOTYPING EXPERIENCES SAMPLE PROTOTYPES "WIREFRAME / WEB / MOBILE

35


BEST PRACTICES & TIPS

_ Tell an end-to-end story. (before/during/after) _ Show the in-between states. _ Show explorations when you can. _ Use video screencasts. _ Don’t fall in love with your prototype. _ Avoid feature bloat. Concentrate on MVP/MAP.

BECAUSE IN THE END…

USE A TOOL THAT WORKS FOR YOU AND BRING YOUR MOCKS TO LIFE!

38

POWER OF PROTOTYPING

ARTICLES _ Axure Tips – UX for the masses http://www.uxforthemasses.com/axure-tips/ _ The RITE Way to prototype http://uxmag.com/articles/the-rite-way-to-prototype _ Road test prototype tools http://www.cooper.com/journal/2013/07/designers-toolkit-proto-testing-for-prototypes _ Five Prevalent Pitfalls when Prototyping https://www.uie.com/articles/pitfalls_prototyping/

BOOKS _ Prototyping – A Practitioner’s Guide by Todd Zaki Warfel _ Axure RP Prototyping Cookbook by John Henry Krahenbuhl

BOOKS & RESOURCES

40

POWER OF PROTOTYPING USER EXPERIENCE DESIGN AT INTUIT

We’re hiring @ jobs.intuit.com

41


THAT’S ALL FOLKS! QUESTIONS?

WOOHOO! LET’S GET PROTOTYPING!

The Power of Prototyping @ Cascade SF/Eventbrite

Design

prototyping experiences

prototyping experiences

prototyping tool

com5 power of prototyping

craft of design

responsive design support

team projects concept

good prototype