• Save
Design for Cross Channel - UX Week 2012 Workshop
Upcoming SlideShare
Loading in...5

Design for Cross Channel - UX Week 2012 Workshop



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

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



Total Views
Views on SlideShare
Embed Views



16 Embeds 1,576

http://www.transmediakids.com 1094
http://9126519847006177345_cb7ce5d3a8b8554b438635c07bfa9db1c8ca758d.blogspot.com 263
http://serve4impact.com 112
http://triducnguyen.info 43
http://lanyrd.com 17
http://abtasty.com 14
https://twitter.com 10
http://translate.googleusercontent.com 5
http://flavors.me 5
http://pinterest.com 4
http://www.linkedin.com 2
https://www.linkedin.com 2
http://www.pinterest.com 2
http://www.storytelling.es 1
http://ranksit.com 1
http://fredzimny.wordpress.com 1



Upload Details

Uploaded via as Microsoft PowerPoint

Usage Rights

© All Rights Reserved

Report content

Flagged as inappropriate Flag as inappropriate
Flag as inappropriate

Select your reason for flagging this presentation as inappropriate.

  • Full Name Full Name Comment goes here.
    Are you sure you want to
    Your message goes here
Post Comment
Edit your comment
  • 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 Design for Cross Channel - UX Week 2012 Workshop Presentation Transcript

  • design forcross-channel delight UX Week August 22, 2012 @samanthastarmer
  • 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
  • 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
  • a fewlogistics
  • extrapolation encouraged http://www.flickr.com/photos/danilush/3259099985
  • questions & input encouraged http://www.flickr.com/photos/ducdigital/3011652637/
  • activities and discussion http://www.flickr.com/photos/acplinfo/3721979202/
  • scheduled break http://www.flickr.com/photos/johnmcnab/4298812
  • but anytime… http://www.flickr.com/photos/baggis/4701908515
  • Director, Customer Experience for REI Experience DesignInformation and Content Management Microsoft, Amazon Teach at University of Washington
  • 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
  • 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…
  • 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
  • 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
  • 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
  • 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
  • let’sbegin
  • a story… http://www.flickr.com/photos/sugarpond/3016905349
  • july 19, 6am
  • it started as a good day
  • and then…
  • kaboom http://www.flickr.com/photos/amishpatel/4803420473
  • my car
  • his car
  • and yes…
  • the cop car http://www.flickr.com/photos/sillygwailo/56
  • proof of insurance http://www.flickr.com/photos/rootology/2767323250/
  • oh crap
  • just don’t do it again http://www.flickr.com/photos/rootology/2767323250/
  • exchanging information
  • need to get car out of road
  • so sad – collision repair http://www.carstar.com/files/6uiyw73inwb3f999189vjwzsyjpv7o09.jpg
  • this is why Ihave insurance
  • two hours later – ow.
  • good, they have an app
  • can’t get in
  • okay, trying the website
  • arrrrgh
  • damn, have to talk to a human
  • “go to Valley Medical Center”
  • we can’t help you
  • “oops”
  • 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
  • five days later…
  • oh, that’s helpful
  • the paperwork begins
  • my friend, the fax machine
  • a flurry of mail
  • from all different people
  • confusing mail
  • over three months later
  • insurance was supposed to pay this…
  • we can’t help
  • crap, i better pay
  • silencesilence
  • four months later
  • six months later
  • moresilence
  • march
  • thanks a bunch. Ta
  • lesson? http://www.flickr.com/photos/pjern/2150873799
  • holisticexperience
  • digital and physical are colliding
  • even for luddites
  • ebooks with books
  • devices outdoors Nexus 7 Camping: http://www.youtube.com/watch?v=qqiSE-ukmgc
  • 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
  • Square/Starbucks - don’teven have to take the phone outof your pocket or sign a receipt. https://squareup.com/pay-with-square
  • Warby Parker – try on five pairs, choose one
  • digital self service for physical task
  • Virtual Fridge Lock – late night raidautomatically transmits to your social networks http://www.bangstyle.com/wp-content/uploads/2012/05/e06fc2b0a04a0b1f4c0ad1bc21bcf820-621x465.jpg
  • Fashion Like – real time facebook likes for each item http://zapp5.staticworld.net/images/article/2012/05/fashion20like-11356673.jpg
  • physical/digital groceries http://www.youtube.com/watch?v=nJVoYsBym88
  • “experiential industry” : people in the future willing to allocate high percentages of theirsalaries to live amazing experiences.
  • (and here is our opportunity)
  • integrated experiences are few and far between Alexandra Deschamps-Sonsinohttp://www.slideshare.net/designswarm/creating-the-internet-of-things
  • 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.
  • 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
  • we usuallydesign for a particular channel
  • users don’tdistinguish channels
  • http://www.crwgraphics.com/blog/wp-content/uploads/2010/08/multichannel-marketing.bmp
  • users don’tthink about design disciplines
  • 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
  • usersdo think about all of their experiences
  • across time,touchpoints, devices and channels
  • we have to designbeyond websites, mobile devices, software apps…
  • design for cross channel experiences
  • idly flipping – oh, cheap TV
  • can I buy it locally?
  • gotta buy something for me
  • cool
  • all set
  • here we are
  • picking up in store…
  • oh god, Christmas
  • but I have my list!
  • and it tells me where!
  • a little hard to see…
  • but it worked!
  • not easy
  • cross between herding cats http://www.flickr.com/photos/wendyness/2278274546
  • and slaying dragons http://www.flickr.com/photos/76578669@N00/377000490
  • 5 principles1. consistent2. convenient3. connected4. contextual5. (a) cross time
  • consistent
  • shopping has many stages
  • especially gifts
  • awesome, gift ideas
  • we often cross channels
  • and need consistency
  • good, the same recommendations
  • here too
  • not so good
  • same item, different info sign catalog site
  • and more different info eMail site in-store product handout product tag advertising
  • convenient
  • my first iPhone app
  • even better…
  • no need to call http://www.flickr.com/photos/zachklein/3964249 http://www.flickr.com/photos/jsrcyclist/31813
  • or get out of the car Walgreen’s drive in http://www.flickr.com/photos/ambernectar/4042608385
  • not so convenient
  • what happened to self service?
  • connected
  • the experience of transitions http://www.flickr.com/photos/mcdemoura/2209204939
  • leafing through GQ…
  • hubby would look great in that
  • I can get the look!
  • going to GQ/selects
  • here it is
  • and I can buy it
  • (plus great cross commentary)
  • not so good
  • my mom
  • her favorite store
  • directory
  • departments
  • her favorite department
  • but…
  • no encore
  • but they have plus sized clothes
  • lots of them
  • and they are tagged encore
  • mom was sad
  • contextual
  • may not have a tape measure http://www.flickr.com/photos/nicpic/30423961
  • but I have my phone!
  • 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
  • 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
  • (a)cross time
  • traveling on 3/26/11
  • yuck
  • nightmare lines
  • they didn’t forget about me
  • not so good
  • tests at the doctor’s office
  • results by mail
  • but not on the website?
  • 5 principles1. consistent2. convenient3. connected4. contextual5. (a) cross time
  • some tools1. employee research2. environment research3. make it or break it4. touchpoint inventory5. interaction ecology6. experience mapping7. experience matrix
  • 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
  • good ideas here
  • employee research
  • 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
  • mobile point-of-sale
  • have to carry two devices
  • following + notes3 notebooks full of notes look at the handwriting, seriously
  • turned into blog3 notebooks full of notes … which became a blog
  • then set up diary studyafter every transaction, record the story 15 stores nationwide 100+ employees
  • organize transcripts
  • affinity map
  • co-design
  • 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
  • not quite mobile
  • the store room
  • inventory
  • uniform issues
  • 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”
  • how many screens?
  • old systems
  • tangled wires
  • low tech communications
  • busy lines
  • convoluted org chart http://cei.org/sites/default/files/Table-from-Amicus-Motion-MN--RI-11-10-2010.jpg
  • make it or break it
  • 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?
  • ACTIVITYmake it or break it
  • remember?
  • my car
  • ow
  • the paperwork
  • please make it better!!
  • what are themake or break experienceopportunities?
  • 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
  • observations?
  • touchpoint inventory http://brandtouchpointmatrix.com/
  • 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
  • touchpoint inventory
  • touchpoint inventory
  • touchpoint inventory
  • touchpoint inventory
  • interaction ecologyvia Justin Davishttp://www.slideshare.net/jwd2a/toilet-paper-and-information-sharing-designing-compelling-information-ecosystems
  • 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
  • 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
  • example
  • define the narrative
  • define the needed interactions
  • define the interaction location
  • define the touchpoint
  • define the data points
  • repeat for each interaction in narrative
  • map the connections
  • ACTIVITYinteraction ecology
  • the narrative1. accident occurs2. exchange information3. tow car4. get rental5. get treatment for injuries6. provide report to insurance7. get progress report from insurance8. resolution
  • 1. specify the interaction exchange information
  • 2. define the interaction location exchange information in street
  • 3. define the touchpoint exchange information in street mobile
  • 4. define the data points exchange information in street mobile insurance information name
  • observations?
  • experience mapping http://www.thosepeskyusers.com/wp-content/uploads/2010/12/customer-experience-map.jpg
  • 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?)
  • http://adaptivepath.com/uploads/documents/RailEurope_AdaptivePath_CXMap_FINAL.pdf
  • campaign ‘experience’ map
  • journey mapping
  • marketing alignment mapping
  • good collection of examples http://pinterest.com/uxjam/journeys/
  • experience matrix
  • 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
  • ACTIVITYexperience matrix
  • you are ameriprise Ta
  • 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’
  • what is neededto support the better experience?
  • 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
  • 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
  • observations?
  • start…
  • plan
  • involve others
  • work creatively
  • work creatively
  • simulate
  • open the kimono
  • cross train
  • share the wealth http://www.flickr.com/photos/jimfrazier/1810966604/
  • everyone owns cross channel experience
  • questions?? http://www.flickr.com/photos/druclimb/3277540656/
  • thank you!! http://www.flickr.com/photos/baking_in_pearls/3960662314