UX Panel: Aligning to Multi-screen Customer Journeys at SIC2013


Published on

UX Panel
Aligning to Multi-screen Customer Journeys
Carrie Byrne, Seattle Wunderman Network
Paul Booth, iconmobile
Geoff Harrison, Blink User Experience

Multi-screen consumption is the new norm. In this session with UX and strategy leads from Seattle Wunderman Network, Blink UX, and iconmobile, you will discover how businesses can learn to align their multi-platform properties to the customer journey—or ignore the new paradigm at their own risk.

Published in: Design, Technology

UX Panel: Aligning to Multi-screen Customer Journeys at SIC2013

  1. 1. Aligning  to  mul+-­‐screen  customer  journeys  
  2. 2. Paul  Booth  iCON  MOBILE  
  3. 3. A  paradigm  shi9  has  occurred   Relevant Features Technology WOW Emotional
  4. 4. Different  channels,  different  needs   10 9 8 7 6 5 4 3 2 1 0 1a 2a 3a 4a 5a 6a 7a 8a 9a 10a 11a 12p 1p 2p 3p 4p 5p 6p 7p 8p 9p 10p 11p 12a Articles Read By Device Desktop Phone Tablet Desktop is “diving” while mobile is “snorkeling”. We use mobile in frequent and short bursts of use throughout the day.
  5. 5. For  what  we  need  right  now:   Urgent now Lookup/find (urgent/local info) I need an answer to something now – very often related to location. Edit/Create (urgent, microtasking) I need to get something done now and it can’t wait. Repetitive now Check In/Status (repeat, micro-tasking) Something important to me is changing or updating and I want to stay on top of it. Bored now Explore/Play (bored/local) I have some time to kill and just need a distraction.
  6. 6. Changing  the  way  people  buy  things...   The customer journey is more complex than it used to be. It involves a number of different sources and devices, and is very often not as linear as we think it to be. http://blogs.forrester.com/lori_wizdo/12-10-04buyer_behavior_helps_b2b_marketers_guide_the_buyers_journey
  7. 7. But  more  importantly,  how  we  relate  to  brands   Shoes Fitness
  8. 8. Automobile Mobility
  9. 9. A  breeding  ground  for  disrup+ve  innova+on   * Users don‘t care No baggage (no legacy) Crowd funding Social media Bits and bites *http://icanhas.cheezburger.com/
  10. 10. Carrie  Byrne  SEATTLE  WUNDERMAN  NETWORK    
  11. 11. 90% move between screens to complete a task Nielsen. “State of the Media: Cross-Platform Report Q2, 2012.” November 2012.
  12. 12. More screens = more design principles interac+on  design   •  Visibility  of  system   status   •  Match  between  system   Flexibility  and   •  and  real  world   efficiency  of  use   •  User  control  and   freedom   •  •  Consistency  and   standards   •  •  Error  preven+on   •  Recogni+on  over   recall   Aesthe+c  and   minimalist  design   Error  recovery   Help  and   documenta+on   (Nielsen)   •  touchscreen     •  Physical  interac+on   and  ergonomics   •  Available  inputs   •  Scale   •  Customiza+on  and   shortcuts   context  of  use   •  Color/contrast   •  Light  condi+ons   •  Sound/music   •  Noise  interference   •  Mo+on   •  Interrup+on   Responsive  design,   alternate  modes     (Carvajal)   •  •  Surfaces  for  display,   use   •  Traffic  flow  between   devices   •  Mul+-­‐screen  ac+vity  
  13. 13. A call for experience maps voice of customer •  site metrics •  satisfaction studies •  third party reports •  competitive research •  segment studies analytics market research •  tele, chat •  social •  interviews UX insights business goals •  usability studies •  cognitive walkthrough •  stakeholder interviews •  content audit •  KPIs
  14. 14. Moving from linear task flow… 1 2 3 4 5 6 7 First step" Second logical step in discovery" Sign in may appear here" Fourth step with customization" Fifth step here" Sixth step almost to the end" Task completion" Legend Linking Landmarking Expectations Forms Escalation Error Handling CTAs, Resources
  15. 15. …To  nonlinear  customer  journeys   10 days 15 days 18 days ACTIONS •  Reads article on tech blog about cloud storage trends •  Searches for branded terms •  Learns about key workloads for storage •  Scans supplier sites for differences between services, subscription levels •  Reads expert reviews about leading services •  Considers benefits of new features that exceed needs •  Checks service features against needs •  Reviews technical specs •  Begins free trial •  Converts trial to paid subscription or upgrades •  Migrates data to new service •  Downloads apps •  Administers backups, sync sessions •  Shares content with others •  Uses service toolset to author/edit stored files QUESTIONS TOUCHPOINTS TIME 7 days Cloud  Storage  Prosumer  –  “Ryan”   •  Is there a free version that meets my needs? •  Who are the big players? Are they built to last? •  What is the tier structure and how much do you get? •  Can I avoid trading on my friends to get more storage? •  Is there an app for every device? •  What’s the best plan to keep personal and business data? •  How easy is it to migrate date? To manage syncing? •  How do I add storage? •  What controls are available with sharing? •  Where does data go after trial? •  How long will it take to get started? When should I do it? •  What does the payment structure/timing look like? •  Can I cancel at anytime? What happens to my data? •  How do I renew? •  What happens to my data if I switch vendors?
  16. 16. For  example…   Evaluated on:
  17. 17. Geoff  Harrison  BLINK  UX  
  18. 18. Designing  mul+-­‐screen  customer  journeys   •  •  The  elements  and  role  of  an  experience  map   Move  from  the  experience  map  to  a  design  roadmap  
  19. 19. 1.  Create  an  experience  map   •  •  Visualize  the  journey   Inform  the  design  roadmap  
  20. 20. Experience  map  elements   •  •  •  •  •  Customer  journey  stages     Device  touchpoints     Customer  goals  and  moJvaJons     Customer  senJment   OpportuniJes  
  21. 21. ACTION Buyer  or  renter  experience  map   BEFORE 1. DEFINE DURING 2.SEARCH 3. COMPARE AFTER 4. CHOOSE GOAL •  SEARCH FOR SPECIFICS: Gather information about facilities, commute, security, size, floor plan, year built, sun’s position, etc. •  SEARCH EFFICIENTLY: Get quick answers on websites that load fast and require few clicks •  COMPARE VISUALIZATIONS: Pictures of the property, the building, the street, etc. •  COMPARE SPECIFICS: Facilities, commute, security, size, floor plan, year built, sun’s position, etc. •  MAKE INFORMED CHOICE: The right choice will stand out because it’s clear that it fulfills the requirements (FAMILY, FRIENDS) Ask for advice about neighborhoods and property types (FAMILY, FRIENDS) get recommendations for agents and websites (DOORMAN) Ask about the neighbors, crime, vacancies Call agent (FAMILY, FRIENDS) Ask for advice about the best option (FAMILY) Ask for approval Schedule visits Present the decision Look for properties Google, search engines (mainly ZAP and WEBCASAS), real estates websites, Google maps Visualize options and get more info. about properties web search engines, real estates websites, news, Google maps Get information about the neighborhood, look for services in the area (painters, plumber etc) Walk thought a neighborhood looking for “For Rent” or “For Sale” signs Visit properties to gather more information Move into new home TOUCH POINTS AGENCY INTERNE T Use the internet to learn about shops, restaurants, parks, crime, and public transit available in regions PLACES DEVICES / TOOLS Call, Internet Internet Hope and excitement about improving their quality of life. Internet Call, pictures Internet, Word, Excel, email Frustration by not finding the ideal property online or let down if the property doesn’t match description (very different from the pictures). Internet, Word, email •  SIGN CONTRACT: Understand how the process works and sign the contract 6. MOVE •  DEFINE FINANCES: Determine what they can afford and how they will finance the home •  DEFINE LOCATION: Learn about regions and property types PEOPLE SATISFACTION LEVEL 5. CONTRACT •  SETTLE INTO NEW HOME: Unpack and get to know the region, facilities, commute •  RENNOVATE: make changes to the property or hire someone to do the work (FAMILY, FRIENDS) Live together, invite over to visit Deliver documents and sign the contract Call Happiness for finding the right property and starting fresh. Internet Call, Internet
  22. 22. City  visit  app  experience  map  (touchpoints)  
  23. 23. City  visit  app  experience  map  (goals)  
  24. 24. City  visit  app  experience  map  (sen+ment)   Feelings
  25. 25. City  visit  app  experience  map  (opportuni+es)  
  26. 26. 2.  Priori+ze  the  opportuni+es   IdenJfy  the  customer  pain  points  on  the  map   •  PrioriJze  opportuniJes  based  on  customer,  business  and  technical   value     • 
  27. 27. 3.  Create  new  customer  stories     Storyboard  how  someone  would  ideally  move  through  and  feel  in   the  new  experience   •  Ensure  the  story  encompasses  the  prioriJzed  opportuniJes   • 
  28. 28. 2.  Create  new  customer  stories    
  29. 29. Crea+ng  customer  stories   MulJ-­‐device  stories  are  usually  ones  that  build  on  each  other     e.g.    Customer  gets  status  on  mobile  on  way  to  work,  later   accesses  the  product  on  her  laptop   •  Think  of  stories  first,  devices  second.       A  single  story  may  apply  to  more  than  one  device   •  Be  clear  about  where  each  story  fits  in  the  experience  lifecycle   A  single  story  may  be  applied  in  more  than  one  place     •   
  30. 30. 4.  The  design  roadmap   •  •  •  •      Experience  map   Illustrated  customer  stories   Feature  matrix  by  channel   Detailed  design,  prototyping  and  tesJng  plan  
  31. 31. Ques+ons?    
  32. 32. Our  ques+ons  for  you   What  is  the  number  one  thing  you  find  that  prevents  you  from   doing  this?   •  What  are  the  barriers  for  geUng  this  started?   •  What  alternaJve  methods  have  you  used  to  inform  experience   maps?   •  How  do  you  get  started?   •  What  mistakes  do  you  see  being  made  frequently   •