With Apple now also jumping on the bandwagon of Progressive Web Apps (PWAs), the next generation of web experiences is fast approaching. But what are progressive web apps? To get to grips with this transformative new technology, we looked at progressive web app development ourselves and transformed UX Companion into a PWA.

For years now, Apple has been resisting the rise of PWAs, ostensibly because it would affect their bottom line. After all, if PWAs took off, who would use the App Store to download new apps? PWAs put billions of dollars of Apple’s revenue at stake, but there’s only so long you can push back against the evolution of technology. With the release of Safari 11.3 – which includes service workers that are integral to PWA technology – Apple has now effectively conceded that a major part of the web’s future is the PWA.

But what are PWAs, and how has Cyber-Duck worked with PWAs in our recent R&D projects?

What is a Web App?

A progressive web app (PWA) is a native app experience that allows a website to behave like an app. Like an app, you can create shortcuts on your home screen but the content is presented to you in the website browser (rather than in an app). Effectively, PWAs are websites masquerading as apps – you fully download and install them on your device. So just like native apps you download from the Play Store or App Store, PWAs work offline and can even send push notifications. It utilises modern technologies of the time like service workers, JSON and HTTPS so that virtually any website could be a PWA.  

To install PWAs, you go straight to a website in your browser where you are prompted to install the PWA on your home screen. It cuts out the need for an app store, as you will interact with an organisation directly. But to do this, you need new functionality in your web browser – Safari 11.3 and Chrome now offer service provider functionality to facilitate the download of PWAs.

There has always been a divide between web browser experiences and native app experiences, but PWAs will bridge this divide to provide a seamless, consistent user experience across all devices.

What benefits will PWAs have for businesses?

PWAs will be very beneficial for businesses. Here is a summary of the key takeaways:

  1. Offline mode – Without internet connection, websites are extremely limited in what they can display but apps are not. With the ability to work offline, you can increase a user’s engagement with your website. Information can be saved in offline mode and shortcuts can be created to the home screen so users can return to them later.
  2. Performance improvement – the technology within the PWA caches information and serves images, text, stylesheets quickly. This can also improve your SEO performance, as user can gain access to URLs through the progressive web app, so they are indexed by search engines.
  3. No install – when you download an app from the App Store or Google Play, it can take it’s time to download. A PWA is installed to your phone with its own icon on the home screen of your phone. It’ll take you directly to the website app. Your company won’t need to go through the submission process for the App Store, which can sometimes be tedious.
  4. Features and Updates – you are in control of what hardware features to implement, like push notifications. Developers and Marketers can also come up with new and creative ways of showcasing new content. Without submitting through the App Stores, your developers can make updates and push them without having to go through a review.

Progressive Web App Examples

There are a number of high performing progressive web app examples out there, a couple of noteworthy ones are:

Lancôme

The luxury make-up and skincare brand rebuilt their mobile website as a progressive web app. The company noticed a surge in mobile traffic vs desktop, but a low conversion rate on mobile. Instead of creating an app, they invested in a PWA to take advantage of service worker technology, which would deliver a more reliable performance and faster loading time.

Loading time for the page to become interactive decreased by 84%, along with a fall in bounce rates of 15%. Mobile sessions increased by 50% and conversions rose 17%. It's a good progressive web app example as the company also took advantage of push notifications, which led to an 18% open rate, and 8% made a purchase.

George

Our next progressive web app example is George. The clothing brand, which is part of ASDA, upgraded their site to PWA after discovering a rise in mobile traffic.  Online shoppers had high expectations, requiring fast and accessible websites to make purchases.  

By utilising PWA technology, the page loading speed significantly decreased 3.8x times and there was a rise of 31% in conversions. George provided a “Add to Home Screen” option which helped boost user engagement with the website by increasing time spent by 28%.

These are just two progressive web app examples, but there are many more. In 2018 the year of the PWAs, we utilised progressive web app technology our award-winning app, UX Companion, so users could still access our content offline and benefit from faster performance.   

Should I invest in a PWA?

The previous progressive web app examples provide success stories of companies that have utilised the technology to increase conversions and improve their business models.

A lot of these companies brought in a third party with expertise in the field to give them a hand, as they did not have the capabilities in-house to produce PWAs to market quickly. Sometimes having another pair of eyes can offer a fresh perspective. In the George project, the agency worked with the clothing brand to develop user journeys. This type of market and persona research is extremely valuable, so you can produce the best progressive web app possible.

2018 saw a huge rise in progressive web apps, and it can be extremely tempting to jump on the bandwagon of what’s possible. The case studies and stories of success are tempting, but don’t forget to evaluate whether a PWA is necessary for your company at this stage. If you are still performing extremely well on desktop with high conversions, you probably don’t need to invest in progressive web app technology yet. When you do, be sure to seek out advice first as there might have been changes to the technology that you are unaware of.

UX Companion is now a PWA & Alexa Skill

You may have heard about UX Companion before; it’s our award-winning user experience glossary of key terms, covering all the basics of user-centred design. UX Companion is highly successful, with over 50,000 downloads across Android and iOS. We also developed an Amazon Alexa Skill for UX Companion too, which you can see more on below.

We turned UX Companion into an Alexa Skill after it enjoyed a great reception on iOS and Android. Now a PWA, we hope UX Companion will continue to be one of our greatest R&D success stories.

We launched UX Companion back in 2015, and have been constantly updating it with new key terms and software patches ever since. It’s our most popular R&D project to date, so we wanted to prepare our marketing app for the future: we turned the app into a PWA.

Head over to UX Companion now to see a progressive web app in action. You can enjoy all the features of the native app experience directly in your browser without having to install anything.

Professional PWA developers in London

In the future, we believe a major part of digital innovation will centre on PWA development. It’s only natural; our mobile and web developers have already been using the same API for both web and native, but we can now take this best practice to its logical conclusion and share the same user interface across both web and app experiences. This is what will happen, which is why you need to hire the PWA developers here at Cyber-Duck today. 

Following our work on UX Companion, we have refined our skills as PWA developers. We can now bring our expertise in PWA development to organisations in London, Leeds and nationwide. Contact our friendly team today to find out more.

Share this article
Sylvain Headshot 200x200

Sylvain Reiter

Client Services Officer

As Cyber-Duck's CSO, Sylvain works throughout the organisation to deliver high-quality technical solutions for our clients.

Related