Design for Cross Channel - UX Week 2012 Workshop

5,474 views
5,347 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
0 Comments
60 Likes
Statistics
Notes
  • Be the first to comment

No Downloads
Views
Total views
5,474
On SlideShare
0
From Embeds
0
Number of Embeds
9
Actions
Shares
0
Downloads
0
Comments
0
Likes
60
Embeds 0
No embeds

No notes for slide
  • Door picture
  • Door picture
  • Door picture
  • Door picture
  • Door picture
  • Door picture
  • Door picture
  • Door picture
  • Door picture
  • Door picture
  • 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

    ×