Hoe kunt u (big) data inzetten voor het optimaliseren van de conversie in uw mobiele webshop? Ontdek waar u rekening mee dient te houden voor al uw mobiele gebruikers. Over dit onderwerp gaf ISM'er Danny Loeffen een presentatie. Na afloop konden de bezoekers aan de slag met data verzamelen en met concrete actiepunten. Tevens kregen ze meer inzicht waar zich de knelpunten bevinden voor de mobiele gebruikers.

1. Danny Loefffen
Usability, CRO & Webanalytics consultant
Mobile Usability
Verhoog je conversie met deze tips

2. “Design is not how it looks
like and feels like.
Design is how it works”
- Steve Jobs, 2003

3. Full colour
afbeelding
plaatsen
Danny Loeffen
Usability, CRO & Webanalytics consultant
8 jaar ervaring met:
• Usability & UX
• Webanalytics & Tag Management
• Conversie-optimalisatie
• Front-end Development

4. Onze diensten

5. STRATEGIE
Audit op CRO proces
Business case CRO
CRO team bouwen
CRO maturity begeleiding
CRO toolselectie
Customer journey mapping
CONSULTANCY
CRO consultancy
(FE) Development
UX design
Wireframing
Webanalytics
Data-analyse
Content
Usability onderzoek
OPLEIDING
CRO masterclass
Incompany training
Persuasion trainingen
UX workshops
Webanalytics trainingen
A/B test trainingen
DETACHERING
CRO consultant
Webanalist
Designer
(FE) Developer
Usability consultant
Psycholoog
UX researcher
Data scientist
Conversie-optimalisatie (CRO) services

6. Usability Lab

7. Wij zijn trots te werken voor:

8. De Vragenvogel

9. Vandaag..
1. Introductie
2. Effect van Usability op
A. Fysiek gebruik
B. Perceptie
C. Functies
3. Key Takeaways

10. 1. Introductie
1/3

11. Usability is de kunst waarin software gemaakt wordt
zodat gebruikers de software effectief, efficiënt en naar
tevredenheid kunnen gebruiken
Simpelweg: Het moet intuïtief zijn voor jouw gebruiker!
1. Introductie | Wat is Usability?

12. 1. Introductie | User Experience ≠ Usability
Look
Usability
Feel

13. Inzichten
Prioriteren
Test backlog
HoogLaag
Hypothese opstellen
Testplan maken
Testvarianten maken
A/B test live
Analyseren
Learnings delen
Test
herhalen
Informeren
team
Rapportage
o # bezoekers en conversie
per variant
o Segment analyse
o Significantieniveau
o Impactop KPI
Verandering doorvoeren?Nee JaVerwerpen en naar
volgende test
Maak ticket voor
Development
Hoog
LIVE
Change backlog
o Webanalytics data
o Externe expert analyses
o Sessie recording analyses
o Onsite klantfeedback
o Usability onderzoek
o Gedragsonderzoek
o Analyse klantenservice
vragen
o Interviews met klanten
o Etc.
Bronnen voor
conversieverbeteringen
ONDERDEEL A ONDERDEEL B ONDERDEEL C
1. Introductie | CRO-proces ISM

14. 1. Introductie | Waar staat Usability in de Conversie-pyramide?
Technologie
Functionaliteit
Usability
Intuïtie
Emotie
Unieke waarde propositie
Bron: Meer omzet uit je webshop, Jurjen Jongejan
Hier staat Usability
Om deze redenen kopen bezoekers
Denk aan snelheid, “werken alle
functionaliteiten?”/BUGS
Denk aan kwaliteit zoekresultaten,
“Wishlist”-functie
Verleidingstechnieken zoals
“17 anderen kochten dit vandaag ook”
Efficiënt, effectief en naar
tevredenheid

15. 1. Introductie | Verandering maatschappij

16. Smartphone is de snelst groeiende techniek ooit
1. Introductie | Evolutionair tijdperk

17. 1. Introductie | Dagelijkse tijd op smartphone
Bron: comScore

18. 1. Introductie | Dagelijks gebruik van smartphone
Bron: Apple
80 unlocks
14 uur standby
2.600 touches

19. 1. Introductie | Aandeel verkeer per device Q1 2015 t/m Q4 2017
Bron: ISM.nl

20. 1. Introductie | Conversiepercentage per device Q1 2015 t/m Q4 2017
Bron: ISM.nl

21. We maken met z’n alle
slechte mobiele shops!

22. 2. Effect van Usability op
A. Fysiek gebruik
2/3

23. 2. Effect Usability op Fysiek gebruik | Het vasthouden
Bron: Steve Hoober
49%
‘one-handed’
15%
‘two-handed’
36%
‘cradled’

24. 75%

25. 2. Effect Usability op Fysiek gebruik | “Thumb Reach”
Bron: lukew.com

26. 2. Effect Usability op Fysiek gebruik | “Thumb Zone”
Bron: Smashing Magazine

28. Weg!
08-2017 10-2017 03-2018
Beter?

29. Houd rekening met het
fysieke gebruik!
1/8

30. 2. Effect Usability op Fysiek gebruik | “Top menu to Bottom menu”
Facebook did it!
+ engagement
+ tevredenheid
+ ‘snelheid’
+ omzet

31. 2. Effect Usability op Fysiek gebruik | “Top menu to Bottom menu”
+30%
gebruik
Spotify did it!

32. 2. Effect Usability op Fysiek gebruik | Bottom Bar Menu
Bottom menu

33. Bottom menu
Top menu

34. De Vragenvogel

35. 2. Effect van Usability op
B. Perceptie
2/3
35

