Successfully reported this slideshow.
We use your LinkedIn profile and activity data to personalize ads and to show you more relevant ads. You can change your ad preferences anytime.

DevSummit 2016 PreSummit Workshop: Getting to Know Your Users (Part 1 of 2)

1,408 views

Published on

(Part 1 of 2; Morning slides) DevSummit 2016 PreSummit Workshop: Getting to Know Your Users, An Introduction into User Experience; Co-Presented with Heath Meyette; Presentation content contributions from Shari Little, Mitch Cox, Richard Caballero, Qun Hui, Brian Rosenberg and other team members.

Published in: Technology
  • Be the first to comment

DevSummit 2016 PreSummit Workshop: Getting to Know Your Users (Part 1 of 2)

  1. 1. March 8–11, 2016 | Palm Springs, CA Esri Developer Summit Getting To Know Your Users An Introduction to User Experience Heath Meyette Frank Garofalo Part 1 of 2
  2. 2. Please write down on provided sticky-notes your expectations for the workshop Good Morning & Welcome
  3. 3. March 8–11, 2016 | Palm Springs, CA Esri Developer Summit Getting To Know Your Users An Introduction to User Experience Heath Meyette Frank Garofalo
  4. 4. Expectation Sticky Notes Your expectations for the workshop
  5. 5. Introductions Your name, city, role, and 1 fun fact TIME: 10 minutes
  6. 6. Heath Meyette Senior UX Architect Esri Creative Lab, Redlands CA hmeyette@esri.com • @HeathMeyette Frank Garofalo Manager, Interactive Esri Creative Lab, Redlands CA fgarofalo@esri.com • @fgarofalo
  7. 7. Rules of Engagement TIME: 5 minutes groun d ur l se
  8. 8. Ideo’s 7 Rules of Brainstorming • Defer judgment • Go for quantity • One conversation at a time • Be visual • Build on other ideas • Stay on topic • Encourage wild ideas
  9. 9. Agenda 8:30am - 9:00am Expectations, Introductions and Ground Rules 9:00am - 9:20am Exercise 9:20am - 10:20am Presentation & Activity: Journey Mapping 10:20am - 10:40am Morning Break 10:40am - 11:00am Exercise 11:00am - 12:00pm Presentation & Activity: Personas 12:00pm - 1:00pm Lunch 1:00pm - 1:20pm Exercise 1:20pm - 2:20pm Presentation & Activity: Wireframing 2:20pm - 2:40pm Afternoon Break 2:40pm - 3:00pm Exercise 3:00pm - 4:00pm Presentation & Activity: Usability Studies 4:00pm - 5:00pm Wrap Up
  10. 10. Break-out Teams & Activities
  11. 11. Birthday Line Exercise One TIME: 20 minutes
  12. 12. Your Mission: Birthday Line • Line up around the perimeter of the room in chronological order of everyone’s birthday based on month and day. • ONE RULE: NO TALKING! TIME: 20 minutes
  13. 13. Your Mission: Birthday Line • Line up around the perimeter of the room in chronological order of everyone’s birthday based on month and day. • ONE RULE: NO TALKING! • Sometimes we put constraints on ourselves that don’t exist. Realizing these constraints is the first step to creative problem solving. TIME: 20 minutes
  14. 14. Journey Mapping Presentation & Activity
  15. 15. Workshop Overview 1 Journey Mapping? 2 What / Why / How 3 Examples 4 Group Activity 5 Presentations 6 Questions
  16. 16. What is a Customer Journey Map?
  17. 17. Τηε θυ ιχκ βροων φοξ ϕυ µ πσ οϖερ τηε λογ. Τηε θυ ιχκ βροων φοξ ϕυ µ πσ οϖερ τηε λογ. Τηε θυ ιχκ βροων φοξ ϕυ µ πσ οϖερ τηε λογ. Τηε θυ ιχκ βροων φοξ ϕυ µ πσ οϖερ τηε λογ. Τηε θυ ιχκ βροων φοξ ϕυ µ πσ οϖερ τηε λογ. Τηε θυ ιχκ βροων φοξ ϕυ µ πσ οϖερ τηε λογ. Τηε θυ ιχκ βροων φοξ ϕυ µ πσ οϖερ τηε λογ. Τηε θυ ιχκ βροων φοξ ϕυ µ πσ οϖερ τηε λογ. Τηε θυ ιχκ βροων φοξ ϕυ µ πσ οϖερ τηε λογ. Τηε θυ ιχκ βροων φοξ ϕυ µ πσ οϖερ τηε λογ. Τηε θυ ιχκ βροων φοξ ϕυ µ πσ οϖερ τηε λογ. Τηε θυ ιχκ βροων φοξ ϕυ µ πσ οϖερ τηε λογ. Τηε θυ ιχκ βροων φοξ ϕυ µ πσ οϖερ τηε λογ. Τηε θυ ιχκ βροων φοξ ϕυ µ πσ οϖερ τηε λογ. Τηε θυ ιχκ βροων φοξ ϕυ µ πσ οϖερ τηε λογ. Τηε θυ ιχκ βροων φοξ ϕυ µ πσ οϖερ τηε λογ. Τηε θυ ιχκ βροων φοξ ϕυ µ πσ οϖερ τηε λογ. Τηε θυ ιχκ βροων φοξ ϕυ µ πσ οϖερ τηε λογ. Τηε θυ ιχκ βροων φοξ ϕυ µ πσ οϖερ τηε λογ. Τηε θυ ιχκ βροων φοξ ϕυ µ πσ οϖερ τηε λογ. Τηε θυ ιχκ βροων φοξ ϕυ µ πσ οϖερ τηε λογ. Τηε θυ ιχκ βροων φοξ ϕυ µ πσ οϖερ τηε λογ. Τηε θυ ιχκ βροων φοξ ϕυ µ πσ οϖερ τηε λογ. Τηε θυ ιχκ βροων φοξ ϕυ µ πσ οϖερ τηε λογ. Τηε θυ ιχκ βροων φοξ ϕυ µ πσ οϖερ τηε λογ. Τηε θυ ιχκ βροων φοξ ϕυ µ πσ οϖερ τηε λογ. Τηε θυ ιχκ βροων φοξ ϕυ µ πσ οϖερ τηε λογ. Τηε θυ ιχκ βροων φοξ ϕυ µ πσ οϖερ τηε λογ. Τηε θυ ιχκ βροων φοξ ϕυ µ πσ οϖερ τηε λογ. Τηε θυ ιχκ βροων φοξ ϕυ µ πσ οϖερ τηε λογ. Τηε θυ ιχκ βροων φοξ ϕυ µ πσ οϖερ τηε λογ. Τηε θυ ιχκ βροων φοξ ϕυ µ πσ οϖερ τηε λογ. Τηε θυ ιχκ βροων φοξ ϕυ µ πσ οϖερ τηε λογ. Τηε θυ ιχκ βροων φοξ ϕυ µ πσ οϖερ τηε λογ. Τηε θυ ιχκ βροων φοξ ϕυ µ πσ οϖερ τηε λογ. Τηε θυ ιχκ βροων φοξ ϕυ µ πσ οϖερ τηε λογ. Τηε θυ ιχκ βροων φοξ ϕυ µ πσ οϖερ τηε λογ. Τηε θυ ιχκ βροων φοξ ϕυ µ πσ οϖερ τηε λογ. Τηε θυ ιχκ βροων φοξ ϕυ µ πσ οϖερ τηε λογ. Τηε θυ ιχκ βροων φοξ ϕυ µ πσ οϖερ τηε λογ.Τηε θυ ιχκ βροων φοξ ϕυ µ πσ οϖερ τηε λογ. Τηε θυ ιχκ βροων φοξ ϕυ µ πσ οϖερ τηε λογ. Τηε θυ ιχκ βροων φοξ ϕυ µ πσ οϖερ τηε λογ. Τηε θυ ιχκ βροων φοξ ϕυ µ πσ οϖερ τηε λογ. Τηε θυ ιχκ βροων φοξ ϕυ µ πσ οϖερ τηε λογ. Τηε θυ ιχκ βροων φοξ ϕυ µ πσ οϖερ τηε λογ. Τηε θυ ιχκ βροων φοξ ϕυ µ πσ οϖερ τηε λογ. Τηε θυ ιχκ βροων φοξ ϕυ µ πσ οϖερ τηε λογ. Τηε θυ ιχκ βροων φοξ ϕυ µ πσ οϖερ τηε λογ. Τηε θυ ιχκ βροων φοξ ϕυ µ πσ οϖερ τηε λογ. Τηε θυ ιχκ βροων φοξ ϕυ µ πσ οϖερ τηε λογ. Τηε θυ ιχκ βροων φοξ ϕυ µ πσ οϖερ τηε λογ. Τηε θυ ιχκ βροων φοξ ϕυ µ πσ οϖερ τηε λογ. Τηε θυ ιχκ βροων φοξ ϕυ µ πσ οϖερ τηε λογ. Τηε θυ ιχκ βροων φοξ ϕυ µ πσ οϖερ τηε λογ. Τηε θυ ιχκ βροων φοξ ϕυ µ πσ οϖερ τηε λογ. Τηε θυ ιχκ βροων φοξ ϕυ µ πσ οϖερ τηε λογ. Τηε θυ ιχκ βροων φοξ ϕυ µ πσ οϖερ τηε λογ. Τηε θυ ιχκ βροων φοξ ϕυ µ πσ οϖερ τηε λογ. Τηε θυ ιχκ βροων φοξ ϕυ µ πσ οϖερ τηε λογ. Τηε θυ ιχκ βροων φοξ ϕυ µ πσ οϖερ τηε λογ. Τηε θυ ιχκ βροων φοξ ϕυ µ πσ οϖερ τηε λογ. Τηε θυ ιχκ βροων φοξ ϕυ µ πσ οϖερ τηε λογ. Τηε θυ ιχκ βροων φοξ ϕυ µ πσ οϖερ τηε λογ. Τηε θυ ιχκ βροων φοξ ϕυ µ πσ οϖερ τηε λογ. Τηε θυ ιχκ βροων φοξ ϕυ µ πσ οϖερ τηε λογ. Τηε θυ ιχκ βροων φοξ ϕυ µ πσ οϖερ τηε λογ. It tells your Customer’s Story
  18. 18. Why should I create a Customer Journey Map?
  19. 19. It brings focus to your business.
  20. 20. It helps to identify gaps.
  21. 21. Gaps between… Devices Departments Channels
  22. 22. It syncs up you and your customer.
  23. 23. How do I create a Customer Journey Map?
  24. 24. How do I create a Customer Journey Map? 1. Research 2. Brainstorm 3. Visualize
  25. 25. Research the Market
  26. 26. Talk with your Customers
  27. 27. Talk with your Coworkers
  28. 28. Brainstorm using a Journey Map
  29. 29. Visualize your Research & Brainstorming
  30. 30. Guidelines to Creating Effective Journey Maps Visuals 1. Keep the customer at the center
  31. 31. Guidelines to Creating Effective Journey Maps Visuals 1. Keep the customer at the center 2. Keep it simple
  32. 32. Guidelines to Creating Effective Journey Maps Visuals 1. Keep the customer at the center 2. Keep it simple 3. Use data to help make decisions
  33. 33. Guidelines to Creating Effective Journey Maps Visuals 1. Keep the customer at the center 2. Keep it simple 3. Use data to help make decisions 4. Tailor it to your audience
  34. 34. Group Activity TIME: 30 minutes
  35. 35. Activity: Journey Mapping Scenario: You work for a travel website. • Customers can’t purchase a ticket without assistance. • Need a ”fix” ASAP! We’re losing money. • Why is it failing now? • Where’s the documentation? Your task: Create a Journey Map Canvas • Document the current state of the process • Come up with improvements
  36. 36. Work across the TimelineSelect Persona Work down each column1 2 3 Τηε θυιχκ βροων φοξ ϕυµπσ οϖερ τηε λογ. Τηε θυιχκ βροων φοξ ϕυµπσ οϖερ τηε λογ. Τηε θυιχκ βροων φοξ ϕυµπσ οϖερ τηε λογ. Τηε θυιχκ βροων φοξ ϕυµπσ οϖερ τηε λογ. Τηε θυιχκ βροων φοξ ϕυµπσ οϖερ τηε λογ. Τηε θυιχκ βροων φοξ ϕυµπσ οϖερ τηε λογ. Τηε θυιχκ βροων φοξ ϕυµπσ οϖερ τηε λογ. Τηε θυιχκ βροων φοξ ϕυµπσ οϖερ τηε λογ. 4 Add as much detail as you can Τηε θυιχκ βροων φοξ ϕυµπσ οϖερ τηε λογ. Τηε θυιχκ βροων φοξ ϕυµπσ οϖερ τηε λογ. Τηε θυιχκ βροων φοξ ϕυµπσ οϖερ τηε λογ. Τηε θυιχκ βροων φοξ ϕυµπσ οϖερ τηε λογ. Τηε θυιχκ βροων φοξ ϕυµπσ οϖερ τηε λογ. Τηε θυιχκ βροων φοξ ϕυµπσ οϖερ τηε λογ. Τηε θυιχκ βροων φοξ ϕυµπσ οϖερ τηε λογ. Τηε θυιχκ βροων φοξ ϕυµπσ οϖερ τηε λογ. Τηε θυιχκ βροων φοξ ϕυµπσ οϖερ τηε λογ. Τηε θυιχκ βροων φοξ ϕυµπσ οϖερ τηε λογ. Τηε θυιχκ βροων φοξ ϕυµπσ οϖερ τηε λογ. Τηε θυιχκ βροων φοξ ϕυµπσ οϖερ τηε λογ. Τηε θυιχκ βροων φοξ ϕυµπσ οϖερ τηε λογ. Τηε θυιχκ βροων φοξ ϕυµπσ οϖερ τηε λογ. Τηε θυιχκ βροων φοξ ϕυµπσ οϖερ τηε λογ. Τηε θυιχκ βροων φοξ ϕυµπσ οϖερ τηε λογ. Τηε θυιχκ βροων φοξ ϕυµπσ οϖερ τηε λογ. Τηε θυιχκ βροων φοξ ϕυµπσ οϖερ τηε λογ. Τηε θυιχκ βροων φοξ ϕυµπσ οϖερ τηε λογ. Τηε θυιχκ βροων φοξ ϕυµπσ οϖερ τηε λογ. Τηε θυιχκ βροων φοξ ϕυµπσ οϖερ τηε λογ. Τηε θυιχκ βροων φοξ ϕυµπσ οϖερ τηε λογ. Τηε θυιχκ βροων φοξ ϕυµπσ οϖερ τηε λογ. Τηε θυιχκ βροων φοξ ϕυµπσ οϖερ τηε λογ. Τηε θυιχκ βροων φοξ ϕυµπσ οϖερ τηε λογ. Τηε θυιχκ βροων φοξ ϕυµπσ οϖερ τηε λογ. Τηε θυιχκ βροων φοξ ϕυµπσ οϖερ τηε λογ. Τηε θυιχκ βροων φοξ ϕυµπσ οϖερ τηε λογ. Τηε θυιχκ βροων φοξ ϕυµπσ οϖερ τηε λογ. Τηε θυιχκ βροων φοξ ϕυµπσ οϖερ τηε λογ. Τηε θυιχκ βροων φοξ ϕυµπσ οϖερ τηε λογ. Τηε θυιχκ βροων φοξ ϕυµπσ οϖερ τηε λογ. Τηε θυιχκ βροων φοξ ϕυµπσ οϖερ τηε λογ. Τηε θυιχκ βροων φοξ ϕυµπσ οϖερ τηε λογ. Τηε θυιχκ βροων φοξ ϕυµπσ οϖερ τηε λογ. Τηε θυιχκ βροων φοξ ϕυµπσ οϖερ τηε λογ. Τηε θυιχκ βροων φοξ ϕυµπσ οϖερ τηε λογ. Τηε θυιχκ βροων φοξ ϕυµπσ οϖερ τηε λογ. Τηε θυιχκ βροων φοξ ϕυµπσ οϖερ τηε λογ. Τηε θυιχκ βροων φοξ ϕυµπσ οϖερ τηε λογ. Τηε θυιχκ βροων φοξ ϕυµπσ οϖερ τηε λογ. Τηε θυιχκ βροων φοξ ϕυµπσ οϖερ τηε λογ. Τηε θυιχκ βροων φοξ ϕυµπσ οϖερ τηε λογ. Τηε θυιχκ βροων φοξ ϕυµπσ οϖερ τηε λογ. Τηε θυιχκ βροων φοξ ϕυµπσ οϖερ τηε λογ. Τηε θυιχκ βροων φοξ ϕυµπσ οϖερ τηε λογ. Τηε θυιχκ βροων φοξ ϕυµπσ οϖερ τηε λογ. Τηε θυιχκ βροων φοξ ϕυµπσ οϖερ τηε λογ. Τηε θυιχκ βροων φοξ ϕυµπσ οϖερ τηε λογ. Τηε θυιχκ βροων φοξ ϕυµπσ οϖερ τηε λογ. Τηε θυιχκ βροων φοξ ϕυµπσ οϖερ τηε λογ. Τηε θυιχκ βροων φοξ ϕυµπσ οϖερ τηε λογ. Τηε θυιχκ βροων φοξ ϕυµπσ οϖερ τηε λογ. Τηε θυιχκ βροων φοξ ϕυµπσ οϖερ τηε λογ. Τηε θυιχκ βροων φοξ ϕυµπσ οϖερ τηε λογ. Τηε θυιχκ βροων φοξ ϕυµπσ οϖερ τηε λογ. Τηε θυιχκ βροων φοξ ϕυµπσ οϖερ τηε λογ. Τηε θυιχκ βροων φοξ ϕυµπσ οϖερ τηε λογ. Τηε θυιχκ βροων φοξ ϕυµπσ οϖερ τηε λογ. 5 Don’t forget the solutions! Greg Susan
  37. 37. Instant Replay Group Presentations TIME: 10 minutes
  38. 38. ?
  39. 39. 8:30am - 9:00am Expectations, Introductions and Ground Rules 9:00am - 9:20am Exercise 9:20am - 10:20am Presentation & Activity: Journey Mapping 10:20am - 10:40am Morning Break 10:40am - 11:00am Exercise 11:00am - 12:00pm Presentation & Activity: Personas 12:00pm - 1:00pm Lunch 1:00pm - 1:20pm Exercise 1:20pm - 2:20pm Presentation & Activity: Wireframing 2:20pm - 2:40pm Afternoon Break 2:40pm - 3:00pm Exercise 3:00pm - 4:00pm Presentation & Activity: Usability Studies 4:00pm - 5:00pm Wrap Up Agenda
  40. 40. Break! 10:20 am – 10:40 am (20 minutes)
  41. 41. <Morse Code> Exercise Two TIME: 20 minutes
  42. 42. Your Mission: <Morse Code> • Divide into small teams of 3-4 people. • Create a new code language • Each small team must create a piece of “live code” and explain how it works (translate the code). • The new code language should make sense TIME: 20 minutes
  43. 43. Your Mission: <Morse Code> • Divide into small teams of 3-4 people. • Create a new code language • Each small team must create a piece of “live code” and explain how it works (translate the code). • The new code language should make sense • People are different. We all understand different “codes.” Terminology that is understandable by some people, by not be understandable by others. We need to design and build applications that make sense to our users. TIME: 20 minutes
  44. 44. Personas Presentation & Activity
  45. 45. …what are we solving? The worst misstep one can make in design is to solve the wrong problem. JOHN CARROLL Penn State College of Information Sciences and Technology
  46. 46. Workshop Overview 1 Define Personas 2 Discuss Criteria 3 Example Persona 4 Group Activity 5 Presentations 6 Questions
  47. 47. Personas A Definition of “Personas”
  48. 48. Personas are user archetypes that represent distinct target demographics for your product or service. COOPER JOURNAL | Perfecting Your Personas
  49. 49. Persona Template Narrative Details Goals Pain Points Scenarios What are Personas? • Photo • Name • Tagline • Details • Narrative • Goals • Pain Points • Scenarios GeoNet: esriurl.com/uxuigroup
  50. 50. Why are Personas useful? • Guide Decisions • Improve Efficiency • Focus Solutions • Resolve Conflicts • Increase Success • Provide Empathy
  51. 51. Everyone needs a user-centered experience. Guide Decisions Why are Personas useful?
  52. 52. We need to work smarter, not harder. Improve Efficiency Why are Personas useful?
  53. 53. Not every feature is the right feature. Focus Solutions Why are Personas useful?
  54. 54. We should work together not apart. Resolve Conflicts Why are Personas useful?
  55. 55. We want to change our user’s lives for the better. Increase Success Why are Personas useful?
  56. 56. Provide Empathy Our expectations are not our users’ expectations. Why are Personas useful?
  57. 57. Criteria
  58. 58. What is the criteria for an Effective Persona?
  59. 59. What is the criteria for an Effective Persona? Researched
  60. 60. What is the criteria for an Effective Persona? Researched Collaborative
  61. 61. What is the criteria for an Effective Persona? Researched Collaborative Realistic
  62. 62. What is the criteria for an Effective Persona? Researched Collaborative Realistic Flexible
  63. 63. What is the criteria for an Effective Persona? Researched Collaborative Realistic Flexible Active
  64. 64. What is the criteria for an Effective Persona? Researched Collaborative Realistic Flexible Active Focused
  65. 65. If you design for everyone, you delight no one. ALAN COOPER Cooper / Cooper University …why focus on one user group?
  66. 66. Persona Example
  67. 67. Who are we building it for? Example Persona A one-stop car shopping mobile app. Young professionals without experience purchasing cars. What are we building?
  68. 68. Give the persona a face to remember and make them feel real. Photo Persona Anatomy Example Persona Narrative Details Goals Pain Points Scenarios
  69. 69. Karen needs to “Keep It Rolling” to maintain her current lifestyle. Persona Anatomy Karen Narrative Details Goals Pain Points Scenarios Name & Tagline
  70. 70. Karen is a 28 year old single working professional with a degree in marketing. She has an iPhone 5s and is an avid social media user. Persona Anatomy Karen Narrative Details Goals Pain Points Scenarios Details
  71. 71. Karen commutes 45min to work and has the same car that she got in high school. Her car recently died and she now needs to find a replacement quickly. Persona Anatomy Karen Narrative Details Goals Pain Points Scenarios Narrative
  72. 72. Persona Anatomy Goals • Understand Options • Save Money • Get Good Gas Mileage • Find Reputable Dealer • Feel Accomplished Karen Narrative Details Goals Pain Points Scenarios
  73. 73. Persona Anatomy Karen has a hard time remembering her log in credentials, she doesn’t like too much advertising and she can’t stand pages that take too long to load. Karen Narrative Details Goals Pain Points Scenarios Pain Points
  74. 74. Persona Anatomy Scenarios Karen needs to decide which vehicle is the “right one,” find out which dealerships have the model she wants, decide where to purchase from and then make the purchase. Karen Narrative Details Goals Pain Points Scenarios
  75. 75. Group Activity TIME: 30 minutes
  76. 76. Activity Research What are we building? A complete vacation planning app. Who are we building it for? Parents traveling with their children.
  77. 77. User Testing Test Observations The users tends to look for the best deal to save money. Families with small children want to sit together and take direct flights. Interview Quotes “We would like to set up the whole trip at one time” “We want to compare all of the travel options easily” “We need to be able to check flight status quickly” Demographic Data Age Range 32–48 Average Job Type Healthcare 22% Business Services 20% Retail Trade 16% Level of Education High School 17% Bachelors 62% Masters 21% Smartphone Experience iPhone 17% Android 76% Windows 07% Research Studies Survey Findings 28% of families spend between $2500 and $5000 per vacation. Average length of a family vacation is 4.7 days. 74% of people spend more than 6 hours planning a complete family vacation. Mode of Transportation Car 68% Plane 22% Train 03% Activity Research
  78. 78. Instant Replay Group Presentations TIME: 10 minutes
  79. 79. ?
  80. 80. 8:30am - 9:00am Expectations, Introductions and Ground Rules 9:00am - 9:20am Exercise 9:20am - 10:20am Presentation & Activity: Journey Mapping 10:20am - 10:40am Morning Break 10:40am - 11:00am Exercise 11:00am - 12:00pm Presentation & Activity: Personas 12:00pm - 1:00pm Lunch 1:00pm - 1:20pm Exercise 1:20pm - 2:20pm Presentation & Activity: Wireframing 2:20pm - 2:40pm Afternoon Break 2:40pm - 3:00pm Exercise 3:00pm - 4:00pm Presentation & Activity: Usability Studies 4:00pm - 5:00pm Wrap Up Agenda
  81. 81. Lunch 12:00 pm – 1:00 pm (1 hour)

×