Bliblidotcom - Google Mobile Web Hackaton for AMP and PWA

Presenting result from implementation AMP and PWA in Google Mobile Web Hackaton

Transcript

1. Google Mobile Web Hackathon AMP x PWA to Fight againts High Bounce Rate and Low Conversion Rate Cindy, Febi, Ifnu, Irfan. July, 7th 2017
2. Who We Are ? • Cindy R Kalensang, Product Manager • Hidayat Febiansyah, Principal Engineer • Ifnu Bima, Development Manager • Irfan Maulana, Sr. System Development Engineer
3. The Problem High Bounce Rate • Mobile App bounce rate is 85% lower than Mobile Web • Desktop bounce rate is 20% lower than Mobile Web Low Conversion Rate • Mobile App conversion rate is 8.7x Mobile Web • Desktop conversion rate is 5.7x Mobile Web Mobile App uninstall rate • One of the main reason that drives customer to uninstall App is due to customer phone storage limitation “Mobile Web generates the highest traffic yet it has the highest bounce rate and lowest bounce rate”
4. The Problem Page load time is the website first impression for the user With the implementation of AMP and PWA altogether We are aiming to provide seamless browsing experience which will lead to engaged users and results in higher conversion rate and more loyal customers
5. The Problem Page load time is the website first impression for the user With the implementation of AMP and PWA altogether We are aiming to provide seamless browsing experience which will lead to engaged users and results in higher conversion rate and more loyal customers
6. AMP Solution • AMP for fast load in first time • AMP give better search result in mobile • AMP for reduce bounce rate
7. AMP Implementation • Product List Page – Search Page – Category Page – Merchant Page – Brand Page • Product Detail Page
8. AMP Tag • Current : amp-analytics amp-img amp-carousel amp-selector amp-social-share amp-sidebar • Next : amp-state amp-bind amp-install- serviceworker amp-iframe amp-list
9. AMP Implementation and Demo • Will be live in next 2 weeks • Done by 3 person, 1 employee (Dita) and 2 interns (Nikolas and Geraldo) • Planning, development and testing ~ 2 months • AMP initative was finalized after attending google mobile conference here on february
10. Category Page (Before x After AMP) NON-AMP AMP
11. Search Result Page (Before x After AMP) NON-AMP AMP
12. Brand Page (Before x After AMP) NON-AMP AMP
13. Brand Page (Before x After AMP) NON-AMP AMP
14. Merchant Page (Before x After AMP) NON-AMP AMP
15. Product Detail (Before x After AMP) NON-AMP AMP
16. PWA Solution • PWA for better engagement • PWA for alternative apps with no install need • PWA give shortcut in homescreen • PWA for caching static resources • PWA for fast load in repeat view
17. Blibli.com Travel (Before x After PWA) NON-PWA PWA
18. Lighthouse Result (Before PWA)
19. Lighthouse Result (After PWA)
20. THANK YOU