36. • “Don’t make me think!”
• Eén tap door met
bestellen
+3,5% conversie
2. Effect van Usability op Perceptie | A/B Test
Origineel Variant

37. 27% verlaat de checkout als deze complex is of lijkt
2. Effect van Usability op Perceptie | Cognitive Load
Bron: Baymard Institute

38. 2. Effect van Usability op Perceptie | Cognitive Load
“Pfoe, dit ziet er complex uit…” “Makkie!”
VS

39. Zorg ervoor dat taken zo
eenvoudig mogelijk zijn
of lijken
2/8

40. 2. Effect van Usability op Perceptie | (Gevoel van) Snelheid
Zonder feedback Met feedback
~38 seconden TWT5 – 8 seconden TWT*
*TWT staat voor “Tolerable Wait Time”

41. Voorkom langzame websites
Hoger vertrouwen in de website
Hogere verwachting van de kwaliteit
Minder frustratie
Interessanter
Aantrekkelijker
2. Effect van Usability op Perceptie | (Gevoel van) Snelheid
Bron

42. 2. Effect van Usability op Perceptie | Micro-interacties
1.
“Hier wil ik
naartoe”
*TAP*
3.
“Hallo, doe
het eens!”
*TAP*TAP*
2.
“Doet ‘ie het
niet?” *TAP*
4.
“Oh, hij is
aan het
laden..!”
*PFF*

43. 1 van de Usability
Heuristic Principles
van Jakob Nielsen
Show System Status
2. Effect van Usability op Perceptie | Micro-interacties

44. Maak middels ‘micro-
interactions’ duidelijk
wat de status is
3/8

45. De Vragenvogel

46. 2. Effect van Usability op
C. Functies
2/3
46

47. 2. Effect van Usability op Functies | Mobile inputs
TelefoonnummerNaam E-mailadresURL

48. • Gebruiker wisselt niet zelf
van toetsenbord
• Als we het format van een
invoerveld weten, waarom
helpen we onze gebruikers
daar dan niet mee?
• 8 taps minder!
2. Effect van Usability op Functies | Mobile inputs

49. 2. Effect van Usability op Functies | Mobile inputs
• Gebruiker wisselt niet zelf
van toetsenbord
• Nederlands postcode format
is altijd hetzelfde
• 5 taps minder!

50. Gebruik de juiste
(dynamische)
toetsenborden
4/8

51. @darylginn
Twitter
2. Effect van Usability op Functies | “Responsive”
A B

52. 2. Effect van Usability op Functies | “Responsive”
Geen goed
voorbeeld

53. 2. Effect van Usability op Functies | “Responsive”
Wél goed
voorbeeld

54. Begin met de mobiele
weergave en vergeet de
muis
5/8

55. 2. Effect van Usability op Functies | Mobile Labels
• Geen idee waarom dit fout is
• Het is toch mijn adres?Naam
E-mailadres
Straat Huisnr
Postcode
Plaats
Ga verder naar de volgende stap >
Waar mag de bestelling naartoe?
Danny Loeffen
d.loeffen@ism.nl
Van Nelleweg 1
Rotterdam
3044BC
Rotterdam
3044BC

56. 2. Effect van Usability op Functies | Mobile Labels
Naam
E-mailadres
Straat Huisnr
Postcode
Plaats
Ga verder naar de volgende stap >
Waar mag de bestelling naartoe?

57. 2. Effect van Usability op Functies | Mobile Labels

58. 2. Effect van Usability op Functies | Mobile Labels
10 seconden
later…

59. 2. Effect van Usability op Functies | Mobile Labels
Nog een keer

60. 2. Effect van Usability op Functies | Mobile Labels
“Floating labels”

61. Verberg nooit de input
labels
7/8

62. 2. Effect van Usability op Functies | Horizontal Scrolling
A BSubjective Contours

63. Toon een ‘stukje’ van het
volgende element om
horizontaal scrollen
intuïtiever te maken
8/8

64. 3. Key Takeaways
3/3

65. 1. Begin met je mobiele weergave en vergeet de muis
2. Houd rekening met het fysieke gebruik (75% duim, 49% one-handed)
3. Zorg voor (het gevoel van) een snelle website
4. Maak middels micro-interacties duidelijk wat de status is
5. Zorg ervoor dat taken zo eenvoudig mogelijk zijn of lijken
6. Gebruik de juiste (dynamische) toetsenborden
7. Verberg nooit de input labels
8. Toon een ‘stukje’ van het volgende element om horizontaal scrollen intuïtiever te maken
3. Key Takeaways

66. Mobile First
- Danny Loeffen
User First

67. Evenementen – meld u aan www.ism.nl/evenementen:
Masterclass online marketingstrategie
Donderdag 17 mei, 10:30 – 15:15
SEO, SEA, Social & Display, E-mail | ISM eCompany
[Webinar] Hoe zet u linkbuilding succesvol in als online retailer?
Donderdag 24 mei, 14:30 – 15:30
Mark Trieling, SEO Consultant | ISM eCompany
E-commerce Live!
Woensdag 30 mei
Jurjen Jongejan en Sander Berlinski | ISM eCompany
Digital Marketing Live!
Donderdag 31 mei
Siebren van Bruggen en Danny Loeffen | ISM eCompany
What’s Going on in Retailing
Donderdag 31 mei
Jurjen Jongejan | ISM eCompany
Masterclass SEO
Donderdag 21 juni
Team SEO | ISM eCompany

68. Bedankt!
Vragen?

69. Van Nelleweg 1, 3044 BC Rotterdam +31 (0)10 243 60 000 info@ism.nl www.ism.nl