Progressive Web Apps

A Progressive Web App (or PWA) is a web-based application that can work as both a website and a mobile app. They look and feel cohesive on both platforms, with the user experience prioritised. Owing to their technology, PWAs provide the option to deliver faster and more fully featured experiences to your users, even when they are offline. As web apps, they are extremely flexible for almost any application and typically more affordable than a native phone app.

TPP Mobile commerce sales rise 600x600
TPP What are PWA 600x600

What are Progressive Web Apps?

Progressive Web Apps (PWAs) are the result of a specific design philosophy for web development platforms, enabling single applications to be built for both web and mobile in one hit. Fundamentally, they are web applications, but they feel like native apps. You can read more about traditional business applications and portals here.

They provide an alternative to maintaining a separate native mobile app and website, as they provide the seamless app experience across all devices, whether in the browser or as an installed app on a mobile device. They can be designed to behave exactly like a purpose-built mobile app from the App Store, except without the significant complexity and cost of App Store distribution.

Converting existing apps and websites to Progressive Web Apps offers the opportunity to boost customer experience, reduce application size, and save costs.

Want to learn more about what PWAs can do for you?
TPP Pig on Mobile 600x600

What is the purpose of Progressive Web Apps?

The online industry is changing continuously and has been for many years. As consumers have moved from computers to phones and tablets, the mobile-first experience has become not only expected but demanded. Ecommerce for both consumers and businesses follows the same trend with mobile commerce sales projected to rise by over 22% to 3.5 times the sales numbers seen in 2016.

PWAs seek to mitigate the fluctuating connection strength of mobile users, helping users navigate the pitfalls of dipping in and out of signal without frustrating wait times and failed page loads. They comprise a Single Page Application which aids performance, only needing to reload the changing elements, improving reliability. They offer options like push notifications, access to device cameras, and install-ability so they can sit on the home screen with the user’s other apps.

PWAs benefit your customers by enabling them to use your service without navigating an app store and taking up phone storage, whilst still allowing them to install the app on their home screen. PWAs provide a lower cost of entry into the app marketplace, through which you can deliver reliable and efficient online services to your customers.

Improvements driven by PWAs

Progressive Web Apps were borne out of a need for ever-improving online experiences. By utilising Progressive Web Apps, we can benefit from:

Page Speed icon

Improved page load speeds

Reliability icon

Improved reliability

Improved Features icon

Improved feature sets

Online experience_2

Improved online experience

Learn more about Microsoft's Power Platform of complimentary applications
Companies around world PWA 600x600

What are the features of Progressive Web Apps?

We are huge fans of Progressive Web Apps technology. Many companies around the world have seen extensive benefits from using PWA technology, such as a +300% revenue increase for Best Western Hotels.

