Category
Publish Date
May 18, 2019
Get ready for a healthy dose of daily inspiration and explore 8 amazing Progressive Web Apps — 4 apps that prove PWAs are ready for mainstream consumer adoption!
Creating the best web experience, especially for mobile users, is not only very important, it’s critical if your website or webshop wants to survive in the coming years. This is also the reason why you should consider investing in Progressive Web Apps (PWA).
What Is a Progressive Web App?
Progressive Web Apps are websites, which look, feel, and have the same capabilities as native apps. They can offer the full native app experience, such as offline modes, push notifications, accessible from the home screen, etc. This without the annoying process of going through an app store, installations, etc.
PWA delivers the full native app experience and features, straight from the browser.
Why Should You Care About Progressive Web Apps?
Progressive Web Apps have proven to successfully help businesses increase their conversions, session lengths, page visits, user engagement, and bottom-line results.
They are the best option for businesses who are looking for high engagement with mobile users and serve the best user experience. But without the high investments needed for native mobile apps.
Other benefits include:
- High Performance
- Super Fast Loading Times
- Engaging User Experiences
- Push Notifications on Mobile Devices
- Offline Modes
- Installable on Home Screen (while skipping the app store)
- Less Data Use
- And Many More!
Examples of Progressive Web Apps
1. Trivago
As one of the world’s leading hotel search engines, Trivago has a long history of innovation. Founded in Germany in 2005, the brand has since grown to more than 1000 employees.
When Trivago first became aware of Progressive Web Apps, they were initially dissuaded from pursuing the technology because of a perceived inability to run effective A/B tests on users with interrupted mobile connections. However, with the development of the Background Sync API, this issue was resolved and a small team of developers, together with a designer, began working on implementing the first pieces of PWA functionality.
Instead of building out the full feature set in one release, Trivago focused first on offline access, push notifications, and add to home screen, believing that these would be the features most valuable to their users.
Trivago’s PWA-evolved website is now available in 33 languages and 55 countries. The uptake of the new functionality has been impressive. More than half a million people added the Trivago site to their home screen. Engagement, for users who add to home screen, has increased by 150%. From an average of just 0.8 repeat visits for users of the old mobile site to two visits for users of the PWA. Prior to the new, evolved site, Trivago’s only means of re-engaging users was via email. However, with push notification subscriptions now eclipsing email subscriptions, the brand now has a valuable new means of outreach. All of this enhanced engagement has, in turn, led to improvements in conversion, with a 97% increase in click outs to hotel offers for users of the PWA.
Read the full case study here.
2. Lancôme
To drive both traffic and re-engagement, luxury cosmetics brand Lancôme launched a Progressive Web App (PWA) to deliver a fast, app-like experience on the mobile web.
Lancôme saw mobile traffic eclipse desktop traffic for the first time in 2016. Despite a growing number of mobile site visitors, mobile conversion rates didn’t match those for desktop. While 38% of shopping carts led to orders on desktop, the mobile web conversion rate was only 15%.
This disparity revealed that consumers were experiencing significant obstacles when trying to purchase on mobile. As the mobile web became a core focus area, Lancôme struggled to build a fast and engaging experience for their mobile web shoppers.
Instead of minimally updating their underlying site, Lancôme looked into PWA technologies to provide an immersive, app-like experience. They took advantage of service workers to deliver reliable performance on unstable networks and push notifications for re-engagement.
With the new PWA, the time until the page is interactive fell by 84%, compared to their previous mobile experience, with a corresponding 15% decrease in bounce rates. Lancôme saw their mobile sessions rise by more than 50%, and conversions increase by 17%. The new strategy also delivered a much better user experience across platforms. iOS is extremely important for Lancôme — 65% of all users landing on their PWA are using iPhones. With their new PWA, Lancôme saw a 53% increase in session length and a 10% bounce rate decrease among iPhone users.
Lancôme also took advantage of re-engagement technologies, such as push notifications, which became very popular with users. Notifications look the same as those from native apps and arrive even if the browser is no longer running.
Lancôme sends four or five alerts a month for exclusive promotions and product releases. 8% of consumers who tap on a push notification make a purchase. This is much higher than the desktop website conversion rate. Lancôme also has great success in using push notifications to reconnect with shoppers who’ve abandoned their carts. The new strategy has delivered an 18% open rate on mobile and conversion rates on abandoned carts have increased by 8%.
Read the full case study here.
3. Uber
As Uber expands to new markets, they struggled with enabling all users to quickly request a ride, regardless of location, network speed, and device. For Uber, Progressive Web Apps were the solution for their problem. They decided to rebuild the web client from the ground up as a viable alternative to the native mobile app.
Compatible with all modern browsers, m.uber offers an app-like experience for riders on low-end devices, including those not supported by the native client. The web app is super tiny. The core ride request app comes in at just 50kB, enabling the app to load quickly even on 2G networks. In numbers, this means a three-second time to interaction on typical 2G (250kB/s, 300ms latency) networks.
And that made Progressive Web Apps the key to expanding in new markets for Uber.
4.Tinder
Tinder recently swiped right on the web. Their new responsive Progressive Web App, Tinder Online, is available to 100% of users on desktop and mobile. Using full PWA techniques, they achieved great performance optimization, network resilience, and Push Notifications for chat engagement.
The MVP for the PWA took 3 months to implement using React as their UI library and Redux for state management. The result of their efforts is a PWA that delivers the core Tinder experience in 10% of the data-investment costs for someone in a data-costly or data-scarce market.
Early signs show good swiping, messaging, and session length compared to the native app. With the PWA:
Users swipe more on the web than in their native apps
More messages were sent on the web than in their native apps
Users purchase at par with native apps
More profiles were edited on the web than in their native apps
Session times are longer on web than in their native apps
How To Start Building a Progressive Web App?
Building a Progressive Web App does not have to be difficult. With the use of a toolkit like Deity PWA Storefront, it is super easy to get started!
First, it is important to identify who your users are, what kind of experience you want to provide them, and what kind of PWA features you want to use. You CAN do offline mode, Push Notifications, access to camera on phone, add to home screen, etc. But, you don’t have to use everything at the same time from the beginning.
Usually, the first main benefit of Progressive Web Apps is the super high-performance improvement and the smooth user experience. Starting from there, you can then add all the cool functionalities you want and need while already offering a super high engaging experience to your mobile users.
Deity PWA Storefront — Headless Progressive Web App Storefronts
Would you like to give it a try? We have been building PWA for a few years now and decided to build a product of it.
Deity PWA Storefront is a toolkit to build Progressive Web Apps. It is built with ReactJS and NodeJS and includes GraphQL, Apollo State Management, and other cool new innovative techniques. This Front-End Platform is fully platform-agnostic. This means you can use it with WordPress, Magento, Shopify, Intershop, Contentful, or even your own CMS or database.
Click here to start using Deity PWA Storefront. If you have any questions, please do not hesitate to contact us at info@deity.io
Trusted by
