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

1. Designingfor the ScatteredStructures of Exploding Websites Iskander SmitPeter Boersma Euro IA 2009 - Copenhagen info.nl FULL SERVICE INTERNET AGENCY

5. A short history ofExploding Websites

6. Model of Virtual Warmth an online dialogue on the road to result The contextinfluences the route A product taillored (Pro-active) support The whole is a rich experience

7. we live in a scattered environment

8. social exhibitionisme a custom digital life our behavior is changed pull back in our own social world a continuous conversation continuous partial attention

9. the context models our world

10. attention use apply orientation inside website outside website Looking for the touchpoints

11. use apply orientation attention inside website outside website Looking for the touchpoints

12. “In the future websites will offer moveable services, which can be placed on everywhere the customer wishes.” Steve Rubel

13. model exploding website

14. mobile site exploding function

15. we live with our heads in the cloud

16. Tim O’Reilly Devices will all have sensors. In the end it is about the services you create using these sensors.

17. create a system

18. manage the ecosystem attract engage convert retain

19. StrategiesforExploding Websites

20. new strategies David Armano, 2008

21. brand promise 1 customer experience match exploding strategy

22. 1 match exploding strategy 2 engage value benefits offer product promise

23. 1 match exploding strategy 2 engage 3 connect context scenarios devices touchpoints

24. 1 match exploding strategy 2 engage 4 script 3 connect programme plan architecture

25. 1 match exploding strategy 5 measure 2 targets engage kpi 4 script 3 metrics connect

26. partners 6 employees 1 orchestrate match organisation exploding strategy 5 measure 2 engage 4 script 3 connect

27. improve continuous development learn 7 spread 6 1 orchestrate match exploding strategy 5 measure 2 engage 4 script 3 connect

28. exploding elements affiliate contracts improve continuous development idealab organisation mapping learn customer palette function profiles 7 spread brand promise partners 6 employees 1 customer experience orchestrate match organisation exploding strategy 5 measure stakeholder radar 2 engage targets value product promise proposition kpi benefits dashboard 4 metrics script offer 3 reports product promise connect programme context plan scenarios devices hotspot audit programme plan architecture touchpoints interactive tubemap exploding architecture

29. DesigningExploding Websites

30. DesigningExploding Websites Design Process (drafts) What’s Different? Tools

31. Design ProcessforExploding Websites

32. Draft 1: Wabi-sabi

33. Wabi-sabi “wabi”: limitations in design and unpredictable or changing usage conditions“sabi”: imperfect reliability or limited mortality (comparable to rust)

36. Wabi-sabifordesigningExploding Websites

37. Draft 2: Rugby ball

40. Draft 3: Concept Map

43. (ahem)

45. Model users Select valuablebehaviour to support

46. Specifyoutcomesthat match users’ goals Writescenarios and scripts,and direct yourscenes

47. Design adaptivecomponents

48. Profiles Contexts Touchpoints

49. What’s different?

50. Multiple Touchpoints Know the users’ attitude towards touchpoints perform user research into behaviour and expectations The wide range of touchpoints means a wide target group model more personas and their touchpoint preferences You need an optimal mix of touchpoints and functionalities develop use scenarios that are valuable for both business and customer

51. Multiple Contexts-of-Use Consider user flow, attention, and social context design variants in interaction style andtone-of-voice Some touchpoints allow for the inclusion of social features define the effects on the social context

52. Context-rich Profiles Each context-of-use calls for additional attributes to be added to the visitor's profile track which touchpoints have been used when, for which functionality, and how Knowledgeaboutusersallowsyour designs to adapt create interfaces thatadapttheirbehaviourbasedon data from user profiles

53. ToolsfordesigningExploding Websites

54. Context-rich Profiles Multiple Contexts-of-Use Multiple Touchpoints

55. Web Analytics to quantify current user behaviour and discover opportunities for improvement

56. Analysis of a funnel  To hire XX people, we need Ytimes more registrants for the game (assuming we increase registration-to-play rate to 75%) xxxxx xxxxx xxxx 75% xx xxxx xx x 66,7% 0,09% 25% x register for game play game finish game hire

57. Create swimlanes (from workflow and service design practice) to document potential flows through multiple touchpoints

60. For quick ideas about vocabulary and attitudes, use Wordle (http://wordle.net)on user interview transcripts

61. Whenlookingforcorporateinformation Whencompetingwithothers Whenconsideringjoining a company

62. Create concept maps and scenariosto explore all relationships between the objects that users encounter

64. Multiple-touchpointscenarios After a visitbySales, the clientreceivesanemail with a confirmation (1), asking her to visit the portal to complete her contact data (2-4). Shealsochecks her order and downloads a copy of the invoice (6-7). Ed dignissimfelis non orcilaoreet sit ametullamcorperligulapulvinar. Nullafringillaeuismoderos, rutrumfacilisis nisi consequat. Nam sednequevelpurusgravidapellentesqueutsedurna. Maecenas nisi massa, fringillased tempus ac, suscipit at nibh.

65. Scenario 1: First login 1 4 2 5 3 desktopwidget 6 7 Email fromSalestriggersfirstvisit Clientcreates new password uponfirst login. Onfirstvisit, client is asked to confirmclient data. Then taken to homepage. Likely to check order. Overview of order confirmationswithoption to download. Touchpoint selection(1=email, 2-7 = web, rest=widget)

66. Specify interactive components that employ adaptive interfaces

74. Create personas based on motivation, (not market segments) and remember different contexts trigger different behaviours

76. reuse an existing profile on a social network site(e.g. Ning, Facebook Connect) base profile on explicitly stated interests(e.g. for e-commerce sites) use the profile of the content to enrich user profiles (e.g. using metadata for targeted bannering) collect behaviour over several touchpoints(e.g. Facebook Beacon, and a profile-sharing program proposed by CMS producer «GX») enrich profiles with data from profiles of friends(e.g. Hyves, Facebook)

78. Cases withExploding Websites

80. with strong independent units

83. development of component-based tools

85. sketches and storyboards(allowed for informal co-operation with the client teams)

86. rule-based designs for components(not just entire screens)

93. on users’ personalized portals

94. on users’ social network sites

95. widgets have social elements

96. firstlibrary went live Thursday!collection of widgets series of widgets

98. LessonsLearned

99. Lessonslearned: Strategy Strategy Developing an exploding strategy is a great way to transform the service into an effective service in new contexts Affiliations with partners are a logical step in an exploding strategy but not the easiest direction to take (or even envision) for a company You want to build beta versions of all the elements in the exploding website's ecosystem: do not release touchpoints individually (as client will try to make you do).

100. Lessonslearned: Design Design A collaborative design method employing sketching and storyboards, combined with script-based deliverables seems to be the best way to develop a exploding system You need to switch from designing fixed structures and their interactive interfaces and start to design fragmented, impulse-driven experiences for multiple touchpoints

101. Model users Specifyoutcomesthat match users’ goals Profiles Design adaptivecomponents Contexts Select valuablebehaviour to support Writescenarios and scripts,and direct yourscenes Touchpoints

102. LessonsLearned Multiple Touchpoints Multiple Contexts-of-Use Context-rich Profiles

103. Thankyou! iskander@info.nlpeterbo@info.nl info.nl FULL SERVICE INTERNET AGENCY