0
morville@semanticstudios.comDesign forCross-Channel ExperiencesSamantha Starmer, REIPeter Morville, Semantic Studios      ...
who am I?   morville@semanticstudios.com
morville@semanticstudios.com                      3
morville@semanticstudios.com                      4
morville@semanticstudios.com                      5
morville@semanticstudios.comAgenda9:00 - 9:15     Introductions9:15 - 10:30    IA: Beyond the Web (Peter)10:30 - 11:00   C...
morville@semanticstudios.comSlidesSamantha’shttp://www.slideshare.net/sstarmer/Peter’shttp://www.slideshare.net/morville/h...
morville@semanticstudios.com                Ubiquitous IA                Cross-Channel StrategyPeter Morville, IA Summit 2...
morville@semanticstudios.com#dtdt                              9
morville@semanticstudios.com                             Architecture                             Design                  ...
morville@semanticstudios.comPolar Bear IA    in•for•ma•tion ar•chi•tec•turen.    •   The structural design of shared      ...
morville@semanticstudios.com
morville@semanticstudios.com
morville@semanticstudios.comFragmentation  Fragmentation into multiple  sites, domains, and identities is  clearly a major...
morville@semanticstudios.comVisual ThinkingUnwritten Rule #1“Whoever best describes aproblem is the person mostlikely to s...
morville@semanticstudios.com                 Web Strategy1. One Library2. Core Areas3. Network Intelligence               ...
morville@semanticstudios.comExperience Across Channels                                         17
morville@semanticstudios.com
morville@semanticstudios.com                    19
morville@semanticstudios.com     Search is a Complex, Adaptive SystemSource: Search Patterns (2010)                       20
morville@semanticstudios.com                    21
morville@semanticstudios.comWhere architects useforms and spaces to designenvironments for inhabitation,information archit...
morville@semanticstudios.com                                                                                              ...
morville@semanticstudios.com                    24
morville@semanticstudios.com“Desire Lines”                                                  25Photo: Berkeley Path Gallery...
morville@semanticstudios.com                    26
morville@semanticstudios.com                    27
morville@semanticstudios.comExperiences Across Channels
morville@semanticstudios.com               The Future of Mobile Search  Location AwareLocation Aware       Query byby Wand...
morville@semanticstudios.com
morville@semanticstudios.com                                       World’s Best                                   Informat...
morville@semanticstudios.com
morville@semanticstudios.com                    33
morville@semanticstudios.com“Collaborative Consumptiondescribes the rapid explosionin traditional sharing,bartering, lendi...
morville@semanticstudios.com        Desktop                                MobileKiosk                                    ...
morville@semanticstudios.comUp The Stairs“How do we make it easier for people to learn about multi-channel possibilities?”...
morville@semanticstudios.com                    37
morville@semanticstudios.com
Sensors        morville@semanticstudios.com•   Location (GPS)•   Orientation (Compass)•   Motion (Accelerometer)•   Orient...
morville@semanticstudios.com                    40
morville@semanticstudios.com“After a half-hour, a three-tone alert sounds…If thebottle still has not been opened, the syst...
morville@semanticstudios.com                    42
morville@semanticstudios.com                    43
morville@semanticstudios.com              find·a·bil·i·ty n                  The quality of being locatable or            ...
morville@semanticstudios.comDavid Roseambientdevices.com                    45
morville@semanticstudios.com                    46
morville@semanticstudios.com                    47
morville@semanticstudios.com                    48
morville@semanticstudios.comBrainPort  Camera in glasses  captures video.  Image recreated on  grid of 400 electrodes.  Us...
Touchpoint Taxonomy            morville@semanticstudios.com                                                            Med...
morville@semanticstudios.com   reFraming1. Classic Information Architecture(Polar Bear).2. Web Strategy (Web, Mobile, Soci...
morville@semanticstudios.com                    52
morville@semanticstudios.com       What is Information Architecture?http://www.maya.com/the-feed/what-is-information-archi...
morville@semanticstudios.comWhat architects do forbuildings, information architects dofor…
morville@semanticstudios.com                    55
morville@semanticstudios.com“There is a problem in discussing systems onlywith words. Words and sentences must, bynecessit...
morville@semanticstudios.com"In an era of cross-channelexperiences and product-servicesystems, it makes less and lesssense...
morville@semanticstudios.com  “…mapping the customer journey, modeling the system dynamics, andanalyzing impacts upon busi...
morville@semanticstudios.com                    59
morville@semanticstudios.com
morville@semanticstudios.comThe fast parts learn, propose, andabsorb shocks; the slow partsremember, integrate, and constr...
morville@semanticstudios.com                    62
morville@semanticstudios.comRichard Saul Wurman’s Sandcastles (1971). Stolen from The Nature of IA by Dan Klyn (2010).
http://is.gd/iaprezi    morville@semanticstudios.com
morville@semanticstudios.com                    65
morville@semanticstudios.comAgenda9:00 - 9:15     Introductions9:15 - 10:30    IA: Beyond the Web (Peter)10:30 - 11:00   C...
morville@semanticstudios.com                A Framework for                Cross-Channel StrategyPeter Morville, IA Summit...
morville@semanticstudios.com                    68
morville@semanticstudios.com                             goals, strategy, brand,                             process, tech...
morville@semanticstudios.com                    70
morville@semanticstudios.comDesign Principles                                        71
morville@semanticstudios.comCross-Channel Strategy                      http://findability.org/archives/000652.phpComposit...
morville@semanticstudios.comAdapted from Cross-Platform Service User Experience                                           ...
morville@semanticstudios.comTodays “service systems” may include interrelatedsub-systems (e.g., person-to-person, self-ser...
morville@semanticstudios.comCraft beautiful designs that deliver a quality experienceto your users no matter how large (or...
morville@semanticstudios.com                    76
Why Separate Mobile & Desktop Webmorville@semanticstudios.com                                                     Pages at...
morville@semanticstudios.com                                        Mobile                                                ...
morville@semanticstudios.com                                                                     79Source: Mobile First (2...
morville@semanticstudios.com
morville@semanticstudios.com                    81
morville@semanticstudios.com                    82
morville@semanticstudios.com                    83
morville@semanticstudios.com                    84
morville@semanticstudios.com                    85
Transmedia Design by Jakob Nielsen                         morville@semanticstudios.comhttp://www.useit.com/alertbox/3-scr...
morville@semanticstudios.comTo make the right decisions about composition andconsistency, you need a cross-channel strateg...
morville@semanticstudios.comDesign for Connection                             88
morville@semanticstudios.comOver 50% of REIonline business ispicked up in a store.                              89
morville@semanticstudios.com                    90
morville@semanticstudios.com                    91
morville@semanticstudios.comBarcodeIdentifies a Product (e.g. Kellogg’s Frosted Flakes 14 oz.)QR CodeInitiates a Response ...
morville@semanticstudios.com
morville@semanticstudios.comPrice CheckProduct DetailEndless Aisle                        94
Continuity   morville@semanticstudios.com                                 95
Conflict   morville@semanticstudios.com                               96
Context   morville@semanticstudios.com                              97
morville@semanticstudios.comCross-Channel   We must leave our               Marathoncomfort zones, cross-train,    and col...
morville@semanticstudios.com                    99
morville@semanticstudios.com                   100
morville@semanticstudios.com                   101
morville@semanticstudios.com                   102
morville@semanticstudios.comSource:delightability.com                                               103
morville@semanticstudios.com                      Mental ModelsTasksFeatures           http://www.rosenfeldmedia.com/books...
morville@semanticstudios.com                   105
morville@semanticstudios.com                   106
morville@semanticstudios.comhttp://www.adaptivepath.com/ideas/the-anatomy-of-an-experience-map                            ...
morville@semanticstudios.com                   108
morville@semanticstudios.comUX Swimlanes                                  109
morville@semanticstudios.com                                               110Urban Sensing by Dan Hill
Resources   morville@semanticstudios.com                                111
morville@semanticstudios.comIA Therefore I AmPeter Morvillemorville@semanticstudios.comUnderstanding IA (Prezi)http://is.g...
Upcoming SlideShare
Loading in...5
×

Design for Cross-Channel Experiences

7,794

Published on

Slides for the IA Summit 2012 workshop, Design for Cross-Channel Experiences, by Peter Morville and Samantha Starmer.

Published in: Design, Technology
2 Comments
51 Likes
Statistics
Notes
No Downloads
Views
Total Views
7,794
On Slideshare
0
From Embeds
0
Number of Embeds
10
Actions
Shares
0
Downloads
396
Comments
2
Likes
51
Embeds 0
No embeds

No notes for slide

Transcript of "Design for Cross-Channel Experiences"

  1. 1. morville@semanticstudios.comDesign forCross-Channel ExperiencesSamantha Starmer, REIPeter Morville, Semantic Studios 1
  2. 2. who am I? morville@semanticstudios.com
  3. 3. morville@semanticstudios.com 3
  4. 4. morville@semanticstudios.com 4
  5. 5. morville@semanticstudios.com 5
  6. 6. morville@semanticstudios.comAgenda9:00 - 9:15 Introductions9:15 - 10:30 IA: Beyond the Web (Peter)10:30 - 11:00 Coffee Break11:00 - 12:00 What is X-Channel? (Samantha) Exercise #1: Experience Opportunities12:00 - 1:30 Lunch Break1:30 - 2:30 X-Channel: How (Peter & Samantha)2:30 - 3:30 Exercise #2: Experience Mapping3:30 - 4:00 Coffee Break4:00 - 5:00 Q&A, Discussion, Closing Remarks 6
  7. 7. morville@semanticstudios.comSlidesSamantha’shttp://www.slideshare.net/sstarmer/Peter’shttp://www.slideshare.net/morville/http://semanticstudios.com/xchannel.pdfhttp://prezi.com/aafmvya6bk7t/understanding-information-architecture/ 7
  8. 8. morville@semanticstudios.com Ubiquitous IA Cross-Channel StrategyPeter Morville, IA Summit 2012 8
  9. 9. morville@semanticstudios.com#dtdt 9
  10. 10. morville@semanticstudios.com Architecture Design TechnologyInformation Architecture: It’s What You Do First. 10
  11. 11. morville@semanticstudios.comPolar Bear IA in•for•ma•tion ar•chi•tec•turen. • The structural design of shared information environments. • The combination of organization, labeling, search, and navigation systems in web sites and intranets. • The art and science of shaping information products and experiences to support usability and findability. • An emerging discipline and community of practice focused on bringing principles of design and architecture to the digital landscape. 11
  12. 12. morville@semanticstudios.com
  13. 13. morville@semanticstudios.com
  14. 14. morville@semanticstudios.comFragmentation Fragmentation into multiple sites, domains, and identities is clearly a major problem. Users don’t know which site to visit for which purpose.Findability Users can’t find what they need from the home page, but most users don’t come through the front door. They enter via a web search or a deep link, and are confused by what they find. Even worse, most never use the Library, because its resources aren’t easily findable.
  15. 15. morville@semanticstudios.comVisual ThinkingUnwritten Rule #1“Whoever best describes aproblem is the person mostlikely to solve the problem.…or, whoever draws the bestpicture gets the funding.” 15
  16. 16. morville@semanticstudios.com Web Strategy1. One Library2. Core Areas3. Network Intelligence 16
  17. 17. morville@semanticstudios.comExperience Across Channels 17
  18. 18. morville@semanticstudios.com
  19. 19. morville@semanticstudios.com 19
  20. 20. morville@semanticstudios.com Search is a Complex, Adaptive SystemSource: Search Patterns (2010) 20
  21. 21. morville@semanticstudios.com 21
  22. 22. morville@semanticstudios.comWhere architects useforms and spaces to designenvironments for inhabitation,information architects usenodes and links to createenvironments for understanding.Jorge Arango, Architectures 22
  23. 23. morville@semanticstudios.com 23Bill Verplank, IxD11 Opening Keynote, http://vimeo.com/20285615 (00:19:30)
  24. 24. morville@semanticstudios.com 24
  25. 25. morville@semanticstudios.com“Desire Lines” 25Photo: Berkeley Path Gallery by Kevin Fox
  26. 26. morville@semanticstudios.com 26
  27. 27. morville@semanticstudios.com 27
  28. 28. morville@semanticstudios.comExperiences Across Channels
  29. 29. morville@semanticstudios.com The Future of Mobile Search Location AwareLocation Aware Query byby Wandering Search Wandering Multisensory The Future of Mobile Search
  30. 30. morville@semanticstudios.com
  31. 31. morville@semanticstudios.com World’s Best Information Architect 31Source: Subject to Change (2008)
  32. 32. morville@semanticstudios.com
  33. 33. morville@semanticstudios.com 33
  34. 34. morville@semanticstudios.com“Collaborative Consumptiondescribes the rapid explosionin traditional sharing,bartering, lending, trading,renting, gifting, and swappingreinvented through networktechnologies on a scale and inways never possible before.” 34
  35. 35. morville@semanticstudios.com Desktop MobileKiosk 35
  36. 36. morville@semanticstudios.comUp The Stairs“How do we make it easier for people to learn about multi-channel possibilities?”http://findability.org/archives/000640.php 36
  37. 37. morville@semanticstudios.com 37
  38. 38. morville@semanticstudios.com
  39. 39. Sensors morville@semanticstudios.com• Location (GPS)• Orientation (Compass)• Motion (Accelerometer)• Orientation/Motion (Gyroscope)• Touch (Multi-Touch, Gestural)• Light (Ambient)• Proximity• Device (Bluetooth)• Audio (Microphone)• Image/Video (Camera)• RFID (Soon) 39
  40. 40. morville@semanticstudios.com 40
  41. 41. morville@semanticstudios.com“After a half-hour, a three-tone alert sounds…If thebottle still has not been opened, the system makes anautomated reminder phone call to the patient or acaregiver. The GlowCap system compiles adherence datawhich anyone can be authorized to track. That way thedoctor can make sure Gramps stays on his meds.” 41
  42. 42. morville@semanticstudios.com 42
  43. 43. morville@semanticstudios.com 43
  44. 44. morville@semanticstudios.com find·a·bil·i·ty n The quality of being locatable or navigable. The degree to which an object is easy to discover or locate. The degree to which a system or environment supports wayfinding, navigation, and retrieval. am·bi·ent adj Surrounding; encircling; enveloping (e.g., ambient air)the ability to find anyone or anything from anywhere at anytime 44
  45. 45. morville@semanticstudios.comDavid Roseambientdevices.com 45
  46. 46. morville@semanticstudios.com 46
  47. 47. morville@semanticstudios.com 47
  48. 48. morville@semanticstudios.com 48
  49. 49. morville@semanticstudios.comBrainPort Camera in glasses captures video. Image recreated on grid of 400 electrodes. User feels the shape on the tongue. Brain learns to see through the tongue. 49
  50. 50. Touchpoint Taxonomy morville@semanticstudios.com Media Book Channel Platform Newspaper Web Web MagazineProduct Social Media iOS VideoPackaging Email Android AudioPrint Catalog Messaging Poster Mac OS X Billboard TelephoneCall Center Print MS WindowsWebsiteBlog ContextFacebook HomeTwitter Work WalkingYouTube Device DrivingEmail Desktop ShoppingDirect Mail Laptop Scale PlaneRadio Mobile Party Covert Tablet PersonalTelevision Television Mobile Social Personal Kiosk Location Environmental Time Architectural Task Urban 50
  51. 51. morville@semanticstudios.com reFraming1. Classic Information Architecture(Polar Bear).2. Web Strategy (Web, Mobile, Social).3. Cross-Channel Strategy (Physical, Digital).4. Intertwingularity (Ubiquitous, Ambient). 51
  52. 52. morville@semanticstudios.com 52
  53. 53. morville@semanticstudios.com What is Information Architecture?http://www.maya.com/the-feed/what-is-information-architecture 53
  54. 54. morville@semanticstudios.comWhat architects do forbuildings, information architects dofor…
  55. 55. morville@semanticstudios.com 55
  56. 56. morville@semanticstudios.com“There is a problem in discussing systems onlywith words. Words and sentences must, bynecessity, come only one a time in linear, logicalorder. Systems happen all at once. They areconnected not just in one direction, but in manydirections simultaneously. To discuss themproperly, it is necessary to use a language thatshares some of the same properties as thephenomena under discussion.”
  57. 57. morville@semanticstudios.com"In an era of cross-channelexperiences and product-servicesystems, it makes less and lesssense to design sitemaps andwireframes without also..."
  58. 58. morville@semanticstudios.com “…mapping the customer journey, modeling the system dynamics, andanalyzing impacts upon business processes, incentives, and the org chart."
  59. 59. morville@semanticstudios.com 59
  60. 60. morville@semanticstudios.com
  61. 61. morville@semanticstudios.comThe fast parts learn, propose, andabsorb shocks; the slow partsremember, integrate, and constrain.The fast parts get all the attention.The slow parts have all the power.Steward Brand on “Pace Layering”
  62. 62. morville@semanticstudios.com 62
  63. 63. morville@semanticstudios.comRichard Saul Wurman’s Sandcastles (1971). Stolen from The Nature of IA by Dan Klyn (2010).
  64. 64. http://is.gd/iaprezi morville@semanticstudios.com
  65. 65. morville@semanticstudios.com 65
  66. 66. morville@semanticstudios.comAgenda9:00 - 9:15 Introductions9:15 - 10:30 IA: Beyond the Web (Peter)10:30 - 11:00 Coffee Break11:00 - 12:00 What is X-Channel? (Samantha) Exercise #1: Experience Mapping12:00 - 1:30 Lunch Break1:30 - 2:30 X-Channel: How (Peter & Samantha)2:30 - 3:30 Exercise #2: Experience Mapping3:30 - 4:00 Coffee Break4:00 - 5:00 Q&A, Discussion, Closing Remarks 66
  67. 67. morville@semanticstudios.com A Framework for Cross-Channel StrategyPeter Morville, IA Summit 2012 67
  68. 68. morville@semanticstudios.com 68
  69. 69. morville@semanticstudios.com goals, strategy, brand, process, technology, resources, politics, culture…objects, types, metadata, audiences, user needs, structure, relationships, use cases, mental models, source, volume, growth vocabulary, behavior 69
  70. 70. morville@semanticstudios.com 70
  71. 71. morville@semanticstudios.comDesign Principles 71
  72. 72. morville@semanticstudios.comCross-Channel Strategy http://findability.org/archives/000652.phpComposition multi- or cross-channel; mix of platforms, devices, media; coherenceConsistency brand, features, organization, interaction balanced against value of optimizationConnection links, tags, signs, maps; call to actionContinuity bookmark, resume playback, flowContext personal, social, location, time, task 72Conflict identify/resolve, org chart, free-riding
  73. 73. morville@semanticstudios.comAdapted from Cross-Platform Service User Experience 73 portal.acm.org/citation.cfm?id=1851637
  74. 74. morville@semanticstudios.comTodays “service systems” may include interrelatedsub-systems (e.g., person-to-person, self-service)across multiple locations, devices, and channels; andcustomer satisfaction is “influenced by the extent ofintegration and consistency” across those channels.Bridging the “Front Stage” and “Back Stage” in Service SystemDesign by Robert J. Glushko and Lindsay Tabas 74
  75. 75. morville@semanticstudios.comCraft beautiful designs that deliver a quality experienceto your users no matter how large (or small) their display. 1. Fluid Grids 2. Flexible Images 3. Media Queries 75
  76. 76. morville@semanticstudios.com 76
  77. 77. Why Separate Mobile & Desktop Webmorville@semanticstudios.com Pages at Bagcheck? With a dual template system, we were able to optimize: 1. Source Order 2. Media (Speed, Quality, Interaction) 3. URL Structure Navigation 4. Application Design at TopNavigation at Bottom 77
  78. 78. morville@semanticstudios.com Mobile 78Source: Mobile First (2011) by Luke Wroblewski
  79. 79. morville@semanticstudios.com 79Source: Mobile First (2011) by Luke Wroblewski
  80. 80. morville@semanticstudios.com
  81. 81. morville@semanticstudios.com 81
  82. 82. morville@semanticstudios.com 82
  83. 83. morville@semanticstudios.com 83
  84. 84. morville@semanticstudios.com 84
  85. 85. morville@semanticstudios.com 85
  86. 86. Transmedia Design by Jakob Nielsen morville@semanticstudios.comhttp://www.useit.com/alertbox/3-screens-transmedia.html“The highest-value use will stay predominantly on desktop.” PC Big Screens Better Input Devices Faster Bandwidth Hardware Oomph Software Maturity Printing Mobile “The best computer is the one you have with you.” “Most companies must support both device classes …with separate UI designs.” 86
  87. 87. morville@semanticstudios.comTo make the right decisions about composition andconsistency, you need a cross-channel strategy. 87
  88. 88. morville@semanticstudios.comDesign for Connection 88
  89. 89. morville@semanticstudios.comOver 50% of REIonline business ispicked up in a store. 89
  90. 90. morville@semanticstudios.com 90
  91. 91. morville@semanticstudios.com 91
  92. 92. morville@semanticstudios.comBarcodeIdentifies a Product (e.g. Kellogg’s Frosted Flakes 14 oz.)QR CodeInitiates a Response (e.g., URL, Message, Phone, SMS, Email) 92
  93. 93. morville@semanticstudios.com
  94. 94. morville@semanticstudios.comPrice CheckProduct DetailEndless Aisle 94
  95. 95. Continuity morville@semanticstudios.com 95
  96. 96. Conflict morville@semanticstudios.com 96
  97. 97. Context morville@semanticstudios.com 97
  98. 98. morville@semanticstudios.comCross-Channel We must leave our Marathoncomfort zones, cross-train, and collaborate. Triathlon 98
  99. 99. morville@semanticstudios.com 99
  100. 100. morville@semanticstudios.com 100
  101. 101. morville@semanticstudios.com 101
  102. 102. morville@semanticstudios.com 102
  103. 103. morville@semanticstudios.comSource:delightability.com 103
  104. 104. morville@semanticstudios.com Mental ModelsTasksFeatures http://www.rosenfeldmedia.com/books/mental-models/ 104
  105. 105. morville@semanticstudios.com 105
  106. 106. morville@semanticstudios.com 106
  107. 107. morville@semanticstudios.comhttp://www.adaptivepath.com/ideas/the-anatomy-of-an-experience-map 107
  108. 108. morville@semanticstudios.com 108
  109. 109. morville@semanticstudios.comUX Swimlanes 109
  110. 110. morville@semanticstudios.com 110Urban Sensing by Dan Hill
  111. 111. Resources morville@semanticstudios.com 111
  112. 112. morville@semanticstudios.comIA Therefore I AmPeter Morvillemorville@semanticstudios.comUnderstanding IA (Prezi)http://is.gd/iapreziBloghttp://findability.org/Twitter@morville 112
  1. A particular slide catching your eye?

    Clipping is a handy way to collect important slides you want to go back to later.

×