header image of a blog with examples of PWA

4 Examples Of Excellent Progressive Web Apps

4 Examples Of Excellent Progressive Web Apps

4 Examples Of Excellent Progressive Web Apps

4 Examples Of Excellent Progressive Web Apps

Author

Jamie Maria Schouren

Co-founder & CCO

Category
Educational

Publish Date

May 18, 2019

Introduction

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).

Introduction

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).

Introduction

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.

An example of adding a website to the homescreen of a smartphone

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.

An example of adding a website to the homescreen of a smartphone

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!

A longer read and deep dive about PWA can be found here.

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!

A longer read and deep dive about PWA can be found here.

Examples of Progressive Web Apps

Growth of Trivago after switching to 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.


Growth of Lancôme after switching to Progressive Web Apps

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.


Growth of Uber after switching to Progressive Web Apps

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.

Read the full case study here


Growth of Tinder after switching to Progressive Web Apps

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

Read a full case study here

Examples of Progressive Web Apps

Growth of Trivago after switching to 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.


Growth of Lancôme after switching to Progressive Web Apps

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.


Growth of Uber after switching to Progressive Web Apps

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.

Read the full case study here


Growth of Tinder after switching to Progressive Web Apps

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

Read a full case study here

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.

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.

To start using Deity PWA Storefront, please have a look here. If you have any questions, please do not hesitate to contact us at info@deity.io

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.

To start using Deity PWA Storefront, please have a look here. If you have any questions, please do not hesitate to contact us at info@deity.io

Trusted by

  • background-color

    Adam Watt

    Head of Engineering
    Jimmy Brings

    The Composable architecture already paid off, we've already made changes to some of the internal microservices and didn’t have to push the release out to any of the frontend components or change anything in the code base. It really builds confidence and solves the problems we had in the past, which is amazing!

  • background-color

    Rouven Weßling

    Dir. Technology Partnerships
    Contentful

    The integration between Deity and Contentful opens the possibility to connect to any ecommerce service quickly and securely. We are excited about working together to help our customers make the jump from legacy systems to a composable commerce architecture.

  • background-color

    Martijn Phijffer

    Business Development Man.
    PostNL

    In recent months, I've discovered Deity as a highly skilled company that swiftly addressed our complex online challenges. Their composable commerce engine is truly impressive. I strongly recommend them for any

    online needs.

  • background-color

    Ivo Bronsveld

    Head of Integrations

    commercetools

    Deity opens up the world of composable commerce for commercetools merchants by providing a powerful set of building blocks. Deity is a solution to watch, they are one of the next big things in commerce.

  • background-color

    Sergiu Tabaran

    Chief Operating Officer
    Absolute Web

    Deity’s innovative solution allows our merchants to adopt headless much more quickly than managing multiple layers of custom development, a huge leap forward!

  • background-color

    Adam Watt

    Head of Engineering
    Jimmy Brings

    The Composable architecture already paid off, we've already made changes to some of the internal microservices and didn’t have to push the release out to any of the frontend components or change anything in the code base. It really builds confidence and solves the problems we had in the past, which is amazing!

  • background-color

    Rouven Weßling

    Dir. Technology Partnerships
    Contentful

    The integration between Deity and Contentful opens the possibility to connect to any ecommerce service quickly and securely. We are excited about working together to help our customers make the jump from legacy systems to a composable commerce architecture.

  • background-color

    Martijn Phijffer

    Business Development Man.
    PostNL

    In recent months, I've discovered Deity as a highly skilled company that swiftly addressed our complex online challenges. Their composable commerce engine is truly impressive. I strongly recommend them for any

    online needs.

  • background-color

    Ivo Bronsveld

    Head of Integrations

    commercetools

    Deity opens up the world of composable commerce for commercetools merchants by providing a powerful set of building blocks. Deity is a solution to watch, they are one of the next big things in commerce.

  • background-color

    Sergiu Tabaran

    Chief Operating Officer
    Absolute Web

    Deity’s innovative solution allows our merchants to adopt headless much more quickly than managing multiple layers of custom development, a huge leap forward!

  • background-color

    Adam Watt

    Head of Engineering
    Jimmy Brings

    The Composable architecture already paid off, we've already made changes to some of the internal microservices and didn’t have to push the release out to any of the frontend components or change anything in the code base. It really builds confidence and solves the problems we had in the past, which is amazing!

  • background-color

    Rouven Weßling

    Dir. Technology Partnerships
    Contentful

    The integration between Deity and Contentful opens the possibility to connect to any ecommerce service quickly and securely. We are excited about working together to help our customers make the jump from legacy systems to a composable commerce architecture.

  • background-color

    Martijn Phijffer

    Business Development Man.
    PostNL

    In recent months, I've discovered Deity as a highly skilled company that swiftly addressed our complex online challenges. Their composable commerce engine is truly impressive. I strongly recommend them for any

    online needs.

  • background-color

    Ivo Bronsveld

    Head of Integrations

    commercetools

    Deity opens up the world of composable commerce for commercetools merchants by providing a powerful set of building blocks. Deity is a solution to watch, they are one of the next big things in commerce.

  • background-color

    Sergiu Tabaran

    Chief Operating Officer
    Absolute Web

    Deity’s innovative solution allows our merchants to adopt headless much more quickly than managing multiple layers of custom development, a huge leap forward!

Find out how you can supercharge your business.

Find out how you can supercharge your business.

Find out how you can supercharge your business.

Get in touch

We can’t wait to hear about your ambitions.

Let’s find out how we can bring your business to the future, together.

Jamie Maria Schouren

Jamie Maria Schouren Co-Founder

Get in touch

We can’t wait to hear about your ambitions.

Let’s find out how we can bring your business to the future, together.

Jamie Maria Schouren

Jamie Maria Schouren Co-Founder

Get in touch

We can’t wait to hear about your ambitions.

Let’s find out how we can bring your business to the future, together.

Jamie Maria Schouren

Jamie Maria Schouren Co-Founder