Euro Ia Designing Exploding Websites Share


Published on

Presentation given by at the EuroIA conference in Copenhagen on September 26, 2009

Published in: Technology, Business
1 Like
  • Be the first to comment

No Downloads
Total views
On SlideShare
From Embeds
Number of Embeds
Embeds 0
No embeds

No notes for slide
  • Het zal jullie niet onbekend zijn dat de toegang tot online diensten overal mogelijk is. Onze wereld is aan het widgetizen. Mobiel, televisie of de auto, overal ben je connected.Tegelijkertijd is ons gedrag aan het veranderen. Dat gaat hand in hand.
  • Wat is de waarde die wordt gezocht, waar moet je op inspelen. Voor een specifiek klantsegment.Denk aan die receptendienst voor de impulskoper. Zit de waarde in het zonder nadenken kunnen vinden van de gerechten in de winkel via een routekaart? Wil hij van te voren zijn peers consulteren?
  • Vervolgens bepaal je waar de contactpunten van die klant liggen. Wat zijn de online media die hij gebruikt, en met wel doel. Een landkaart van elementen ontstaan zo waar je op kunt inhaken.Na deze drie stappen van analyse moet een plan worden gemaakt.
  • Euro Ia Designing Exploding Websites Share

    1. 1. Designingfor the ScatteredStructures of Exploding Websites<br />Iskander SmitPeter Boersma<br />Euro IA 2009 - Copenhagen<br /><br /> FULL SERVICE INTERNET AGENCY <br />
    2. 2.
    3. 3.
    4. 4.
    5. 5. A short history ofExploding Websites<br />
    6. 6. Model of Virtual Warmth<br />an online dialogue on the road to result<br />The contextinfluences the route<br />A product taillored<br />(Pro-active) support<br />The whole is a rich experience<br />
    7. 7. we live in a scattered environment<br />
    8. 8. social exhibitionisme<br />a custom digital life<br /> our behavior is changed<br />pull back in our own social world<br />a continuous conversation<br />continuous partial attention<br />
    9. 9. the context models our world<br />
    10. 10. attention<br />use<br />apply<br />orientation<br />inside<br />website<br />outside<br />website<br />Looking for the touchpoints<br />
    11. 11. use<br />apply<br />orientation<br />attention<br />inside<br />website<br />outside<br />website<br />Looking for the touchpoints<br />
    12. 12. “In the future websites will offer moveable services, which can be placed on everywhere the customer wishes.” Steve Rubel<br />
    13. 13. model exploding website<br />
    14. 14. mobile site<br /> exploding function<br />
    15. 15. we live with our heads in the cloud<br />
    16. 16. Tim O’Reilly<br />Devices will all have sensors. <br />In the end it is about the services you create using these sensors.<br />
    17. 17. create a system<br />
    18. 18. manage the ecosystem<br />attract<br />engage<br />convert<br />retain<br />
    19. 19. StrategiesforExploding Websites<br />
    20. 20. new strategies<br />David Armano, 2008<br />
    21. 21. brand promise<br />1<br />customer experience<br />match<br />exploding strategy<br />
    22. 22. 1<br />match<br />exploding strategy<br />2<br />engage<br />value<br />benefits<br />offer<br />product<br />promise<br />
    23. 23. 1<br />match<br />exploding strategy<br />2<br />engage<br />3<br />connect<br />context<br />scenarios<br />devices<br />touchpoints<br />
    24. 24. 1<br />match<br />exploding strategy<br />2<br />engage<br />4<br />script<br />3<br />connect<br />programme<br />plan<br />architecture<br />
    25. 25. 1<br />match<br />exploding strategy<br />5<br />measure<br />2<br />targets<br />engage<br />kpi<br />4<br />script<br />3<br />metrics<br />connect<br />
    26. 26. partners<br />6<br />employees<br />1<br />orchestrate<br />match<br />organisation<br />exploding strategy<br />5<br />measure<br />2<br />engage<br />4<br />script<br />3<br />connect<br />
    27. 27. improve<br />continuous<br />development<br />learn<br />7<br />spread<br />6<br />1<br />orchestrate<br />match<br />exploding strategy<br />5<br />measure<br />2<br />engage<br />4<br />script<br />3<br />connect<br />
    28. 28. exploding elements<br />affiliate contracts<br />improve<br />continuous<br />development<br />idealab<br />organisation mapping<br />learn<br />customer palette<br />function profiles<br />7<br />spread<br />brand promise<br />partners<br />6<br />employees<br />1<br />customer experience<br />orchestrate<br />match<br />organisation<br />exploding strategy<br />5<br />measure<br />stakeholder radar<br />2<br />engage<br />targets<br />value<br />product promise proposition<br />kpi<br />benefits<br />dashboard<br />4<br />metrics<br />script<br />offer<br />3<br />reports<br />product<br />promise<br />connect<br />programme<br />context<br />plan<br />scenarios<br />devices<br />hotspot <br />audit<br />programme plan<br />architecture<br />touchpoints<br />interactive tubemap<br />exploding architecture<br />
    29. 29. DesigningExploding Websites<br />
    30. 30. DesigningExploding Websites<br />Design Process (drafts)<br />What’s Different?<br />Tools<br />
    31. 31. Design ProcessforExploding Websites<br />
    32. 32. Draft 1: Wabi-sabi<br />
    33. 33. Wabi-sabi<br />“wabi”: limitations in design and unpredictable or changing usage conditions“sabi”: imperfect reliability or limited mortality (comparable to rust)<br />
    34. 34.
    35. 35.
    36. 36. Wabi-sabifordesigningExploding Websites<br />
    37. 37. Draft 2: Rugby ball<br />
    38. 38.
    39. 39. Draft 3: Concept Map<br />
    40. 40.
    41. 41.
    42. 42. (ahem)<br />
    43. 43. Model users<br />Specifyoutcomesthat match users’ goals<br />Profiles<br />Design adaptivecomponents<br />Contexts<br />Select valuablebehaviour to support<br />Writescenarios and scripts,and direct yourscenes<br />Touchpoints<br />
    44. 44. What’s different?<br />
    45. 45. Multiple Touchpoints<br />Know the users’ attitude towards touchpoints perform user research into behaviour and expectations<br />The wide range of touchpoints means a wide target group model more personas and their touchpoint preferences<br />You need an optimal mix of touchpoints and functionalities develop use scenarios that are valuable for both business and customer<br />
    46. 46. Multiple Contexts-of-Use<br />Consider user flow, attention, and social context design variants in interaction style andtone-of-voice<br />Some touchpoints allow for the inclusion of social features define the effects on the social context<br />
    47. 47. Context-rich Profiles<br />Each context-of-use calls for additional attributes to be added to the visitor&apos;s profile track which touchpoints have been used when, for which functionality, and how<br />Knowledgeaboutusersallowsyour designs to adapt create interfaces thatadapttheirbehaviourbasedon data from user profiles<br />
    48. 48. ToolsfordesigningExploding Websites<br />
    49. 49. Context-rich Profiles<br /> Multiple Contexts-of-Use<br /> Multiple Touchpoints<br />
    50. 50. Web Analytics to quantify current user behaviour and discover opportunities for improvement<br />
    51. 51. Analysis of a funnel<br /> We need 9 times more registrants for the game<br />xxxxx<br />xxxxx<br />xxxx<br />75%<br />xx<br />xxxx<br />xx<br />x<br />66,7%<br />0,09%<br />25%<br />x<br />register for game<br />play game<br />finish game<br />hire<br />
    52. 52. Create swimlanes (from workflow and service design practice) to document potential flows through multiple touchpoints<br />
    53. 53.
    54. 54.
    55. 55. For quick ideas about vocabulary and attitudes, use Wordle ( user interview transcripts<br />
    56. 56. Whenlookingforcorporateinformation<br />Whencompetingwithothers<br />Whenconsideringjoining a company<br />
    57. 57. Create concept maps and scenariosto explore all relationships between the objects that users encounter<br />
    58. 58.
    59. 59. Client scenarios<br />After a visitbySales, the clientreceivesan email with a confirmation, asking her to visit the portal to complete her contact data. Shealsochecks her order and downloads a copy of the invoice.<br />Ed dignissimfelis non orcilaoreet sit ametullamcorperligulapulvinar.<br />Nullafringillaeuismoderos, rutrumfacilisis nisi consequat.<br />Nam sednequevelpurusgravidapellentesqueutsedurna.<br />Maecenas nisi massa, fringillased tempus ac, suscipit at nibh.<br />
    60. 60. Scenario 1: First login<br />desktopwidget?<br />Email fromSalestriggersfirstvisit<br />Clientcreates new password uponfirst login.<br />Onfirstvisit, client is asked to confirmclient data.<br />Then taken to homepage. Likely to check order.<br />Overview of order confirmationswithoption to download.<br />Download of invoiceconcludesfirstvisit.<br />
    61. 61. Specify interactive components that employ adaptive interfaces<br />
    62. 62.
    63. 63.
    64. 64.
    65. 65.
    66. 66.
    67. 67.
    68. 68.
    69. 69. Create personas based on motivation, (not market segments) and remember different contexts trigger different behaviours<br />
    70. 70.
    71. 71. reuse an existing profile on a social network site(e.g. Ning, Facebook Connect)<br />base profile on explicitly stated interests(e.g. for e-commerce sites)<br />use the profile of the content to enrich user profiles (e.g. using metadata for targeted bannering)<br />collect behaviour over several touchpoints(e.g. Facebook Beacon, and a profile-sharing program proposed by CMS producer «GX»)<br />enrich profiles with data from profiles of friends(e.g. Hyves, Facebook)<br />
    72. 72.
    73. 73. Cases withExploding Websites<br />
    74. 74. Case 1: Association of Public Libraries<br />The Dutch Association of Public Libraries (VOB)<br /><ul><li>centrally controlled organization
    75. 75. with strong independent units
    76. 76. responsible for the quality of (online) service</li></li></ul><li>Case 1: Association of Public Libraries<br />central, local and personalized portals, socialnetworks<br />informational, functional, personal, community<br />wide range of personas, personalized portals, metricsonwidgetusage<br />
    77. 77. Case 1: Association of Public Libraries<br />Strategy<br /><ul><li>bottom-up cooperation
    78. 78. development of component-based tools
    79. 79. (not a top-down CMS and styleguide)</li></li></ul><li>Case 1: Association of Public Libraries<br />Design <br /><ul><li>personas based on behaviour patterns and touchpoint selections (not demographics)
    80. 80. sketches and storyboards(allowed for informal co-operation with the client teams)
    81. 81. rule-based designs for components(not just entire screens)
    82. 82. a high level design of a central site and local sites(all composed of widgets and modules)</li></li></ul><li>
    83. 83.
    84. 84.
    85. 85.
    86. 86.
    87. 87. Case 1: Association of Public Libraries<br />Results <br /><ul><li>designs for a library of widgets
    88. 88. on users’ personalized portals
    89. 89. on users’ social network sites
    90. 90. widgets have social elements
    91. 91. firstlibrary went live Thursday!</li></ul>collection of widgets<br />series of widgets<br />
    92. 92.
    93. 93. LessonsLearned<br />
    94. 94. Lessonslearned: Strategy<br />Strategy<br />Developing an exploding strategy is a great way to transform the service into an effective service in new contexts<br />Affiliations with partners are a logical step in an exploding strategy but not the easiest direction to take (or even envision) for a company<br />You want to build beta versions of all the elements in the exploding website&apos;s ecosystem: do not release touchpoints individually (as client will try to make you do).<br />
    95. 95. Lessonslearned: Design<br />Design<br />A collaborative design method employing sketching and storyboards, combined with script-based deliverables seems to be the best way to develop a exploding system<br />You need to switch from designing fixed structures and their interactive interfaces and start to design fragmented, impulse-driven experiences for multiple touchpoints<br />
    96. 96. Model users<br />Specifyoutcomesthat match users’ goals<br />Profiles<br />Design adaptivecomponents<br />Contexts<br />Select valuablebehaviour to support<br />Writescenarios and scripts,and direct yourscenes<br />Touchpoints<br />
    97. 97. LessonsLearned<br /> Multiple Touchpoints<br /> Multiple Contexts-of-Use<br />Context-rich Profiles<br />
    98. 98. Thankyou!<br /><br /><br /> FULL SERVICE INTERNET AGENCY <br />