22
Prototyping Tool Roundup Nashville UX – Aug 2013 John Horstman @johnhorstman JohnHorstman.com

Prototyping tool roundup - Nashville UX, Aug 2014

Embed Size (px)

DESCRIPTION

Brief overview of a handful of prototyping tools, and how they fit into the product development lifecycle This presentation owes props to Emily Schwartzman for an excellent blog post evaluating several prototyping tools: http://www.cooper.com/journal/2013/07/designers-toolkit-proto-testing-for-prototypes Twitter: @johnhorstman JohnHorstman.com KodiakLearning.com

Citation preview

Page 1: Prototyping tool roundup - Nashville UX, Aug 2014

Prototyping Tool RoundupNashville UX – Aug 2013

John [email protected]

Page 2: Prototyping tool roundup - Nashville UX, Aug 2014
Page 3: Prototyping tool roundup - Nashville UX, Aug 2014

Emily Schwartzman

Page 4: Prototyping tool roundup - Nashville UX, Aug 2014

Emily’s blog posthttp://www.cooper.com/journal/2013/07/designers-toolkit-proto-testing-for-prototypes

Page 5: Prototyping tool roundup - Nashville UX, Aug 2014

The Tools Evaluated

Source: “Designer’s Toolkit: Road Testing Prototype Tools,” by Emily Schwartzmanhttp://www.cooper.com/journal/2013/07/designers-toolkit-proto-testing-for-prototypes

Page 6: Prototyping tool roundup - Nashville UX, Aug 2014

Evaluation Matrix

Source: “Designer’s Toolkit: Road Testing Prototype Tools,” by Emily Schwartzmanhttp://www.cooper.com/journal/2013/07/designers-toolkit-proto-testing-for-prototypes

Page 7: Prototyping tool roundup - Nashville UX, Aug 2014

Existing Comps vs. Building from Scratch

InVision Protoshare

Page 8: Prototyping tool roundup - Nashville UX, Aug 2014

A Few Unique Traits

Page 9: Prototyping tool roundup - Nashville UX, Aug 2014

Axure: Gesture Support

Page 10: Prototyping tool roundup - Nashville UX, Aug 2014

Solidify: User Testing

Page 11: Prototyping tool roundup - Nashville UX, Aug 2014

Easel: HTML/CSS

Page 12: Prototyping tool roundup - Nashville UX, Aug 2014

Protoshare: Animation

Using AnimationsWhen a component’s Visibility changes based on a state change, you may also specify an Animation effect to use when it shows or hides itself.

Page 13: Prototyping tool roundup - Nashville UX, Aug 2014

Strong Mobile Support

Flinto Fluid Briefs

Page 14: Prototyping tool roundup - Nashville UX, Aug 2014

Low Fidelity Tools

Page 15: Prototyping tool roundup - Nashville UX, Aug 2014

Balsamiq Mockups

Page 16: Prototyping tool roundup - Nashville UX, Aug 2014

Mockup built while designing Kodiakhttp://www.kodiaklearning.com

Page 17: Prototyping tool roundup - Nashville UX, Aug 2014

POP(Prototyping on Paper)

Page 18: Prototyping tool roundup - Nashville UX, Aug 2014

Feedback Army

Page 19: Prototyping tool roundup - Nashville UX, Aug 2014

Fitting the Tools into the Process

Page 20: Prototyping tool roundup - Nashville UX, Aug 2014

Kodiak’s Process

g

Sketch Balsamiq Fireworks Browser

User Testing

Page 21: Prototyping tool roundup - Nashville UX, Aug 2014

What’s Nashville Using?

?

Page 22: Prototyping tool roundup - Nashville UX, Aug 2014

Thanks!John [email protected]