As technology evolves, new devices emerge but for most importantly, user preferences changes. When smart-phones were first released, no one would have ever thought that it would replace desktops and laptops. Fast forward to today and you can easily see the impact smartphones have made on our lives.
The massive popularity of smartphone forced web and app developers to create websites for mobile users, leading to the creation of responsive websites. Then there are native apps that can take advantage of device hardware and other resources to deliver a smoother user experience. Progressive web app combines the best of both worlds into a single package.
If you want to create a progressive web app for your business but did not know where to start then, you are at the right place. In this article, you will learn about the best progressive examples and what you can learn from them to create your own winning progressive web app. It is better to learn from others mistakes than make the same mistakes yourself and learn from it.
Twitter Lite
Twitter is one of the leading social networks and microblogging platform in the world. With almost 80% of users accessing Twitter on their mobile devices, Twitter’s decision of launching a lighter version of their app called Twitter Lite seems sensible. They succeeded in reducing the load times, bounce rate and managed to deliver the more engaging user experience.
From a user standpoint, Twitter Lite takes up only 3% storage when compared with its native counterpart. If that is not enough to impress you, then here is another stat that will force you to appreciate Twitter Lite progressive app. Google Developer case study revealed that more than 25,000 Twitter user engages with the app directly from their home screens four times a day. It is generating more than ten million push notifications. These are staggering numbers and
Yes, most people might use Instagram through its mobile app due to lack of features and functionality on its web version but if you visit Instagram on your mobile browser, you will see a progressive web app appear on your screen. Now, you can get the same functionality of the Instagram mobile app on your mobile browser thanks to the progressive web app. There are some handy extras that loyal Instagram fans will surely love. Yes, there are some notable omissions too such as tagging users on your Instagram stories but if you can get over this, you will have a similar experience on Instagram progressive web app as you would have on a mobile app.
Pinterest Social Curation
While we are covering social networks, let’s look at another social networking website that takes advantage of the progressive web app. I am referring to Pinterest social curation progressive web app here. Pinterest realized that it’s dismally low conversion rate of 1% won’t cut it so they decided to do something about it. The older version took somewhere around 15-20 seconds to load the main thread before users can use it. This was a major problem as users are not ready to wait long for a page to load.
Pinterest focused their attention on enhancing the user experience by minimizing the load times and boosting responsiveness. After converting the Pinterest website to PWA, they saw improvements in every metric from load times to click through rate. Pinterest is currently working on improving the user experience for new users who have not signed up yet to make sure that they become a Pinterest user.
Starbucks Coffee
Starbucks Coffee progressive web app was mainly targeted towards mobile customers and emerging markets when it was launched in 2017. What makes Starbucks coffee progressive web app stand out is its ability to allow customers to customize their orders and add them to their cart even when there is limited or no connectivity. Browsing through the menus is a breeze too. Smoother animations and performance, local price listings and offline functionality are some of the hallmarks of Starbucks progressive web app. It’s minute size combined with caching make all the functionality available offline. Desktop users can also benefit from it, place orders from the website and pay the same price as their mobile counterparts.
Trivago Hotel Booking
If you travel a lot and stay in hotels then you might be familiar with Trivago. For those who are not, Trivago is a hotel booking app that compiles results from different hotel websites and shows it on a single screen, helping you secure the best deals on hotel bookings. In their quest to engage more travelers to book the hotel through their platform, they launched their progressive web app in 55 countries and 30 languages.
With a loading time of fewer than three seconds, an offline mode and push notification feature, it managed to grab the attention of many travelers. Travelers can also read hotel reviews, analyze guest ratings and can even see the distance from the tourist attractions in the city. Trivago data suggests that users revisit Trivago150% more than they previously did and the clickthrough rates on hotel offers have increased by 100% after the launch of the progressive web app. This has made Trivago a leading hotel search engine in the world and a formidable force in the hotel booking industry.
Forbes
Forbes realized that their start renders times are dismally slow on mobile reaching to a pathetic 6.5 seconds. To fix this problem, they implemented a progressive web app and become one of the first media outlets to embrace this technology. Salah Zalatimo, Head of product and tech at Forbes praised the decision of switching to a progressive web app and admitted that it has helped them achieve tremendous results.
To put numbers into perspective,
- Forbes readership grew by 12%
- Ad impressions per page rose by 20%
- 6X increase in the number of readers completing the article
Washington Post
One progressive web app that deserves a place on this list is the Washington Post Progressive Web App. The news outlet mastered the art of using service worker caching, which helped them ensure shorter loading times and faster speeds irrespective of how inconsistent the network might be. Browse through hundreds of news stories and articles and read one of them and you will get an experience you won’t find anywhere else. That’s how good Washington Post progressive web app is.
That’s not all, this progressive app also tracks offline user activity with the help of Google’s library. This way, they get useful insights about readers helping them the app show news stories you are interested in and offering a truly personalized news experience.
Ali Express Etail
Ali Express is a retail wing of popular B2B online store Alibaba. Initially, Alibaba encouraged users to download the app on their smartphones but their tech team was busy in improving the website design and adding more functionality to it. Alibaba struggled to get users to download the app as the user engagement was poor. Finally, they decided to develop a progressive web app to solve their issues and succeeded. The response from users was overwhelming.
- Users visited 2X as many pages per browsing session
- 74% increase in time spent on the site
- Conversion rate doubled after implementing progressive web app
Flipkart Lite
Imagine being the largest E-commerce store in a country with an inconsistent network infrastructure. Yes, I am talking about India’s Flipkart. With half of its users having access to 2G networks, the company has no choice but to make shopping less of a hassle for users with limited or no internet connectivity.
They successfully achieved that goal with Flipkart lite progressive web app. If your internet connection goes down during the shopping process, you will not be interrupted. You can continue to browse different products even if your internet connection stops working. Due to this, they have managed to keep the shoppers on their website for longer, tripling the time on site. That’s not all, implementing progressive web app has helped them increase their conversion rate by 70%, which is a great achievement in its own right.
Uber Ride Hailing
Uber is a leading global player in the ride-hailing market. Uber was one of the earliest adopters of the progressive web application. They named it moober or m.uber and was focused on delivering a similar experience that the user gets from a native mobile app. The good thing about Uber’s progressive web app is that it runs on smartphones and tablets, which does not support the native app. Its small size and blazing fast performance even on slow networks make it stand out from the crowd. The development team at Uber did a wonderful job by creating a feature rich and fast performing app in a tiny footprint.
The Weather Channel
Apart from the size, performance, and resource requirement differences between a native and progressive web app, the ability sends push notification just like the native app give progressive web app a clear edge. It surely is an important feature for the weather channel’s progressive web app.
Despite having a native app, half of its user turned to its mobile website to receive severe weather warnings. The mobile version of the website lacks in features back then but seeing so many people accessing makes The Weather Channel think about having a progressive web app. There is a stark difference in loading speed between the progressive web app and native apps. The progressive web app loads 80% faster resulting in half a million push notification opt-ins within first three months of its launch.
Social magazine and news aggregator website Flipboard brings all your favorite stories from around the globe and present it in an easy to consume magazine. Flipboard progressive web app builds on the legacy of its native counterparts, offering users a smoother browsing experience without eating up on your mobile data. The interface is beautiful to look and delivers an immersive experience. Previously, Flipboard was only available for mobile users but that has changed with the introduction of its progressive web app, letting desktop users become a part of their community.
Smashing Magazine
For web designers and developers, smashing magazine is nothing new. Unlike others on this list which uses partially uses a progressive web app, Smashing magazines fully embraced the concept by converted their complete website into a progressive web app.
The results are evident from the moment you land on their website. Their website takes two seconds to load. You will get the same experience whether you are on a 2G network or 3G network. The same cannot be said for other progressive web apps in the same niche or even outside of it.
Make My Trip
Not everyone in the world has access to fast internet connectivity. There are regions where internet connectivity is inconsistent at best or non-existent at worst. Population in those regions has affordable devices that struggle with resource hungry applications. Make my Trip is another Indian booking platform that realized this and created a progressive app to resolve this issue.
Here is a rundown of what they have managed to achieve with the launch progressive web app.
- 160% increase in the number of sessions compared to mobile site
- 3X improvement in conversion rates as compared to mobile site
Financial Times
When it comes to news, Financial Times needs no introduction. In order to give their readers a much more immersive user experience, Financial Times developed a progressive web app. Its outstanding offline mode allows users to read news stories even when they are not connected to the internet. The traditional colored paper that we all are familiar with makes a comeback on the progressive web app, giving it an authentic look and feel. The no-frills experience is also one of the highlights of Financial Times progressive web app.
Which progressive web app example inspires you the most? Feel free to share it with us in the comments section below.
