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.

Design for Cross Channel - UX Week 2012 Workshop

6,219 views

Published on

Slides 18-66 used in prior presentations, slides 77-160 largely from other presentations, but a few new examples.

Published in: Design, Technology, Sports
  • Be the first to comment

Design for Cross Channel - UX Week 2012 Workshop

  1. 1. design forcross-channel delight UX Week August 22, 2012 @samanthastarmer
  2. 2. today what is cross channel design? why care about cross channel design how to think about cross channel design try cross channel design start cross-channel design now
  3. 3. agenda 9-9:15am introductions 9:15-10am what, why and how 10-10:30am try - tools & first exercise 10:30-11am break 11-11:30am try - tools & second exercise 11:30-12pm try – tools & third exercise 12:15-12:30pm start & wrap up
  4. 4. a fewlogistics
  5. 5. extrapolation encouraged http://www.flickr.com/photos/danilush/3259099985
  6. 6. questions & input encouraged http://www.flickr.com/photos/ducdigital/3011652637/
  7. 7. activities and discussion http://www.flickr.com/photos/acplinfo/3721979202/
  8. 8. scheduled break http://www.flickr.com/photos/johnmcnab/4298812
  9. 9. but anytime… http://www.flickr.com/photos/baggis/4701908515
  10. 10. Director, Customer Experience for REI Experience DesignInformation and Content Management Microsoft, Amazon Teach at University of Washington
  11. 11. who are you? Manager, Content Strategy  Interactive Strategist UX Designer  User Experience Lead Creative Director  Sr. Content Strategist Senior Interactive Design  Graphic Artist Specialist  User Experience Developer User Experience Manager  Senior UX Designer Information architect  UX lead/architect Interaction designer  Creative Manager Usability Specialist  UX Director Senior UX Designer  Co-founder, product-y design lead/manager
  12. 12. who are you? Range of levels of experience Some have mostly designed for the web Some have designed for web and mobile Some have designed across a large number of digital devices Some have incorporated physical Beginner to AdvancedLet’s share our knowledge and expertise – we are all learning…
  13. 13. what industries do you work in?  Travel  Healthcare Technology  Retail  High-tech  Building Automation  Online recruitment  Entertainment  Electrical Distribution  Hospitality, hotels  Insurance  Financial services  Digital Media and Services  Medical  Automotive  Telecom  Government  Non-Profit  Biotech
  14. 14. what do you hope to learn? ways to branch out into other channels incorporate retail experience into online experience 360 degree customer experience learning considerations in cross-channel understand new trend how to get teams from different disciplines and parts of the company to develop coordinated effort
  15. 15. what do you hope to learn? how to deal with transitions between channels breaking through the "thats our area/channel, not yours" mentality within an organisation how to best communicate and present a complete cross channel design solution how to design, where/how to be consistent in interaction design
  16. 16. what do you hope to learn? strategies or case studies of how product teams discovered issues in their cross-channel experiences and how they designed to improve them keeping consistency and learning the ins and outs of cross-channel promotion and design best practices, pitfalls to avoid, the good...the bad...and the ugly
  17. 17. let’sbegin
  18. 18. a story… http://www.flickr.com/photos/sugarpond/3016905349
  19. 19. july 19, 6am
  20. 20. it started as a good day
  21. 21. and then…
  22. 22. kaboom http://www.flickr.com/photos/amishpatel/4803420473
  23. 23. my car
  24. 24. his car
  25. 25. and yes…
  26. 26. the cop car http://www.flickr.com/photos/sillygwailo/56
  27. 27. proof of insurance http://www.flickr.com/photos/rootology/2767323250/
  28. 28. oh crap
  29. 29. just don’t do it again http://www.flickr.com/photos/rootology/2767323250/
  30. 30. exchanging information
  31. 31. need to get car out of road
  32. 32. so sad – collision repair http://www.carstar.com/files/6uiyw73inwb3f999189vjwzsyjpv7o09.jpg
  33. 33. this is why Ihave insurance
  34. 34. two hours later – ow.
  35. 35. good, they have an app
  36. 36. can’t get in
  37. 37. okay, trying the website
  38. 38. arrrrgh
  39. 39. damn, have to talk to a human
  40. 40. “go to Valley Medical Center”
  41. 41. we can’t help you
  42. 42. “oops”
  43. 43. THIS Valley Medical Center http://cdn.assets.sites.launchrocketship.com/7a019f65-a5c3-4d32-930 0640affd6f7b/files/de97003a-2719-4f24-bf02-3771bcfd0a72/zvm-east_exterior-afternoo
  44. 44. five days later…
  45. 45. oh, that’s helpful
  46. 46. the paperwork begins
  47. 47. my friend, the fax machine
  48. 48. a flurry of mail
  49. 49. from all different people
  50. 50. confusing mail
  51. 51. over three months later
  52. 52. insurance was supposed to pay this…
  53. 53. we can’t help
  54. 54. crap, i better pay
  55. 55. silencesilence
  56. 56. four months later
  57. 57. six months later
  58. 58. moresilence
  59. 59. march
  60. 60. thanks a bunch. Ta
  61. 61. lesson? http://www.flickr.com/photos/pjern/2150873799
  62. 62. holisticexperience
  63. 63. digital and physical are colliding
  64. 64. even for luddites
  65. 65. ebooks with books
  66. 66. devices outdoors Nexus 7 Camping: http://www.youtube.com/watch?v=qqiSE-ukmgc
  67. 67. GoPago - place an order before arriving in a store. Merchant receives on tablet. http://static2.businessinsider.com/image/5022b7b4eab8ead85c00002d-400-300/gopago-store-sign.jpg
  68. 68. Square/Starbucks - don’teven have to take the phone outof your pocket or sign a receipt. https://squareup.com/pay-with-square
  69. 69. Warby Parker – try on five pairs, choose one
  70. 70. digital self service for physical task
  71. 71. Virtual Fridge Lock – late night raidautomatically transmits to your social networks http://www.bangstyle.com/wp-content/uploads/2012/05/e06fc2b0a04a0b1f4c0ad1bc21bcf820-621x465.jpg
  72. 72. Fashion Like – real time facebook likes for each item http://zapp5.staticworld.net/images/article/2012/05/fashion20like-11356673.jpg
  73. 73. physical/digital groceries http://www.youtube.com/watch?v=nJVoYsBym88
  74. 74. “experiential industry” : people in the future willing to allocate high percentages of theirsalaries to live amazing experiences.
  75. 75. (and here is our opportunity)
  76. 76. integrated experiences are few and far between Alexandra Deschamps-Sonsinohttp://www.slideshare.net/designswarm/creating-the-internet-of-things
  77. 77. entire industries are intheir customer experience infancy (…health insurance, TV service, Internet Service providers, PC manufacturers,wireless service providers, airlines and credit card providers.) 2011, Forrester Research, Inc.
  78. 78. consumers cited their greatest frustration as when theexperience does not match the promise a company made to them up front. The New Realities of “Dating” in the Digital Age: Are Customers Really Cheating, or Are You Just Not Paying Enough Attention? Accenture 2011 Global Consumer Research Study
  79. 79. we usuallydesign for a particular channel
  80. 80. users don’tdistinguish channels
  81. 81. http://www.crwgraphics.com/blog/wp-content/uploads/2010/08/multichannel-marketing.bmp
  82. 82. users don’tthink about design disciplines
  83. 83. http://www.kickerstudio.com/blog/images/ux.jpg http://www.jjg.net/elements/pdf/elements.pdf http://www.montparnas.com/articles/wp-content/uploads/2006/10/user%20experience%20design%20explained.gif http://mickwinters.com/wp-content/uploads/2010/02/venn1.gif
  84. 84. usersdo think about all of their experiences
  85. 85. across time,touchpoints, devices and channels
  86. 86. we have to designbeyond websites, mobile devices, software apps…
  87. 87. design for cross channel experiences
  88. 88. idly flipping – oh, cheap TV
  89. 89. can I buy it locally?
  90. 90. gotta buy something for me
  91. 91. cool
  92. 92. all set
  93. 93. here we are
  94. 94. picking up in store…
  95. 95. oh god, Christmas
  96. 96. but I have my list!
  97. 97. and it tells me where!
  98. 98. a little hard to see…
  99. 99. but it worked!
  100. 100. not easy
  101. 101. cross between herding cats http://www.flickr.com/photos/wendyness/2278274546
  102. 102. and slaying dragons http://www.flickr.com/photos/76578669@N00/377000490
  103. 103. 5 principles1. consistent2. convenient3. connected4. contextual5. (a) cross time
  104. 104. consistent
  105. 105. shopping has many stages
  106. 106. especially gifts
  107. 107. awesome, gift ideas
  108. 108. we often cross channels
  109. 109. and need consistency
  110. 110. good, the same recommendations
  111. 111. here too
  112. 112. not so good
  113. 113. same item, different info sign catalog site
  114. 114. and more different info eMail site in-store product handout product tag advertising
  115. 115. convenient
  116. 116. my first iPhone app
  117. 117. even better…
  118. 118. no need to call http://www.flickr.com/photos/zachklein/3964249 http://www.flickr.com/photos/jsrcyclist/31813
  119. 119. or get out of the car Walgreen’s drive in http://www.flickr.com/photos/ambernectar/4042608385
  120. 120. not so convenient
  121. 121. what happened to self service?
  122. 122. connected
  123. 123. the experience of transitions http://www.flickr.com/photos/mcdemoura/2209204939
  124. 124. leafing through GQ…
  125. 125. hubby would look great in that
  126. 126. I can get the look!
  127. 127. going to GQ/selects
  128. 128. here it is
  129. 129. and I can buy it
  130. 130. (plus great cross commentary)
  131. 131. not so good
  132. 132. my mom
  133. 133. her favorite store
  134. 134. directory
  135. 135. departments
  136. 136. her favorite department
  137. 137. but…
  138. 138. no encore
  139. 139. but they have plus sized clothes
  140. 140. lots of them
  141. 141. and they are tagged encore
  142. 142. mom was sad
  143. 143. contextual
  144. 144. may not have a tape measure http://www.flickr.com/photos/nicpic/30423961
  145. 145. but I have my phone!
  146. 146. street bump residents use Street Bump to record “bumps” which areidentified using the device’s accelerometer and located using its GPS http://www.flickr.com/photos/topsy/188144452 http://www.newurbanmechanics.org
  147. 147. which context makes sense? Not sure how to cancel a class I registered for online. The cancellation policy just says what time frame I need to cancel in, but not how to do it online. Only suggestion is to call the store. Doesnt seem worth the hassle. REI customer comment
  148. 148. (a)cross time
  149. 149. traveling on 3/26/11
  150. 150. yuck
  151. 151. nightmare lines
  152. 152. they didn’t forget about me
  153. 153. not so good
  154. 154. tests at the doctor’s office
  155. 155. results by mail
  156. 156. but not on the website?
  157. 157. 5 principles1. consistent2. convenient3. connected4. contextual5. (a) cross time
  158. 158. some tools1. employee research2. environment research3. make it or break it4. touchpoint inventory5. interaction ecology6. experience mapping7. experience matrix
  159. 159. tips do early in project focus on ideation and brainstorming can be used with many development methodologies best to do in cross divisional groups break down the silos everyone has valuable perspective
  160. 160. good ideas here
  161. 161. employee research
  162. 162. employee research front line employees ecosystem other employees have to work within uncover training issues uncover system issues uncover priority user needs get great ideas gain buy in
  163. 163. mobile point-of-sale
  164. 164. have to carry two devices
  165. 165. following + notes3 notebooks full of notes look at the handwriting, seriously
  166. 166. turned into blog3 notebooks full of notes … which became a blog
  167. 167. then set up diary studyafter every transaction, record the story 15 stores nationwide 100+ employees
  168. 168. organize transcripts
  169. 169. affinity map
  170. 170. co-design
  171. 171. environment research hand in hand with employee research understand issues with physical environment discover experience blockers find cheaper resolutions than new technology also can be conceptual to understand organizational silos
  172. 172. not quite mobile
  173. 173. the store room
  174. 174. inventory
  175. 175. uniform issues
  176. 176. uniform and store room issues “It is usually in my pocket and gets caught on the ladder all the time… I’ve started leaving it here on the shelf instead”
  177. 177. how many screens?
  178. 178. old systems
  179. 179. tangled wires
  180. 180. low tech communications
  181. 181. busy lines
  182. 182. convoluted org chart http://cei.org/sites/default/files/Table-from-Amicus-Motion-MN--RI-11-10-2010.jpg
  183. 183. make it or break it
  184. 184. make it or break it first define existing experience(s) use research, customer feedback, behavioral data understand where the experience breaks define where the experience could be better which are the worst interactions? where could delight happen?
  185. 185. ACTIVITYmake it or break it
  186. 186. remember?
  187. 187. my car
  188. 188. ow
  189. 189. the paperwork
  190. 190. please make it better!!
  191. 191. what are themake or break experienceopportunities?
  192. 192. think about my as-is experience – what actually happened? what were my emotions? where was my experience broken? (sad face) where could Ameriprise have ‘made’ my experience? (happy face) write down the top 5 make or break opportunities
  193. 193. observations?
  194. 194. touchpoint inventory http://brandtouchpointmatrix.com/
  195. 195. touchpoint inventory track all ways customers interact with your organization can use both for as-is and to-be states excellent for corralling complex, multi- channel programs and products great to use for mapping out needed system architectures helpful for non-web/non-technology people to understand impacts
  196. 196. touchpoint inventory
  197. 197. touchpoint inventory
  198. 198. touchpoint inventory
  199. 199. touchpoint inventory
  200. 200. interaction ecologyvia Justin Davishttp://www.slideshare.net/jwd2a/toilet-paper-and-information-sharing-designing-compelling-information-ecosystems
  201. 201. interaction ecology  inspired by Justin Davis  establish key customer narrative(s)  define the needed interaction to get to each next step in the narrative  understand the location(s) that interaction might occur in  identify the touchpoint or device that can support the interaction and narrative in context  map the needed data and the connections between interactions
  202. 202. interaction ecology 1. define the narrative 2. determine the needed interactions 3. define the interaction location 4. define the touchpoint 5. define the data points 6. identify the connections 7. map the data
  203. 203. example
  204. 204. define the narrative
  205. 205. define the needed interactions
  206. 206. define the interaction location
  207. 207. define the touchpoint
  208. 208. define the data points
  209. 209. repeat for each interaction in narrative
  210. 210. map the connections
  211. 211. ACTIVITYinteraction ecology
  212. 212. the narrative1. accident occurs2. exchange information3. tow car4. get rental5. get treatment for injuries6. provide report to insurance7. get progress report from insurance8. resolution
  213. 213. 1. specify the interaction exchange information
  214. 214. 2. define the interaction location exchange information in street
  215. 215. 3. define the touchpoint exchange information in street mobile
  216. 216. 4. define the data points exchange information in street mobile insurance information name
  217. 217. observations?
  218. 218. experience mapping http://www.thosepeskyusers.com/wp-content/uploads/2010/12/customer-experience-map.jpg
  219. 219. experience mapping customer perspective, actions and reactions throughout interactions triggers and touchpoints intangible and qualitative motivations, frustrations and meanings can get all points of view on the table (e.g. is your experience my experience?)
  220. 220. http://adaptivepath.com/uploads/documents/RailEurope_AdaptivePath_CXMap_FINAL.pdf
  221. 221. campaign ‘experience’ map
  222. 222. journey mapping
  223. 223. marketing alignment mapping
  224. 224. good collection of examples http://pinterest.com/uxjam/journeys/
  225. 225. experience matrix
  226. 226. experience matrix uses ‘service blueprint’ from service design as its inspiration uses more generally known language to avoid having to provide terminology to stakeholders (e.g. front stage/back stage, physical evidence) goes the next step from defining the experience to understanding how to support it use as basis for which systems, people and processes will be impacted
  227. 227. ACTIVITYexperience matrix
  228. 228. you are ameriprise Ta
  229. 229. experience matrix define the experience narrative determine desired experience note most convenient channel/touchpoint for each part of the experience define the support people and systems needed come up with added services or benefits to ‘surprise and delight’
  230. 230. what is neededto support the better experience?
  231. 231. experience matrix define the experience narrative (done) determine desired experience (done) note most convenient channel/touchpoint for each part of the experience (done) define the support people and systems needed - remember your data points services or benefits to ‘surprise and delight’ – remember your ‘make it or break it’ ideas
  232. 232. a frameworkNarrative – Accident and Insurance story Accident occurs Exchange Tow car, get rental Report to insurance Progress Report Retrieve Car Resolution informationexperience DesiredMost convenient Channel(s)Support PeopleSupport SystemsAdded Service
  233. 233. observations?
  234. 234. start…
  235. 235. plan
  236. 236. involve others
  237. 237. work creatively
  238. 238. work creatively
  239. 239. simulate
  240. 240. open the kimono
  241. 241. cross train
  242. 242. share the wealth http://www.flickr.com/photos/jimfrazier/1810966604/
  243. 243. everyone owns cross channel experience
  244. 244. questions?? http://www.flickr.com/photos/druclimb/3277540656/
  245. 245. thank you!! http://www.flickr.com/photos/baking_in_pearls/3960662314

×