PWAs have many great features, such as:

  • Lower development and maintenance costs than native apps
  • They can be added to the user's home screen without taking up space as a downloaded app
  • The PWA does not need to be submitted for approval in the App Store (you can submit it to Apple, for example, if you would prefer for it to appear on Apple's App Store)
  • Your app can be found via Google search, as PWAs are indexed quickly by Google
  • You can design push notifications into your app to drive customer engagement
  • They include responsive designs that scale effectively to provide the best user experience on any screen size – since PWAs are still web applications under the hood, they can serve as mobile apps as well as web sites
Does Progressive Web App technology sound like the choice for you?
Benefits of using PWA 600x600

What are the benefits of using PWAs?

Where native phone and tablet applications have ruled supreme for so many years, Progressive Web Apps are now challenging for the title. They bring a wealth of benefits to businesses and their customers, from development through to delivery.

Here are some of our favourite benefits:

  • PWAs can work offline, unlike websites and many regular apps
  • When the user is online, certain features activate, e.g. location-specific information
  • They are generally much smaller in size than traditional apps
  • From desktop to mobile to tablet, they work seamlessly across devices
  • Faster load speed than traditional websites, without sacrificing on rich content such as high-quality images and videos
  • One version of your web site, optimised for all devices
  • Minimises data usage for users
  • Modern, beautiful aesthetic options for users
  • Still compatible with devices that are ‘less modern’ than more up-to-date technology
  • Adaptive user interface, making PWAs fast, reliable and engaging
  • Cheaper than a traditional app to build
  • Easy for users to share – being web apps, PWAs can be shared with the phone’s native share button

The history of Progressive Web Apps

2015 date 400x400

2015

Alex Russell firstly introduces the technology of Progressive Web Apps to the world.

2016 date 400x400

2016

Google switches to a mobile-first approach, with PWAs generating a lot of excitement.

2018 date 400x400

2018

Microsoft Edge makes PWA a new standard and Apple begin to offer PWA support.

2020 date 400x400

2020

Play Store, App Store and Microsoft Store all begin accepting PWAs.

2022 date 400x400

2022

Google Chrome becomes the most popular browser, supporting PWAs as standard.

TPP Progressive Web App Purple 600x600

Progressive Web Apps Use Cases

 PWAs can be used to satisfy pretty much any requirement that you may have for online user interaction. Providing a high level of performance across devices is the key incentive for using Progressive Web Apps, as seen through the companies who have adopted the technology.

Some of the companies that had created and benefitted from PWAs are:

  • Starbucks: the Starbucks ordering app benefits from being over 99% smaller than the original iOS application
  • Spotify: streaming music through Spotify's app is a seamless experience, with a background that adapts to the user's journey through the site
  • Pinterest: the image sharing social media app Pinterest lacked user engagement until adopting PWA, which increased core engagement by 60%
  • Uber: Uber's transport service app boosts accessibility using PWA, where a device on a 2G network can load the site in 3 seconds
Not sure about the right technology for your business problem?
Disaster Recovery plane - 600x600

The Power People's Offering

The Power People have designed a Progressive Web App framework that enables us to rapidly deliver PWA solutions to our customers. The framework contains all the key elements required for deploying speedy Single Page Applications with secure user authentication and a bundle of other useful tech under the hood, so we get a head-start on every PWA project we deliver.

Using our web app framework, we have created PWAs for customers that span numerous industries and provide internal and external users with a wealth of features. From internal IT case management to customer self-service, from document downloads to fuel purchasing, from breweries to healthcare.

The beauty of working with our framework to build PWA solutions is that the technology enables us to rapidly create user-focused interfaces for any application. We regularly plumb our PWAs into data in back-office systems, enabling us to present up-to-date details to customers and suppliers; and automate business processes with real-time updates to master data elements. Not only does your customer or supplier get a pleasant experience working with you, but they work right inside your business processes so there’s no duplication of effort.

Customer web app

Our Customer Web App

One of our most popular requests is for our Customer Web App, which provides end customers with self-service capabilities to see their balance, view their account history, raise and review active cases, and place orders from an online catalogue. With a connection to Microsoft Dynamics 365 Business Central built into our web app framework and our expertise in back-office systems, all this can be provided real-time.

Whenever we get a request for something new, we love the opportunity to sketch out what the solution might look like by walking through the associated processes and user experiences to define an app that ticks all the boxes. Get in touch to arrange a free intro call with one of our apps & portals consultants to start your PWA journey.

See our team's work in action

Progressive Web Apps FAQs

Why are they called Progressive Web Apps?

'Progressive' because the concept of a PWA is that it is progressively more feature-rich, based on the combination of device technology and internet connectivity. 'Web App' because, although it looks and behaves like a native app on a mobile device, a PWA is a web application and not a native app.

Older devices may have fewer modern features for the app to use. Offline devices may not have access to certain information. However, the design philosophy of PWAs is that they will work on not-so-modern devices and they will work offline – their breadth and depth of functionality will progressively improve on more modern devices and with better connectivity.

How do I know whether I need a PWA or some other app or portal?

Get in touch for a free chat.

Is PWA just the next buzzword?

Yes and no. PWAs have certainly become a buzzword. But not all buzzwords are bad. Rather than being a specific technological niche that might be outdated in the next however many months or years, PWAs represent a design philosophy that recognises our changing habits of internet use. We don’t want to be endlessly downloading a new app for every single new thing we do online. We don’t want to have websites timing out and crashing when our train goes into a tunnel. We want a push notification to tell us if something we actually care about needs our attention. We want our online world to be accessible with minimal friction and maximum satisfaction. This is where PWAs come from – the real human desire to have a better online experience. That desire may grow and change, but it’s not a fad that is here today and gone tomorrow!

Can I install a PWA on my phone or tablet?

Yes. Whilst a PWA is a web application and not a native app from the app store, it can be installed on mobile devices and opened from the home screen.

How does a PWA actually work offline?

The level of offline capability that the PWA can deliver depends on the app design. Some PWAs have very limited offline capabilities, perhaps simply a friendly screen recognising who is logged in and saying that a connection is needed to retrieve information. Others have very rich offline capabilities, owing to offline data caches, whereby the information needed has been downloaded to the device, so that it can be used even when there is no internet connection. The more offline capabilities are required, the more complex the management of data flows.

A typical beneficial middle ground is that a portion of data is cached for offline use, but functionality to update data sets is disabled until an internet connection is available. E.g. as a sub-contractor, whilst offline, you can see your jobs list showing where you need to be and at what time, but you can’t enter details against the job until your device is back online.

Do I need a separate PWA for Apple users and Android users?

No. A great benefit of PWAs is that they are platform independent. The same app can be used on all devices with no additional costs associated with app store distribution. Users also get to install the PWA without it taking up nearly so much space on their device.

What devices can run a PWA?

Any device running a modern browser will run a PWA.

Why wouldn’t I keep using my main website?

Since about 2018, more users are using mobile phones to browse websites than any other device. As such, to ensure your customers and other users have a great online experience, you need to ensure they can get the best experience possible on their phone. PWAs provide a design philosophy to ensure your next iteration gives them an experience they want to keep coming back to.

Can search engines find my PWA?

Yes, if you want them to. PWAs are web applications, so they can be indexed for search engines in the same way as traditional web applications. They also have a dedicated 'manifest' to describe themselves to search engines for even better indexing.

How can a PWA designed for a small mobile screen work just as well on a desktop web browser?

Modern web applications use 'responsive designs' in order to automatically scale to the device’s screen estate. As long as your PWA designer targets the app at both small screens and desktop browsers, the screen contents can scale accordingly, giving users the best experience for their screen estate.

For example, on a small phone screen, tabular data may be displayed as mini card forms rather than rows. Fields and values will be paired up on a single short line that fits on the screen. Scrolling down the screen, the user can see all the fields on the card before reaching the next card. In contrast, a user on a larger screen can be presented with a traditional tabular layout of column headings for the fields and values beneath the column headings from left to right.

Another common example is the burger menu, which appears on smaller screens in place of the full navigation that can be shown in full on larger screens.

Elements can either be tucked away cleverly behind a button or may be removed completely. For example, a banner advert that fits neatly into a larger screen estate may simply not achieve the desired effect on a small screen and be removed completely, or replaced by a completely different ad, positioned for the smaller screen.

Good interface design can render a single PWA a perfect fit for everything from mobile phone app to desktop browser. However, it’s also possible to focus design on a single screen size if required.


How do I go about a successful PWA project?

Get in touch for a free call to give you some pointers and help start you off on your PWA journey.

Have a chat with our specialists about PWAs for you