Recommended
Recommended
More Related Content
Similar to Prototyping: 4 Strategic Factors for Design Teams
Similar to Prototyping: 4 Strategic Factors for Design Teams (20)
Recently uploaded
Recently uploaded (20)
Prototyping: 4 Strategic Factors for Design Teams
- 1. Twin Cities UX Meetup February 5, 2018 PROTOTYPING: 4 Strategic Factors for Design Teams Lyle Kantrovich Vivid Mojo @Lkantrov
- 2. Twin Cities UX Meetup February 5, 2018 Who here… • Regularly creates prototypes • Regularly tests prototypes • Regularly provides feedback on prototypes • Has a standard prototyping tool ? 2
- 3. Twin Cities UX Meetup February 5, 2018 The Road Ahead • Think differently about how you create prototypes • Reconsider how you use prototypes • Improve your organization’s prototyping maturity 3
- 4. Twin Cities UX Meetup February 5, 2018 What is a Prototype? • An early sample, model, or release of a product built to test a concept or process or to act as a thing to be replicated or learned from. – Wikipedia (2016) • A first or early example that is used as a model for what comes later – Merriam Webster • A first, typical or preliminary model of something, especially a machine, from which other forms are developed or copied. – Oxford Dictionary 4
- 5. Twin Cities UX Meetup February 5, 2018 What is a Model? • A three-dimensional representation of a person or thing or of a proposed structure, typically on a smaller scale than the original. – Oxford Dictionary • A usually miniature representation of something; a pattern of something to be made; or a set of ideas and numbers that describe the past, present, or future state of something (such as an economy or a business) – Merriam Webster 5
- 6. Twin Cities UX Meetup February 5, 2018 What is a Simulation? • The production of a computer model of something, especially for the purpose of study – Oxford Dictionary • Something that is made to look, feel, or behave like something else especially so that it can be studied or used to train people – Merriam Webster 6
- 7. Twin Cities UX Meetup February 5, 2018 Converging Concepts Related Terms: • Mockup • Wireframe • Sketch • Beta • Demo Model Simulation Prototype 7
- 8. Twin Cities UX Meetup February 5, 2018 My Imperfect Prototype Definition: A representation of a design idea to help communicate, explore, test or study future possibilities. 8
- 9. Twin Cities UX Meetup February 5, 2018 Serious Play – by Michael Schrage Many case studies on prototyping, simulations, modeling…from clay to foam to Excel Discusses prototyping cultures and relationship to innovation. Harvard Business School Press, 1999 9
- 10. Twin Cities UX Meetup February 5, 2018 Prototypes Create Value Through Conversations & Interactions. • Users interacting with them • Clients discussing them • Stakeholders discussing tradeoffs / needs / use cases • Team members discussing materials, build-ability, maintainability, etc. Source: Flavio Nazario 10
- 11. Twin Cities UX Meetup February 5, 2018 Types of Prototypes: Physical Apple Macintosh LC Prototype (1989) – Foam Philips AirFloss Prototype Source: Philips CommunicationsSource: jimabeles 11
- 12. Twin Cities UX Meetup February 5, 2018 The Link Trainer (1929) Source: pasukaru76 12
- 13. The question isn’t what kind of prototypes should we build, but… What kind of conversations & interactions do we want to inspire?
- 14. Twin Cities UX Meetup February 5, 2018 The User-Centered Design Process Plan the Design Process Understand & Specify Context of Use Specify User Requirements Produce Design Solutions to Meet User Requirements Evaluate Designs Against Requirements Designed Solution Meets User Requirements Iterate where appropriate ISO 9241-210 14
- 15. Twin Cities UX Meetup February 5, 2018 Produce Prototypes UCD – Prototype Centric Version Plan / Adjust the Design Process Understand & Specify Context of Use Specify User Requirements Evaluate Prototypes Prototype Meets User Requirements Iterate where appropriate 15
- 16. YOU CAN’T INVENT THE FUTURE WITHOUT FIRST PROTOTYPING IT. - Michael Schrage True innovators don’t create ideas… they create models & prototypes. PROTOTYPING IS INNOVATIVE BEHAVIOR
- 17. Twin Cities UX Meetup February 5, 2018 Question… What fidelity prototypes does your team typically create? • Low fidelity • High fidelity • Medium fidelity ? Why did you select that answer? 17
- 18. The “F-Word” “Fidelity” is overused, overloaded and overly simple. It is steeped in assumptions.
- 19. Twin Cities UX Meetup February 5, 2018 4 Prototyping Factors to Consider Works Like Looks Like Reads Like Depth & Breadth Functional Fidelity Visual Fidelity Content Fidelity Overall Completeness 19
- 20. Twin Cities UX Meetup February 5, 2018 Functional Fidelity Works Like • Functionality • Performance • Level of Interaction • Input & Output Methods Source: Flavio Nazario 20
- 21. Twin Cities UX Meetup February 5, 2018 Visual Fidelity Looks Like • Colors • Fonts • Branding • White space • Visual “polish” • Graphics / Photos Source: Flavio Nazario 21
- 22. Twin Cities UX Meetup February 5, 2018 Content Fidelity Reads Like • Use of placeholders • Lorem Ipsum • Real content Source: Flavio Nazario 22
- 23. Twin Cities UX Meetup February 5, 2018 Overall Completeness Depth & Breadth • Scope of features • Scenarios supported Source: Flavio Nazario 23
- 24. Twin Cities UX Meetup February 5, 2018 4 Prototyping Factors to Consider Works Like Looks Like Reads Like Depth & Breadth • Functionality • Performance • Level of Interaction • Input & Output Methods • Colors • Fonts • Branding • White space • Visual “polish” • Graphics / Photos • Use of placeholders • Lorem Ipsum • Real content • Scope of features • Scenarios supported 24
- 25. Twin Cities UX Meetup February 5, 2018 Simplification • Prototypes = deliberate simplification (or oversimplification) • What should be simplified and why? • Simplification and Complexity both represent risk Source: Jegi (Flickr) 25
- 26. Polish looks for praise. LOW FIDELITY IS GOOD. “ROUGHNESS” INVITES QUESTIONS.
- 27. “What organizations choose NOT to model is as revealing as what they do.” - Michael Schrage A CAUTIONARY WORD
- 28. Twin Cities UX Meetup February 5, 2018 Paper Prototype • Works like = Low • Looks like = Low • Reads like = Low • Depth & Breadth = a few screens Source: Rosenfeld Media 28
- 29. Twin Cities UX Meetup February 5, 2018 757 Cockpit Flight Simulator • Works like = High • Looks like = High • Reads like = High • Depth & Breadth = Cockpit Only Source: Kent Wien (Flickr) 29
- 30. Twin Cities UX Meetup February 5, 2018 Blueprint • Works like = Low • Looks like = Low • Reads like = Low • Depth & Breadth = Summary Source: David Power (Flickr) MODEL 30
- 31. Twin Cities UX Meetup February 5, 2018 Blueprint – Real Scale Source: vardehaugen_arkitekter 31
- 32. Twin Cities UX Meetup February 5, 2018 Axure Prototype • Works like = Med • Looks like = Med • Reads like = High • Depth & Breadth = Home + Products 32
- 33. Twin Cities UX Meetup February 5, 2018 Interactive Prototype – Android Wikipedia App “Link Preview” Feature • Works like = High • Looks like = High • Reads like = High • Depth & Breadth = Link Preview feature only Source: Wikimedia 33
- 34. DESIGN LEADERS MANAGE HOW TEAMS PROTOTYPE & NURTURE THEIR PROTOTYPING CULTURE
- 35. Twin Cities UX Meetup February 5, 2018 Other Prototyping Considerations 35
- 36. Twin Cities UX Meetup February 5, 2018 Your Prototyping Medium • Clay • Whiteboard Sketch • Paper • Foam Core • Wood • Metal • Cardboard Virtual: • PhotoShop • Axure • Excel • Visio / OmniGraffle • Web • Desktop or Mobile App • Software Code 36
- 37. THE PHYSICAL MATERIAL USED IN PROTOTYPING IS A MAJOR STRATEGIC INNOVATION VARIABLE. - Michael Schrage Choice of medium impacts how prototypes are managed and how teams collaborate.
- 38. Twin Cities UX Meetup February 5, 2018 1956 Packard – Clay Prototype Clay auto prototypes truncated debate, rather than inviting discussion.Source: John Lloyd (Flickr) 38
- 39. Twin Cities UX Meetup February 5, 2018 Medium Impacts Design… Early HP calculators were prototyped in cardboard, resulting in more “squared off” designs. They later switched to foam & resulting designs were more soft and rounded HP-35 (1972) HP-39G (2000)Source: WikipediaSource: Kubanczyk (Flickr) 39
- 40. Twin Cities UX Meetup February 5, 2018 Prototype Lifetime Is it throw away? Will it evolve into the actual product? Source: Julia Folsom 40
- 41. Twin Cities UX Meetup February 5, 2018 Refactoring • How easy will it be to change the prototype? • Can anyone change it? • Paper = low skill • Code = special skills • Tool = different special skills • When will we change the level of fidelity? • Functionality • Visual • Content • Depth & Breadth • When will we stop iterating? • When do we move from prototype to production (e.g. code)? 41
- 42. Twin Cities UX Meetup February 5, 2018 Ownership • Who can change it? • Who gets to see it? • When? Source: DeviantArt BlueAngelPower2003 42
- 43. Twin Cities UX Meetup February 5, 2018 Context of Prototype Use • How similar to intended product use? • Environment • Level of distractions • Lab vs. home • Outdoor vs. Indoor • Etc. • Social context? • Technical context • Mobile app on mobile • Mobile app in mobile browser • Mobile in desktop browser • Mobile over Webex 43
- 44. Twin Cities UX Meetup February 5, 2018 Iterations vs. Variations Variations Iterations 44
- 45. Twin Cities UX Meetup February 5, 2018 Iterations vs. Variations v2a v1a v3a v1b v1c v2b Variations Iterations Low Fidelity & Rough Higher Fidelity 45
- 46. Twin Cities UX Meetup February 5, 2018 Planning for prototypes in the UCD process: • Prototype the 20% that will get 80% of use/value. • Target the biggest risks & opportunities. • For testing, prototype scope needs to cover scope of test scenarios & tasks • Level of prototype fidelity shouldn’t exceed the team’s level of thinking (idea maturity). • If too high? Less feedback. • If too low? Misinterpretation & unmitigated risks. • There are “devils” in the details (i.e., interaction & content matter) 46
- 47. Twin Cities UX Meetup February 5, 2018 A Few Thoughts on Agile Agile is about killing documentation & getting to a prototype (or code) quicker. But often with risks: • “Prototypes” (aka MVP’s) often built with production materials • Prototypes not throw-away • Often only one variation/concept at a time 47
- 48. Twin Cities UX Meetup February 5, 2018 Do you need a Prototype? • Some questions can be answered without a prototype • Tree tests & Card Sorts – Labels & Content Organization • Will the prototype help answer questions? Is change possible? • If not, why create a prototype? 48
- 49. Twin Cities UX Meetup February 5, 2018 Summary • Adjust your thinking beyond the “F-word” • Works Like • Looks Like • Reads Like • Depth & Breadth • Don’t prototype on “autopilot”. • RECONSIDER these factors on every project. 49
- 50. Twin Cities UX Meetup February 5, 2018 Summary (2) Consider & plan for: • Conversations & Interactions • Roughness • Simplification • Medium • Lifetime • Competing variations • Refactoring process • Context of prototype use 50
- 51. Twin Cities UX Meetup February 5, 2018 Twitter: @Lkantrov Email: Lyle.Kantrovich@gmail.com LinkedIn: Lyle Kantrovich thank you 51