@jeroentjepkema
Founder & CEO
Are we ready for mobile commerce?
NO?
Twinkle100

Tested with webpagetest.org on both Android & iPhone (WiFi (10Mbs down/1,5Mbs up) & 3G (2000Kbps Down, 764Kbps...
50%
Electronics

Mobile
Ready?

80%
top 10
retailers

Twinkle100
31%

65%

of all Twinkle100
have optimized
site

Clothing...
50%
Electronics

Mobile
Ready?

1,2Mb
2.6s
median time
to first paint

80%
top 10
retailers

Twinkle100

4.27s
median speed...
High Expectations...
Fact 1:

Mobile changes consumption of data
#1

Mobile changes consumption of data
Instant access
Always accesible
Responsive
Fact 2:

Welcom to the Mobile Only generation
Mobile Only generation
Mobile"Internet"Users"Who"Never"or"Infrequently"Use"the"Desktop"Internet"
%"Mobile"Browsers"

80%$
...
Don’t drop that ball!
Smartphone or Tablet?
“

Smartphones are the backbone of our daily
media interactions. They have the highest
number of user interactions per day...
34% of all consumers use the device that’s
closest to them when looking for information

Research by Google: http://ssl.gs...
Mobile Web vs. Mobile App
Research by Google: http://ssl.gstatic.com/think/docs/the-new-multi-screen-world-study_research-studies.pdf
How to start your mobile journey?

51%
36%
12%
Launch Mobile App

Ask Google

N = 1449
Research performed by Bol.com, pres...
#mobile(web)first
Designing mobile web into the
customer journey?
Desktop

vs.

Mobile
More

vs.

Less
More
Rich content
Fast connections
Large screen sizes
Couch Commerce

vs.

Less
Small real estate
Touch enabled
Slow/Fast ...
Less Content vs. More Experience?
How we perceive experience....
How we perceive experience....
15%-20% worse than in reality
How we perceive experience....
15%-20% worse than in reality
Task completion has positive impact
How we perceive experience....
15%-20% worse than in reality
Task completion has positive impact
Slow downs have more impa...
How we perceive experience....
15%-20% worse than in reality
Task completion has positive impact
Slow downs have more impa...
Consumers visit 18-23 travel websites
before they finally convert
Source: TNS/Nipo
Performance influence cycle

Search/Orientation phase
1

Perception of experience
http://twinkle100.measureworks.nl
Performance influence cycle

Stimulate content/
conversion
4

Search/Orientation phase

5

1

Perception of experience
http...
Impact of
Mobile?
Impact of
Mobile?

Your
BRAND
every
day
facebook

Flipboard
Foursquare

Impact of
Mobile?

twitter

News
apps

Twitter

Human.co

NBA.com

e-mail

linke...
every
week
Soundcloud
whatsapp

every
day

Facetime

facebook

Flipboard
Foursquare

Impact of
Mobile?

twitter

Youtube

...
every
week
Google
Hangouts
Google
Maps

Soundcloud
whatsapp

every
day

Shazam

Facetime

facebook

Flipboard
Foursquare

...
every
week
Google
Hangouts
Google
Maps

Soundcloud
whatsapp

every
day

shazam

Facetime

facebook

Flipboard
Foursquare

...
Optimize my workflow!
#FastDelivery
WiFi

4G

3G

What happens if I don’t optimize?
Tested with webpagetest.org (WiFi (10Mbs down/1,5Mbs up), 4G (5Mbps Down, ...
Our Need for speed

@jeroentjepkema, MeasureWorks
1
0,3
0

Interaction: Let’s conversate...

Instantaneous: I like it!
Source: Jakob Nielsen
3
1
0,3
0

Mmm, shall I click away?
Interaction: Let’s conversate...

Instantaneous: I like it!
Source: Jakob Nielsen
10
Only if the task/content is relevant

3
1
0,3
0

Mmm, shall I click away?
Interaction: Let’s conversate...

Instantaneo...
Tested on Android with webpagetest.org (3G (2000Kbps Down, 764Kbps Up)
0:00 sec.
Conversation
starts

Tested on Android with webpagetest.org (3G (2000Kbps Down, 764Kbps Up)
0:00 sec.
Conversation
starts

2.5 sec.
First reply

Tested on Android with webpagetest.org (3G (2000Kbps Down, 764Kbps Up...
4.5 sec.
Finish
conversation

0:00 sec.
Conversation
starts

2.5 sec.
First reply

Tested on Android with webpagetest.org ...
Time to interact
4.5 sec.
Finish
conversation

0:00 sec.
Conversation
starts

Comfort zone

Tolerated

Frustrated

2.5 sec...
Speed vs. Engagement per month Bol.com
LD50: 4.85 sec.

90
78,75

56,25

Pageviews (#)

Non-Bounce rate (%)

67,5

45
33,7...
#EasyNavigation
Mobile = Always on?
One thumb device...

49%
36%
22%

http://www.uxmatters.com/mt/archives/2013/02/how-do-users-really-hold-mobiledevices.php?...
The green zone
http://www.uxmatters.com/mt/archives/2013/02/how-do-users-really-hold-mobiledevices.php?goback=.gmp_72842.g...
-

One touch?

+
Login or
not?
Mobile
Search!!
#Contentdriven
Mobile optimized?
Mobile
Optimized
The holy grail in experience is

“flow state”
“”

Flow is an

optimal experience
that is
“intrinsically enjoyable”
Provide relevant content to
support task completion...
...deliver it fast, focus on perception!
http://www.nytimes.com/2012/08/19/opinion/sunday/why-waiting-in-line-is-torture.html?pagewanted=all&_r=0
http://answers.yahoo.com/question/index?qid=1005081200005
That’s not my
website?
Over 60% of people that experienced a slow website ranked
design 2 points lower compared to a fast experience
Slow

Averag...
Mobile Advertisement? Flow vs. Intrusive
Telegraaf: Intrusive

Nu.nl: Flow

N = 15
Q = Flow vs. Intrusive. Can you remember the advertiser/brand?

Dumpert: Intrusi...
Telegraaf: Intrusive

Nu.nl: Flow

Dumpert: Intrusive

Flipboard: Flow

Flow

Intrusive

If you had to choose?

85%

15%

...
How to prioritize content?
Priority 1
Priority 1
Priority 2
Priority 1
Priority 2

Priority 3
Mobile First?

Tested on iPhone with webpagetest.org (3G traffic shaping, 2000Kbps Down, 764Kbps Up, 150ms latency)
90% of all mobile optimized Twinkle100
sites loads menu before content?
Questions so far?
#MobileContext
Mobile
context?
Under time
Content
pressure

Mobile
context?
Under time
Content
pressure
(often) one
Usability
handed

Mobile
context?
Under time
Content
pressure
(often) one
Usability
handed

Mobile
context?

While
Speed
on the move
Under time
Content
pressure
(often) one
Usability
handed

Mobile
context?

While
Speed
on the move
Build for
comfort

= Task Completion + ( Usability + Speed )
Just Remember:

Deliver before it
turns green!
Thanks! More questions?
M: jtjepkema@measureworks.nl
T: @jeroentjepkema
W: www.measureworks.nl
MeasureWorks - Prepare your mobile User Experience for fast conversion
MeasureWorks - Prepare your mobile User Experience for fast conversion
MeasureWorks - Prepare your mobile User Experience for fast conversion
MeasureWorks - Prepare your mobile User Experience for fast conversion
MeasureWorks - Prepare your mobile User Experience for fast conversion
Upcoming SlideShare
Loading in …5
×

MeasureWorks - Prepare your mobile User Experience for fast conversion

1,866 views

Published on

Slides from M-commerce Event 2014. 99% of consumers' time is spend on other websites than yours. And when luck happens and they visit to buy something you better make sure it performs and works. This talk will dive into the delicate balance between speed, usability and content and provides best practices to create a mobile user experience that's ready for fast conversion.

Published in: Technology

MeasureWorks - Prepare your mobile User Experience for fast conversion

  1. 1. @jeroentjepkema Founder & CEO
  2. 2. Are we ready for mobile commerce?
  3. 3. NO?
  4. 4. Twinkle100 Tested with webpagetest.org on both Android & iPhone (WiFi (10Mbs down/1,5Mbs up) & 3G (2000Kbps Down, 764Kbps Up))
  5. 5. 50% Electronics Mobile Ready? 80% top 10 retailers Twinkle100 31% 65% of all Twinkle100 have optimized site Clothing Tested with webpagetest.org (WiFi (10Mbs down/1,5Mbs up) & 3G (2000Kbps Down, 764Kbps Up))
  6. 6. 50% Electronics Mobile Ready? 1,2Mb 2.6s median time to first paint 80% top 10 retailers Twinkle100 4.27s median speed via wifi 31% 65% Clothing median pagesize of all Twinkle100 have optimized site Mobile Performance Tested with webpagetest.org on both Android & iPhone (WiFi (10Mbs down/1,5Mbs up) & 3G (2000Kbps Down, 764Kbps Up)) 8.57s median speed via 3G
  7. 7. High Expectations...
  8. 8. Fact 1: Mobile changes consumption of data
  9. 9. #1 Mobile changes consumption of data Instant access Always accesible Responsive
  10. 10. Fact 2: Welcom to the Mobile Only generation
  11. 11. Mobile Only generation Mobile"Internet"Users"Who"Never"or"Infrequently"Use"the"Desktop"Internet" %"Mobile"Browsers" 80%$ 70%$ 70%$ 59%$ 60%$ 57%$ 55%$ 54%$ 50%$ 40%$ 50%$ 44%$ 32%$ 30%$ 30%$ 25%$ 22%$ 19%$ UK$ Russia$ 20%$ 10%$ 0%$ Egypt$ India$ South$ Africa$ Ghana$ Kenya$ Nigeria$ Indonesia$Thailand$ China$ US$
  12. 12. Don’t drop that ball!
  13. 13. Smartphone or Tablet?
  14. 14. “ Smartphones are the backbone of our daily media interactions. They have the highest number of user interactions per day and serve as the most common starting point for activities across multiple screens ” Research by Google: http://ssl.gstatic.com/think/docs/the-new-multi-screen-world-study_research-studies.pdf
  15. 15. 34% of all consumers use the device that’s closest to them when looking for information Research by Google: http://ssl.gstatic.com/think/docs/the-new-multi-screen-world-study_research-studies.pdf
  16. 16. Mobile Web vs. Mobile App
  17. 17. Research by Google: http://ssl.gstatic.com/think/docs/the-new-multi-screen-world-study_research-studies.pdf
  18. 18. How to start your mobile journey? 51% 36% 12% Launch Mobile App Ask Google N = 1449 Research performed by Bol.com, presented at MIE2014: Bit.ly/MW-MIE13 Visit mobile website
  19. 19. #mobile(web)first
  20. 20. Designing mobile web into the customer journey?
  21. 21. Desktop vs. Mobile
  22. 22. More vs. Less
  23. 23. More Rich content Fast connections Large screen sizes Couch Commerce vs. Less Small real estate Touch enabled Slow/Fast connections On the move
  24. 24. Less Content vs. More Experience?
  25. 25. How we perceive experience....
  26. 26. How we perceive experience.... 15%-20% worse than in reality
  27. 27. How we perceive experience.... 15%-20% worse than in reality Task completion has positive impact
  28. 28. How we perceive experience.... 15%-20% worse than in reality Task completion has positive impact Slow downs have more impact
  29. 29. How we perceive experience.... 15%-20% worse than in reality Task completion has positive impact Slow downs have more impact Always compared to past experiences
  30. 30. Consumers visit 18-23 travel websites before they finally convert Source: TNS/Nipo
  31. 31. Performance influence cycle Search/Orientation phase 1 Perception of experience http://twinkle100.measureworks.nl
  32. 32. Performance influence cycle Stimulate content/ conversion 4 Search/Orientation phase 5 1 Perception of experience http://twinkle100.measureworks.nl Delivered experience 3 2 Your website
  33. 33. Impact of Mobile?
  34. 34. Impact of Mobile? Your BRAND
  35. 35. every day facebook Flipboard Foursquare Impact of Mobile? twitter News apps Twitter Human.co NBA.com e-mail linkedin Fitbit Your BRAND
  36. 36. every week Soundcloud whatsapp every day Facetime facebook Flipboard Foursquare Impact of Mobile? twitter Youtube News apps Twitter Human.co NBA.com e-mail Parkmobile Netflix linkedin Fitbit Dropbox Evernote Your BRAND
  37. 37. every week Google Hangouts Google Maps Soundcloud whatsapp every day Shazam Facetime facebook Flipboard Foursquare twitter Youtube Skype Impact of Mobile? News apps Twitter Pathe Human.co NBA.com Appie e-mail Parkmobile Netflix linkedin Fitbit Dropbox Meetup every month Evernote Google Plus Youtube Your BRAND
  38. 38. every week Google Hangouts Google Maps Soundcloud whatsapp every day shazam Facetime facebook Flipboard Foursquare twitter Youtube Skype Impact of Mobile? Your BRAND Twitter Pathe Human.co NBA.com appie e-mail Parkmobile Netflix linkedin Fitbit Dropbox Meetup every month Evernote Google Plus Youtube ?
  39. 39. Optimize my workflow!
  40. 40. #FastDelivery
  41. 41. WiFi 4G 3G What happens if I don’t optimize? Tested with webpagetest.org (WiFi (10Mbs down/1,5Mbs up), 4G (5Mbps Down, 1Mbps Up) & 3G (2000Kbps Down, 764Kbps Up))
  42. 42. Our Need for speed @jeroentjepkema, MeasureWorks
  43. 43. 1 0,3 0 Interaction: Let’s conversate... Instantaneous: I like it! Source: Jakob Nielsen
  44. 44. 3 1 0,3 0 Mmm, shall I click away? Interaction: Let’s conversate... Instantaneous: I like it! Source: Jakob Nielsen
  45. 45. 10 Only if the task/content is relevant 3 1 0,3 0 Mmm, shall I click away? Interaction: Let’s conversate... Instantaneous: I like it! Source: Jakob Nielsen
  46. 46. Tested on Android with webpagetest.org (3G (2000Kbps Down, 764Kbps Up)
  47. 47. 0:00 sec. Conversation starts Tested on Android with webpagetest.org (3G (2000Kbps Down, 764Kbps Up)
  48. 48. 0:00 sec. Conversation starts 2.5 sec. First reply Tested on Android with webpagetest.org (3G (2000Kbps Down, 764Kbps Up)
  49. 49. 4.5 sec. Finish conversation 0:00 sec. Conversation starts 2.5 sec. First reply Tested on Android with webpagetest.org (3G (2000Kbps Down, 764Kbps Up)
  50. 50. Time to interact 4.5 sec. Finish conversation 0:00 sec. Conversation starts Comfort zone Tolerated Frustrated 2.5 sec. First reply Time to first paint Tested on Android with webpagetest.org (3G (2000Kbps Down, 764Kbps Up)
  51. 51. Speed vs. Engagement per month Bol.com LD50: 4.85 sec. 90 78,75 56,25 Pageviews (#) Non-Bounce rate (%) 67,5 45 33,75 22,5 11,25 0 0-0,5 0,5-1 1-1,5 Non-Bounce Mobile 1,5-2 2-2,5 2,5-3 3-3,5 3,5-4 4-5 5-6 6-7 7-8 8-9 9-10 >10 Categorienaam # Pageviews Non-Bounce Desktop Baseline: 2,7 sec. Data presented by MeasureWorks at Velocity Conference London 2013: http://bit.ly/MW-VEUrum
  52. 52. #EasyNavigation
  53. 53. Mobile = Always on?
  54. 54. One thumb device... 49% 36% 22% http://www.uxmatters.com/mt/archives/2013/02/how-do-users-really-hold-mobiledevices.php?goback=.gmp_72842.gde_72842_member_215909354
  55. 55. The green zone http://www.uxmatters.com/mt/archives/2013/02/how-do-users-really-hold-mobiledevices.php?goback=.gmp_72842.gde_72842_member_215909354
  56. 56. - One touch? +
  57. 57. Login or not?
  58. 58. Mobile Search!!
  59. 59. #Contentdriven
  60. 60. Mobile optimized?
  61. 61. Mobile Optimized
  62. 62. The holy grail in experience is “flow state”
  63. 63. “” Flow is an optimal experience that is “intrinsically enjoyable”
  64. 64. Provide relevant content to support task completion...
  65. 65. ...deliver it fast, focus on perception!
  66. 66. http://www.nytimes.com/2012/08/19/opinion/sunday/why-waiting-in-line-is-torture.html?pagewanted=all&_r=0
  67. 67. http://answers.yahoo.com/question/index?qid=1005081200005
  68. 68. That’s not my website?
  69. 69. Over 60% of people that experienced a slow website ranked design 2 points lower compared to a fast experience Slow Average Fast % of respondents that rated the actual website speed 100 75 50 25 0 1 2 3 Design score (1=bad - 5=beautiful) 4 5
  70. 70. Mobile Advertisement? Flow vs. Intrusive
  71. 71. Telegraaf: Intrusive Nu.nl: Flow N = 15 Q = Flow vs. Intrusive. Can you remember the advertiser/brand? Dumpert: Intrusive Flipboard: Flow
  72. 72. Telegraaf: Intrusive Nu.nl: Flow Dumpert: Intrusive Flipboard: Flow Flow Intrusive If you had to choose? 85% 15% Do you remember brand? 40% 10% N = 15 Q = Flow vs. Intrusive. Can you remember the advertiser/brand?
  73. 73. How to prioritize content?
  74. 74. Priority 1
  75. 75. Priority 1 Priority 2
  76. 76. Priority 1 Priority 2 Priority 3
  77. 77. Mobile First? Tested on iPhone with webpagetest.org (3G traffic shaping, 2000Kbps Down, 764Kbps Up, 150ms latency)
  78. 78. 90% of all mobile optimized Twinkle100 sites loads menu before content?
  79. 79. Questions so far?
  80. 80. #MobileContext
  81. 81. Mobile context?
  82. 82. Under time Content pressure Mobile context?
  83. 83. Under time Content pressure (often) one Usability handed Mobile context?
  84. 84. Under time Content pressure (often) one Usability handed Mobile context? While Speed on the move
  85. 85. Under time Content pressure (often) one Usability handed Mobile context? While Speed on the move
  86. 86. Build for comfort = Task Completion + ( Usability + Speed )
  87. 87. Just Remember: Deliver before it turns green!
  88. 88. Thanks! More questions? M: jtjepkema@measureworks.nl T: @jeroentjepkema W: www.measureworks.nl

×