Upgrade to Pro — share decks privately, control downloads, hide ads and more …

How to get the most out of your prototypes

How to get the most out of your prototypes

If a picture is worth a thousand words, a prototype is worth a thousand meetings. But how do you get the most from your prototype?

In this talk, Mark gives examples of how prototypes have been used to change the direction of an organisation, challenge assumptions and persuade people of things they would never have believed to be true. He shows how to use a prototype to get to the heart of your problem and offers his top tips for choosing the right prototype for any given problem.

Mark Skinner

March 14, 2019
Tweet

Other Decks in Design

Transcript

  1. How to get the most
    out of your prototypes
    Mark Skinner
    @MarkSkinner_

    View full-size slide

  2. Story about how Nick Swinmurn looked to
    answer the ‘will people buy shoes online’
    question before getting buy-in in his online
    shoe website, later sold as Zappos to Amazon
    for $1.2 Billion

    View full-size slide

  3. Goals of the talk:
    Get more people prototyping

    Reframe how people talk about prototypes

    Give tips and tricks for prototypes

    View full-size slide

  4. What is a prototype?
    So…
    What is a prototype?!

    View full-size slide

  5. Standard, high fidelity click throughs
    Look like apps / websites 

    Work like apps / websites

    View full-size slide

  6. Invision
    Sketch
    Figma
    HTML & CSS
    Atomic
    Flinto
    Fluid
    UXPin
    Framer
    Marvel
    Justinmind
    Keynote
    Adobe XD
    etc. etc.
    Some of the tools that allow us to prototype in
    this way…

    View full-size slide

  7. Lower fidelity wireframe style prototypes
    Some with real content, others with lorem
    ipsum content

    Looking to understand structure and goals of
    the website, rather than full working

    View full-size slide

  8. Axure
    Omnigraffle
    Balsamiq
    Mockingbird
    wireframe.cc
    Mockflow
    Canvas
    Excel
    Tools for these types of prototypes

    View full-size slide

  9. Paper prototypes
    Even lower fidelity

    Roughness of ideas

    View full-size slide

  10. Paper
    Post-its
    Sharpies
    Scissors
    Glue
    Cellotape
    Stencils
    Device frames
    The tools for paper prototyping…

    View full-size slide

  11. Medium articles back up that most of the
    conversation around prototyping is relating to
    this…
    This is a problem. This needs reframing

    View full-size slide

  12. A prototype is a tool to explore,
    evaluate, or communicate a future
    idea and assess if it’s worth
    pursuing…
    My definition of a prototype…
    Not exactly pithy or rolls of the tongue

    View full-size slide

  13. Prototyping = 

    Time travel +
    learning tool
    Better, shorter definition
    A way to see something that doesn’t exist

    and learn about it
    Use it to make better decisions, and reduce
    risk

    View full-size slide

  14. This meets the definition

    View full-size slide

  15. So does this

    View full-size slide

  16. But also this…
    Service prototypes, in the field, to understand
    implementations of touch points in locations

    View full-size slide

  17. Or these…
    Toys to mock up services - including human to
    human interactions, and journeys through a
    service
    Rather than just digital touch points

    View full-size slide

  18. And this…
    Rough prototypes to understand if the palm
    pilot being designed was the right size!
    “Is this too big…”

    View full-size slide

  19. Dropbox’s video
    “Are people interested in this service before
    we build it”

    View full-size slide

  20. And another…
    James Dyson making 5,127 prototypes before
    he made the version he wanted to launch!

    View full-size slide

  21. A story prototype
    (Angus Lowe champions this)
    Letting people edit the story to match the
    wording to their model of the world

    View full-size slide

  22. Airbus building a plane interior!

    View full-size slide

  23. A prototype is a tool to explore,
    evaluate, or communicate a future
    idea and assess if it’s worth
    pursuing…
    Diving into this a bit more…
    Prototypes are tools that let us 

    Explore, Evaluate, or communicate ideas

    AND

    Help us make decisions if we should move
    forward, pivot, or leave behind

    View full-size slide

  24. Learn through 

    making
    Learn through 

    research
    Learn through 

    sharing
    Explore Evaluate Communicate
    Breaking down explore, evaluate, and
    communicate.. 

    All 3 methods are valid uses of prototypes,
    not just one of them!

    View full-size slide

  25. Case study - Co-op bank
    Using prototype to reduce risk and alleviate
    fears around specific solutions

    View full-size slide

  26. Volunteer
    Listener
    Participant
    Caller
    Case study - Samaritans
    Having a conversational prototype to test the
    questions we need to answer

    View full-size slide

  27. Case study - American insurer
    Changing the direction of a project, through
    the use of prototypes

    View full-size slide

  28. When to prototype
    So, when to prototype?
    What time in a project

    AND

    What’s the value / business case

    View full-size slide

  29. Choose the 

    right solution to 

    fix it
    Identify the 

    right problem to 

    solve
    Deliver the 

    solution 

    in the right way
    Good for choosing right solution

    and

    Good for delivering solutions
    There are better methods to identifying right
    problem to solve

    View full-size slide

  30. Products
    Services Tools
    And more…
    Processes
    Useful for all types of design work.
    Not just products!

    View full-size slide

  31. You can use an eraser on the
    drafting table or a sledge hammer
    on the construction site.
    FRANK LLOYD WRIGHT
    Cost of change increases as you get further
    into a project.
    Answer the big questions up front using throw
    away prototypes!

    View full-size slide

  32. REDUCE RISK
    Prototypes help reduce risk.
    Risk of misunderstanding, risk of lack of
    engagement, risk of building it wrong etc.

    View full-size slide

  33. Questions before 

    you begin
    The questions to ask before a prototype or
    question needs answering

    View full-size slide

  34. What?
    How?
    Why?
    • What are you looking to
    learn?
    • Can you learn it using a
    prototype?
    • Are there secondary uses for
    it?
    • What are you not looking to
    learn?
    Start with why
    Ask these questions to understand WHY you
    should prototype

    View full-size slide

  35. What?
    How?
    Why?
    • How will it be used?
    • Is it for exploring,
    evaluating, or
    communicating an idea?
    • What skills do the team
    have?
    • When is it needed by?
    • How realistic does it need
    to be?
    • Do you know enough to
    make it efficiently?
    Answer how you will be doing it next…

    View full-size slide

  36. What?
    How?
    Why?
    • What is the best prototype
    for the situation?
    • What is the best tool to
    make that prototype?
    • What will give us the best
    return for the smallest
    effort?
    Based on Why and How…
    THEN what you’ll be doing

    View full-size slide

  37. Thanks!
    [email protected]
    @MarkSkinner_
    If a picture is worth a thousand words — A
    prototype is worth a thousand meetings.
    If there are no other reasons… prototypes
    help reduce the number of meetings you
    need to have!

    View full-size slide