Back in February 2018, we sent our Design team to the Awwwards Conference in Berlin, where they attended a number of inspiring talks and workshops from the experts in user experience (UX) and user interface (UI). Claromentis Front-End Developer Simon Young shares his experience…
Progressive Web Apps
We learnt a lot at the Awwwards Conference, but a particularly interesting talk was delivered by speaker Christian Heilmann, who is a Program Manager and Developer Evangelist at Microsoft’s London office.
During the talk, Heilmann explained the concept of Progressive Web Apps (PWA) and its typical features. He gave the audience an overview of the current state of PWAs today and how industry professionals can help push this relatively new technology forward to wider adoption in the market, where business can make use of the technology’s benefits.
What is a Progressive Web App?
Heilmann presented a PWA as “a web-technology based application” which provides an experience similar to traditional native mobile applications (i.e those that are coded for a specific language then installed onto a smartphone).
The typical features of a PWA are:
- Usable in an offline or low connectivity state
- Fast loading speeds
- Push notifications
- Have an immersive full screen experience without the URL address bar
- Available from a mobile home screen
He explained that this would provide a user with an experience which is “FIRE”: fast, integrated, reliable and engaging. Here’s a break down of what that means:
Fast – for some apps, PWAs offer a faster load time than native apps. They have the added benefit that they don’t need to be installed like native apps, reducing a barrier of entry for the users.
Integration – this means that if the app satisfies certain requirements, it is able to use features that were previously available only to native apps, for example, push notifications.
Reliable – PWAs are reliable because they can still be used even if the device you are using is offline or in a place with a weak, intermittent, or expensive internet connection. By using Service Workers, the PWA’s data can be cached so that once you’re reconnected, you will be prompted to reload your screen so that you can receive any updates to the app.
Engaging – PWAs provide an engaging experience for the user through the use push notifications.
At a minimum, a PWA requires a Web Manifest file, and should use certain web features that are already available (such as being served over HTTPS), it should have a unique URL and use Service Workers to do work behind the scenes when the app is not active.
What are the benefits of a PWA?
Improved performance – As we have already seen, a PWA offers extremely fast loading times, allowing quicker access to an app’s features. This could be useful for those on the move who need to access information quickly.
Offline mode – One of the most handy potential benefits is the ability to use the app when the user’s device is offline or in a low connectivity area. This is valuable for users who typically travel a lot or those who work in areas with unreliable wireless connections.
Push Notifications – The availability of push notifications directly displayed on phones in PWAs are a useful feature, since they are typically read far more often than other forms of communications, such as emails or status updates on social media.
Up-to-date – The integration of Service Workers with a PWA means that it will always be refreshed with the most recent content when the user’s device has internet connection.
No Installation Required – There are no long download times for PWAs in comparison to native mobile applications.
Home Screen Icon – PWAs have home screen access so are easily found without having to go through platforms such as the App Store.
Security – HTTPS service is a requirement of PWAs meaning that your app would be served securely by default.
