In smartphone-dominated markets, creating a superior user experience is no longer a nice-to-have feature. Businesses of all kinds are racing to adopt the latest mobile-friendly technologies, including Progressive Web Apps. The early-adopters that made the shift to PWAs before the laggers have gained a massive business advantage.
Sign up for updates on The PWA Book ⭐️
Table of content
Among the companies that dared to reach for what was in those days a fresh approach to building websites, was Lancôme. Their Digital Marketing Department was aware of the need to upgrade their approach to mobile when smartphone traffic surpassed desktop traffic in early 2016 and showed no signs of slowing down. Their first idea of how to embrace the new reality was, naturally, a mobile app, but Malik Abu-Ghazaleh, Global Head of Digital at Lancôme, was skeptical. He thought that despite the benefits of mobile apps, which deliver an excellent user experience and personalized content, they have severe disadvantages: they are expensive to build, and shoppers need a strong hook to download them.
Progressive Web Apps promised all of the pros of mobile apps, without their cons, but it was a very fresh concept, and so the implementation seemed risky.
Abu-Ghazaleh decided to take his chances. In the summer of 2016, Lancôme launched their new PWA-based site and it quickly became apparent that it was a hit. It turned out to be more effective than a regular mobile website and cheaper than a mobile app.
The new site is about 50% faster than the previous one, and Lancôme's mobile sales have increased by 16% year over year.
💡 On average across all of its mobile pages in February, the site loaded in 3.5 seconds, which is much faster than the 8-9 second average in February 2016. Plus, a faster site gives Lancome-usa.com a huge SEO boost from Google, said Abu-Ghazaleh. Of the 26 brands L'Oréal Paris owns, Lancôme has the fastest site.
Lancôme wasn't the only one who decided to speed up its mobile site with Progressive Web Apps. Housing.com, one of India's top startups operating in the online real estate space, was able to increase conversions by about 38%, speed up page load by 30%, decrease bounce rate by 40% and extend the average session by 10%, thanks to PWA technology.
For this Indian company, seamless performance on mobile was crucial since Indian users are more likely to own a mobile phone and use it to access the internet than own a laptop and use a wired internet connection. Housing.com, aware of that, developed a native app, but it wasn't an optimal solution. The cost of internet access in India remains relatively high, and consumers are cautious about using mobile data to download native apps, even though they demand an ultra-fast UX. Housing.com did its research and discovered that even a one-second improvement of page load time brought a significant boost in the conversion rate.
With a PWA, the page-load performance of the Housing.com site increased by over 30%, and the average time-per-session increased 10% across all browsers.
Understanding the network limitations of our users and the importance of a great user experience led us to build a PWA, said Vivek Jain, Housing.com CPTO. User experience is something that defines state-of-the-art applications.
In the case of Housing.com, PWA technology turned out to be the best possible way to dispel consumers' doubts about data and get them to use the app on their low-end devices.
Check out available PWA development services 🔍
The business success of social media platforms depends on user engagement. They also need to provide users with fast loading features while consuming less data, so PWA technology, with its mobile-friendly nature, seems to be the best answer to challenges implied by a growing mobile audience. Twitter, Pinterest, and Instagram already agreed to that.
Thanks to their PWA, which became the default mobile web experience for all users globally in April 2017, Twitter was able to re-engage mobile users more effectively, provide them with a smooth but creamy UX, while consuming less data. After implementing the "Add to Homescreen" prompt asking users to save Twitter Lite to their homescreens, Twitter has seen 250,000 unique daily users launch Twitter Lite from the homescreen – four times a day on average.
Twitter Lite is now the fastest, least expensive, and most reliable way to use Twitter. The web app rivals the performance of our native apps but requires less than 3% of the device storage space compared to Twitter for Android, noted Nicolas Gallagher, the Engineering Lead for Twitter Lite.
PWA-based Twitter consumes less data by default, relying on cached data and optimized images as much as possible. It allows reducing data consumption by as much as 70% as users scroll through their timelines. The PWA is only 600KB over the wire vs. 23.5MB of downloaded data needed to install the native Android app.
Similar reasons are behind the PWA implementation by Pinterest. This platform was struggling with engaging mobile users who suffered from a poor UX. Because of the slow web experience for people in low-bandwidth environments and limited data plans, Pinterest managed to convert only a fraction of them into signups, logins, or native app installs.
It was a huge drawback but also an opportunity, so the decision was a no-brainer. The shift to a PWA that supports an app shell, add to homescreen, push notifications and asset caching, took only 3 months and led to several technological improvements. Time spent on the site is up by 40% compared to the old mobile web experience, user-generated ad revenue is up 44%, and core engagements are up 60%.
The core business metrics also proved that investing in a full-featured PWA has met expectations.
Weekly active users on the mobile web have increased 103% year-over-year overall, with a 156% increase in Brazil and a 312% increase in India. On the engagement side, session length increased by 296%, the number of Pins seen increased by 401% and people were 295% more likely to save a Pin to a board. Those are amazing in and of themselves, but the growth front is where things really shone. Logins increased by 370% , and new signups increased by 843% year-over-year. Since we shipped the new experience, mobile web has become the top platform for new signups. And for fun, in less than 6 months since fully shipping, we already have 800 thousand weekly users using our PWA like a native app (from their home screen) - wrote the Pinterest Engineering Team.
PWA technology was also successfully implemented by Tinder. This location-based social search mobile app, used as a dating app, relies on mobile users and so providing them with a high-quality experience is the foundation of its business model.
Their Progressive Web App, called Tinder Online, was launched in 2017 to get adoption in new markets. Even early signs showed good swiping, messaging, and session length compared to the native app.
With the PWA:
Tinder's PWA is available to 100% of users on desktop and mobile. It takes advantage of the techniques for JavaScript performance optimization, Service Workers for network resilience and Push Notifications for chat engagement. The company noticed improved swiping, messaging, and session length compared to the native app.
Improving the mobile user experience is crucial to social media companies, but it is not the highest goal for eCommerce. This sector is focused above all on sales, but - with the vast mobile conversion gap - these two issues can't be treated separately. Why? The leading cause of why mobile devices generate the majority of internet traffic but the minority of eCommerce conversions is a poor mobile user experience. The desktop-oriented content displayed on mobile devices causes frustration, so customers abandon their mobile shopping journey. In the best possible scenario, they switch to a different device and channel, but when a company has most of its traffic generated by mobile, there may be some missed opportunities to finalize sales.
DW Shop, a sub-brand of DW Creative Group, created by Polish hair stylist Dariusz Wójcik, faced precisely this challenge. Most of its consumers came from Instagram, which is one of the best advertising channels for health and beauty companies. Given that, in general, mobile devices - including both smartphones and tablets - account for 80% of the time spent by users worldwide on social media (source: TechJury, via Smart Insights), it is no wonder that DW Shop had nearly 90% of its traffic generated by the mobile channel.
It also means that DW Shop needed to adjust to the preferences and behaviors of smartphone users. The goal was to drive social media traffic to convert and PWA technology was a way to achieve it.
In a short time, the DW Shop achieved 75% of its traffic from Instagram, and thanks to PWA technology, it has seamlessly turned these users into clients directly on mobile devices, we learn from a case study published by Divante.
The company picked Magento 2 as a backend eCommerce platform for the store, but to enrich the mobile user experience with a PWA, they turned to Vue Storefront, the framework that works with any backend eCommerce engine available on the market.
While DW Shop was trying to convert Instagram followers into customers, Staples, the second-largest eRetailer in the world (right behind Amazon.com), faced an entirely different challenge.
Over the years, this company grew both organically and by the acquisition of other eCommerce entities, throughout which they continued to provide online services. At some point Staples had to unify the user experience across all touchpoints to provide a consistent brand identity.
It wasn't an easy task since Staples' online services were based on multiple, highly customized systems written in .NET and JAVA. Changing all of them would be time-consuming and demanding, so the eCommerce team decided to build a unified UI for two backends available in the Staples technology stack.
The company considered the development of a native mobile app, a new frontend, and various headless solutions, but eventually it became clear that a Progressive Web App was the best option.
The idea was to implement the new PWA frontend and integrate it via API with Genesis and Netshope based backends. The final product delivered features like barcode scanning, and offline ordering enables Staples to improve the overall user experience of mobile users while at the same time making it more consistent.
Building a better UX on mobile was also Alibaba Group's goal. This Chinese behemoth runs Alibaba.com, the world's largest online business-to-business trading platform, and AliExpress.com, a marketplace offering products to international online buyers.
These brands were faced with challenges with mobile user engagement, and decided to reach for a PWA to improve that part of their business. After upgrading the Alibaba and Aliexpress sites to a PWA, the company saw a considerable increase in total conversions across browsers, and the costs of the implementation were visibly limited compared to native apps.
For more examples of PWA implementations, visit PWA Stats or our blog’s PWA section.
Check out available PWA development services 🔍
Go back to The PWA Book main page >