Introduction to                          Prototyping                               UX Meetup                         Septe...
What is a prototype? A scenario-based simulation that allows a person to experience chosen aspects of a potential product....
Why prototype?    Because the only constant is change    The earlier in the process you make             changes, the bett...
What’s the difference between sketches,wireframes, and prototypes?    Paper isn’t necessarily a wireframe and     clickab...
Continuum     Paper Based            Screen Based     Sketch or Wireframe    Clickable Wireframe     Paper Prototype      ...
What about fidelity?fi·del·i·ty (Noun):The degree of resemblance to the final product.6                        Introductio...
Dimensions of fidelity        Visual         (Low: sketches High: graphics, branding)        Functional         (Low: st...
Types of prototypes    Paper-based (Paper prototype video)    Screen-based (Screen prototype example)    Combo    Rapi...
Uses for prototyping    Put requirements into a visual language    Interaction modeling    Demo an upcoming or potentia...
The prototyping process    Start with a purpose and goal for the prototype     and write it down, stay on target. Are you...
Prototyping for Usability Testing     May or may not have a prototype to start with     Set test goals, plan, scenarios,...
Who should prototype?    Speed    Resources    What needs to be prototyped 12                        Introduction to Pr...
Thank you!              Alexis Antonelli         User Experience Consultant              uxconsultant.com           aa@uxc...
References     Prototyping: A Practitioners Guide      Todd Zaki Warfel, 2009     Paper Prototyping: The Fast and Easy W...
Upcoming SlideShare
Loading in...5
×

Introduction to prototyping

6,423

Published on

Answers the following questions:
What is prototyping?
What are the different types of prototypes?
What is it used for?
How do you prototype for usability testing?

Published in: Design, Technology
0 Comments
10 Likes
Statistics
Notes
  • Be the first to comment

No Downloads
Views
Total Views
6,423
On Slideshare
0
From Embeds
0
Number of Embeds
4
Actions
Shares
0
Downloads
110
Comments
0
Likes
10
Embeds 0
No embeds

No notes for slide

Introduction to prototyping

  1. 1. Introduction to Prototyping UX Meetup September 1, 2011Alexis Antonelli, User Experience Consultant
  2. 2. What is a prototype? A scenario-based simulation that allows a person to experience chosen aspects of a potential product.“Prototypes don’t have to be clever or sophisticated, solong as you can be when you present or test them.”2 Introduction to Prototyping | UX Meetup 9/01/11
  3. 3. Why prototype? Because the only constant is change The earlier in the process you make changes, the better3 Introduction to Prototyping | UX Meetup 9/01/11
  4. 4. What’s the difference between sketches,wireframes, and prototypes?  Paper isn’t necessarily a wireframe and clickable screens aren’t necessarily a prototype  It’s about process and purpose  It helps to use verbs:   Sketching or Wireframing: brainstorming, ideating, mocking up, laying out, documenting   Prototyping: Modeling, simulating, demonstrating, evaluating, testing 4 Introduction to Prototyping | UX Meetup 9/01/11
  5. 5. Continuum Paper Based Screen Based Sketch or Wireframe Clickable Wireframe Paper Prototype Interactive Prototype5 Introduction to Prototyping | UX Meetup 9/01/11
  6. 6. What about fidelity?fi·del·i·ty (Noun):The degree of resemblance to the final product.6 Introduction to Prototyping | UX Meetup 9/01/11
  7. 7. Dimensions of fidelity  Visual (Low: sketches High: graphics, branding)  Functional (Low: static pages High: dynamic states, loading screens)  Content/Data (Low: lorem ipsum High: real prices, copy)  Breadth  Depth 7 Introduction to Prototyping | UX Meetup 9/01/11
  8. 8. Types of prototypes  Paper-based (Paper prototype video)  Screen-based (Screen prototype example)  Combo  Rapid, throwaway or closed-ended prototype  Evolutionary prototype 8 Introduction to Prototyping | UX Meetup 9/01/11
  9. 9. Uses for prototyping  Put requirements into a visual language  Interaction modeling  Demo an upcoming or potential product  Usability testing  Internal or client review 9 Introduction to Prototyping | UX Meetup 9/01/11
  10. 10. The prototyping process  Start with a purpose and goal for the prototype and write it down, stay on target. Are you testing, communicating, demonstrating, etc?  Who is the audience?  Sketch or wireframe before you build  Choose scenarios  Choose fidelities  Build  Don’t go overboard, more is not more 10 Introduction to Prototyping | UX Meetup 9/01/11
  11. 11. Prototyping for Usability Testing  May or may not have a prototype to start with  Set test goals, plan, scenarios, participants, etc.  If built, expect to have to adjust for testing  (Choose fidelities, build)  Tell participants up front that it is a prototype  If participants go somewhere not built, remind them it’s a prototype and gather data 11 Introduction to Prototyping | UX Meetup 9/01/11
  12. 12. Who should prototype?  Speed  Resources  What needs to be prototyped 12 Introduction to Prototyping | UX Meetup 9/01/11
  13. 13. Thank you! Alexis Antonelli User Experience Consultant uxconsultant.com aa@uxconsultant.com Axure RP 6 Training September 24 in LA uxconsultant.com/AxureTraining.html13 Introduction to Prototyping | UX Meetup 9/01/11
  14. 14. References  Prototyping: A Practitioners Guide Todd Zaki Warfel, 2009  Paper Prototyping: The Fast and Easy Way to Design and Refine User Experience Carolyn Snyder, 2003  Breaking the Fidelity Barrier: An Examination of Our Current Characterization of Prototypes and an Example of Mixed Fidelity Success CHI 2006 Proceedings McCurdy, Connors, Pyrzak, Kanefsky, Vera, 2006  Usability Problem Identification Using Both Low and High Fidelity Prototypes Proceedings of the SIGCHI Conference on Human Factors in Computing Systems Virzi, Sokolov, Karis, 1996  Introduction to Prototyping, Scottish UPA http://www.slideshare.net/neil00allison/introduction-to-prototyping-scottish-upa- june-2011 Neil Allison, 2011  Managing Change with Axure (AA RT 1.2) http://www.axureworld.org/library/category/axureworld-2010 Dhawal Shah, 2010 14 Introduction to Prototyping | UX Meetup 9/01/11
  1. A particular slide catching your eye?

    Clipping is a handy way to collect important slides you want to go back to later.

×