Simplify Your Mobile Presence With Progressive Web Apps
The biggest thing we take for granted in the current mobile-dominated web is that everything “just works”, no matter what size or type of device you’re on. But what’s the real impact of that expectation?
For customers, the frustration of needing to switch devices can be more than enough to turn them away from a certain product. For product owners, there’s an expectation that everything needs to be created in parallel to be desktop-friendly, tablet-friendly, mobile-friendly, and to have an equal native mobile app for every platform, which can quickly add up in cost. And for developers, there’s the fact that now you have to actually make all those versions of the same app, across completely different technologies for web and native, and have them work similarly enough to not raise any eyebrows.
But luckily, there’s a new way of doing things, that allows you to unify your front-facing content while cutting down on duplicate work:
Progressive Web Apps
Your web app can act like a native app.
If you’ve used a mobile phone or tablet, you’ve used native apps. They fill up your home screen, and typically involve building up a whole new product using that platform’s specific tools.
Instead, with recent gains in mobile support, your existing web app can declare itself as a valid mobile app (through the ability to declare Web App Manifests), and install itself as easily as someone bookmarking that page. You can even set up your PWA to prompt the user to install it right there, just like an app store banner.
Your web app gets a little bit smarter.
By gaining the ability to act as their own agents (using a feature called Service Workers), you can not only improve load times (with more powerful caching), but you can run updates or send push notifications in the background. That’s right: you can send timely updates and reminders to your users without building a whole new native app or relying on cumbersome emails.
This means your web app can get the best of both worlds: installation right on your mobile device’s home screen, full use of notifications, and all while staying just as up-to-date as your main web app without pesky app store processes. Even better, you can rely on local storage to keep your branding and some basic functionality even with no-or-low internet availability, just like a native app.
How do you determine if you’ll benefit from using a PWA? Ask yourself which of the following can apply to your existing or upcoming apps:
I have an existing classic web site/app, but want to add mobile support without investing heavily into a native app platform.
If you already have a Responsive design for your web app, or if you use a parallel app (like the standard m.your-domain-here.com), then you’re already mostly there! While you may not be able to take full advantage of a PWA on day one, we’ve seen plenty of companies rapidly pivot to the PWA model for some immediate benefits. Even on day one, keeping a presence on the home screen without the hassle of navigating an app store can do wonders for customer retention (and developer headaches).
My customers often need to work in no/low network environments, should we even invest into a mobile-specific app?
Yes, you should! Mobile devices, but especially phones, are designed around working in the background, sending and receiving data when connections are available, and only alerting users when needed. Native apps and PWAs both handle this well by allowing for offline support, creating your own background update processes, and sending notifications to the user when your app finds something important (and has permission!).
Our native app needs a special hardware feature for mobile, which platform can we use?
If you already know your technical requirements, the biggest factor will be seeing if HTML5 supports the feature you need on your target browsers. Since PWAs are fundamentally web apps, being rendered by a web browser instead of a full stack of custom code, there are still some restrictions on hardware access. However, HTML5 is still in a stage of rapid growth, and already offers a great selection of mobile-specific features, like the camera. Some, like Bluetooth connectivity, can only be found in some browsers, in which case you can still always use a cross-platform tool to quick-start your native app, like Xamarin.
Now that you know what progressive web apps are all about, how do you move forward? In my next post in this series, we’ll walk through the steps taken by a fictional company as they figure out where they can use a PWA to improve their overall experience while cutting costs.
Interested in finding out more directly? We’ve worked with clients of all sizes and a variety of backgrounds to help deliver the experience they desire, for public web apps, internal apps, dedicated mobile apps, or anywhere in between. Feel free to start a conversation, and if you have any questions on this topic, or requests for a follow-up, just comment below!