ODD3: Praktijkcase KPN.com
13 januari 2011
Praktijkcase KPN.com ! Herontwerp online bestellen,! de check out!
Resultaatgericht dialoog ontwerpen! Online Dialogue Donderdag 13 januari 2011! Door Anouschka Scholten (@anous)! Seats2Meet Maarssen!
Bestelflow Internet, Bellen en TV! Situatie
Bezoeker heeft keuze gemaakt en wil bestellen: Pakket Internet + Bellen + TV
Dat kan vanaf o.a. deze pakket informatiepagina via de knop ´Bestellen´
Alleen de stappen daarna zijn herontwerpen:
de check out Afbeelding van pagina zoals deze live stond op kpn.com op 22/4/2010
Contact:
[email protected]
1
ODD3: Praktijkcase KPN.com
13 januari 2011
Bestelflow Internet, Bellen en TV! Startpagina van check out
Deze check out geldt voor elke productcombinatie met internet, bellen of TV
Afbeelding van pagina zoals deze live stond op kpn.com op 22/4/2010
Bestelflow Internet, Bellen en TV! Check out: van beschikbaarheid product naar winkelwagen en bedankt voor uw aankoop!
Opdracht! Verhoog de gebruikerservaring door een herontwerp van de
check out!
Afbeelding van pagina zoals deze live stond op kpn.com op 22/4/2010
Contact:
[email protected]
2
ODD3: Praktijkcase KPN.com
13 januari 2011
Inhoud! De opdracht! Aanpak! Ontwerp! Ontwerp & Resultaat: lessons !
Opdracht en resultaat!
Ontwerpuren alleen interactie! 250 uur! Doorlooptijd ontwerp! 3 maanden Ontwikkeling & implementatie
volledig door KPN !
(april-juli 2010)!
Live per 28-10-2010!
Resultaat! 9% conversiestijging! Per 10-11-2010
Contact:
[email protected]
3
ODD3: Praktijkcase KPN.com
13 januari 2011
Inhoud! De opdracht! Aanpak! Ontwerp! Ontwerp & Resultaat: lessons !
Company goals
€€€
Customer goals
Prospect / client
Mul9 Mul9 purpose phase
Mul9-‐ channel
Behavior
Behavior
Company
External influencers Compe9tors
Media
Social environment
theory © http://onlinedialogue.com icons © http://dryicons.com
Tuning the conversation!
Contact:
[email protected]
4
ODD3: Praktijkcase KPN.com
13 januari 2011
Besluit genomen, aan de kassa!
Dialoog processen!
Bedrijfsstrategie (gegeven) Online Dialoog
Strategie
Revolutie
Evolutie
Revolutie
Online Dialoog
Online Dialoog
Ontwerp
Organisatie Inrichting
Evolutie
Bestaande situatie
g ialoo ne D Onli tijk
theory © http://onlinedialogue.com
Prak slag de Aan
Dialoog aanpassingen
Contact:
[email protected]
Constant verbeteren
Organisatie aanpassingen
5
ODD3: Praktijkcase KPN.com
13 januari 2011
Dialoog processen!
Bedrijfsstrategie (gegeven) Online Dialoog
Strategie
Revolutie
Evolutie
Revolutie
Online Dialoog
Online Dialoog
Ontwerp
Organisatie Inrichting
Evolutie
Bestaande situatie
g ialoo ne D Onli tijk
theory © http://onlinedialogue.com
Prak slag de Aan
Dialoog aanpassingen
Constant verbeteren
Organisatie aanpassingen
Case KPN bestelflow: aanpak! 1 Quick review vooraf ! 2 Analyse & Brown paper sessie! 3 Ontwerp! 4 Usability test! 5 Oplevering ontwerp!
Contact:
[email protected]
6
ODD3: Praktijkcase KPN.com
13 januari 2011
Quick review! Onderdeel in de review, ʻControle van aansluitingʼ- dialoog!
Controle en flow?! Nu ben ik weer hier? Welke stap?! Nog een controle???!
Content! Wat is hier de bedoeling? Waarom is het aantal huishoudens relevant?!
Afbeelding van pagina zoals deze live stond op kpn.com op 22/4/2010
Quick review! Content! Akkoord gaan? Hoezo? Waarom? Wat als ik de aansluiting wil vervangen, dat kan niet?! Grote afhaker! Ook helpdesk kon niet helpen…! Afbeelding van pagina zoals deze live stond op kpn.com op 22/4/2010
Veel drempels…! Inconsistenties , jargon, geen antwoorden op gebruikersvragen, geen controle, …
En uitstraling, tone of voice, persuasion?!
Contact:
[email protected]
7
ODD3: Praktijkcase KPN.com
13 januari 2011
Onderzoek – stakeholder gesprekken!
Word cloud via http://www.wordle.net/
De inhoud, veel jargon!
Onderzoek – stakeholder gesprekken!
Word cloud via http://www.wordle.net/
Processen en verantwoordelijkheden!
Contact:
[email protected]
8
ODD3: Praktijkcase KPN.com
13 januari 2011
Onderzoek – stakeholder gesprekken!
Word cloud via http://www.wordle.net/
Situatie dynamisch en complex!
Onderzoek – meekijken klantcontact centrum en chatlogs!
Vragen over o.a. wijzigen, overstappen, levering! Klanten: veelal vertrouwen in KPN!
Beeld van nolanlawgrouppllc.com!
Contact:
[email protected]
9
ODD3: Praktijkcase KPN.com
13 januari 2011
Case KPN bestelflow: aanpak! 1 Quick review vooraf ! 2 Analyse & Brown paper sessie! 3 Ontwerp! 4 Usability test! 5 Oplevering ontwerp!
Analyse! • • • •
Gebruikersbehoeften, taken, context! Inhoud, content analyse! Concurrentie analyse ! Requirements: beperkingen en mogelijkheden!
Gesprekken met inhoudelijk betrokkenen ! Bronnenanalyse!
Contact:
[email protected]
10
ODD3: Praktijkcase KPN.com
13 januari 2011
! !Brown paper sessie!
Stakeholders bij elkaar!
Beeld © http://onlinedialogue.com
! !Brown paper sessie!
Stakeholders bij elkaar!
Inzicht in processen over afdelingen heen! Inzicht in complexe materie!
Beeld © http://onlinedialogue.com
Contact:
[email protected]
11
ODD3: Praktijkcase KPN.com
13 januari 2011
Case KPN bestelflow: aanpak! 1 Quick review vooraf ! 2 Analyse & Brown paper sessie! 2 Ontwerp! 3 Usability test! 4 Oplevering ontwerp!
Herontwerpen!
Van globaal naar detail! Korte iteraties! Gebruikers centraal!
Copy © http://www.userneeds.nl
Contact:
[email protected]
12
ODD3: Praktijkcase KPN.com
13 januari 2011
Ontwerp!
Mentale model! Ik wil (meer/beter/anders): !
bellen, internetten , TV kijken! – Winkelen> persoonlijk, geholpen worden! – Kiezen, jij bepaalt! – Onderhandelen, controle, kassabon!
Helping them to buy!
Ontwerp! Gewenste resultaat voor gebruiker
Ik wil duidelijkheid in wat kan,
spelen met mogelijkheden en consequenties zien! Lijkt stupid simple?!
Contact:
[email protected]
13
ODD3: Praktijkcase KPN.com
13 januari 2011
Mijn situatie = ! Niet simpel! Adres allesbepalend voor mogelijkheden en configuratie internet, bellen en TV!
/6 In 5 ies! t a iter
Bestelproces: 4 noodzakelijke stappen! • Beschikbaarheid! • Jouw situatie> ons aanbod/ Best buy offer!
1!
Beschikbaarheid + aansluiting
check Postcode + huisnr +situatie!
2!
Bestelling
samenstellen!
3!
Bestelling afronden!
4!
Controleren & Verzenden!
Bevestiging!
Situatie lijn:! • A Geheel nieuw (geen aansluiting of extra aansluiting);
B. Bestaande configureren (aansluiting overzetten naar nieuwe situatie);
C. Bestaande van andere leverancier overzetten (overstappen)! • Telefonie: A. Nieuw nummer B. Bestaande telnr. meenemen!
• Productvarianten (internet, telefonie,tv)! • Extra opties per variant (Value added services)!
• Noodzakelijke persoonlijke gegevens! • Internet onder water check?! • Evt. Keuzes die gemaakt moeten worden maar geen invloed hebben op prijs (gidsvermelding)? !
• Gegevens evt. wijzigen (terug naar een vorige stap)! • Akkoord met voorwaarden!
• Op de pagina en per mail! • Bedankt & Wat gebeurt er nu! • Next step!
Copy © http://onlinedialogue.com!
Contact:
[email protected]
14
ODD3: Praktijkcase KPN.com
13 januari 2011
Ontwerp!
Helping them to buy, not selling! Andrew Chak!
Make
simplicity key ! and motivate, high ability
BJ Fogg!
Ontwerp iteraties! Start check out! Geen grafisch ontwerp!!
Van eerste opzet 26 mei …en +/- 4 tussenversies … naar demo usability test 26 juni
Copy © http://onlinedialogue.com
Contact:
[email protected]
15
ODD3: Praktijkcase KPN.com
13 januari 2011
Ontwerp iteraties! Bestelling samenstellen! Geen grafisch ontwerp!!
Van eerste opzet 10 mei …en +/- 6 tussenversies … naar demo usability test 26 juni
Copy © http://onlinedialogue.com
Ontwerp iteraties! ʻZitnoggers dialoogʼ! Geen grafisch ontwerp!!
Copy © http://onlinedialogue.com
Van eerste opzet 6 juni …en +/- 6 tussenversies … naar demo usability test 26 juni
Contact:
[email protected]
16
ODD3: Praktijkcase KPN.com
13 januari 2011
Case KPN bestelflow: aanpak! 1 Quick review vooraf ! 2 Analyse & Brown paper sessie! 3 Ontwerp! 4 Usability test! 5 Oplevering ontwerp!
Usability test! Begrijpen waarom een gebruiker iets doet!
1. Kwalitatief onderzoek:
Hardop denkmethode, observatie gedrag + oogbeweging registratie + vragen voor- en achteraf!
2. Gebruikers (6) uit de doelgroep! 3. Realistische taak met klikbaar demo!
Contact:
[email protected]
17
ODD3: Praktijkcase KPN.com
13 januari 2011
Usability test!
Copy © http://onlinedialogue.com
Usability test!
Copy © http://onlinedialogue.com
Contact:
[email protected]
18
ODD3: Praktijkcase KPN.com
13 januari 2011
Case KPN bestelflow: aanpak! 1 Quick review vooraf ! 2 Analyse & Brown paper sessie! 3 Ontwerp! 4 Usability test! Oplevering ontwerp! ontwerp! 54 Oplevering
Oplevering ontwerp!
Copy © http://onlinedialogue.com
Contact:
[email protected]
19
ODD3: Praktijkcase KPN.com
13 januari 2011
Inhoud! De opdracht! Aanpak! Ontwerp! Ontwerp & Resultaat: lessons !
Ontwerp & resultaat: lessons ! 9% conversiestijging is een mooi resultaat maar…
Geldt dit ook voor de langere termijn?
Kan het beter? ! Oplevering en implementatie verschilt ….
Contact:
[email protected]
20
ODD3: Praktijkcase KPN.com
13 januari 2011
Ontwerp & resultaat: lessons ! Geïmplementeerd (6-1-2010)
http://bit.ly/gCbSnl
Afbeelding van pagina zoals deze live stond op kpn.com op 9/1/2011
Ontwerp & resultaat: lessons ! Opgeleverde ontwerp
Copy © http://onlinedialogue.com
Contact:
[email protected]
21
ODD3: Praktijkcase KPN.com
13 januari 2011
Ontwerp & resultaat: lessons ! Geïmplementeerd (6-1-2010, bovenkant Bestelling samenstellen pagina)
Afbeelding van pagina zoals deze live stond op kpn.com op 9/1/2011
Ontwerp & resultaat: lessons ! Geïmplementeerd (6-1-2010 onderkant Bestelling samenstellen pagina)
Afbeelding van pagina zoals deze live stond op kpn.com op 9/1/2011
Contact:
[email protected]
22
ODD3: Praktijkcase KPN.com
13 januari 2011
Ontwerp & resultaat: lessons ! Opgeleverde ontwerp (bovenkant)
Copy © http://onlinedialogue.com
Ontwerp & resultaat: lessons ! Opgeleverde ontwerp (onderkant)
Copy © http://onlinedialogue.com
Contact:
[email protected]
23
ODD3: Praktijkcase KPN.com
13 januari 2011
Ontwerp & resultaat: lessons ! Hoe !
Concept en consistentie van het ontwerp behouden?! Misinterpretaties voorkomen of keuzes voor andere oplossingen in samenspraak oppakken.
Bewaken concept: een ontwerp opgezet om de dialoog met gebruiker mogelijk te maken,
………………………de gebruiker blijft aan tafel!!
Ontwerp & resultaat: lessons ! Hoe! Belang van multidisciplinair houden?!
totaalontwerp binnen scope
Interactieontwerp is niet totaalontwerp, de user interface = interactie. Structuur, grafisch en content is altijd in samenspraak met elkaar.! Hoe professioneel is de uitstraling en is deze voldoende in lijn met de online winkel? Kan usability- en persuasion niet nog veel krachtiger worden ingezet?!
Contact:
[email protected]
24
ODD3: Praktijkcase KPN.com
13 januari 2011
Ontwerp & resultaat: lessons ! Hoe! Helpen gestructureerd te verbeteren en de klant steeds beter leren kennen?! Toekomstgericht en uitbreidbaar naar meer conversie; een gericht optimalisatieproces met hypotheses. De nieuwe 0-meting is het herontwerp, van daaruit optimaliseren en meer conversie behalen!!
Contact:! Anouschka Scholten! www.onlinedialogue.com!
[email protected]! Tel: +3130 4100 176!
Meld je op de site aan voor onze nieuwsbrief!! @onlinedialogue @anous!
Contact:
[email protected]
25
ODD3: Praktijkcase KPN.com
13 januari 2011
Schrijf je nu in! En deel mee in onze kennis!!
Deze case is gepresenteerd op de ! Online Dialogue donderdag.! Je kunt deze 2 maandelijkse kennis sessie in Utrecht zelf bijwonen.! Schrijf je nu in voor de wachtlijst:! http://onlinedialogue.com/donderdag! Volgende sessie:! •
!31 maart 2011, met:! • Social media strategie & aanpak! • Kras.nl conversie praktijkcase! • Conversie clinic & best practises!
Contact:
[email protected]
26