Reducing the Friction for Mobile Users with Progressive Web Apps
It was Carl von Clausewitz who first started to ascribe the differences between ideal performance and actual performance. In "On War", he wrote:
“Everything is very simple in war, but the simplest thing is difficult. These difficulties accumulate and produce a friction, which no man can imagine exactly who has not seen war. [...] So in war, through the influence of an infinity of petty circumstances, which cannot properly be described on paper, things disappoint us, and we fall short of the mark.”
And while his context was in relation to war, we have since discovered it is a concept that can be applied in many scenarios. In mobile app development, there is unavoidable friction—users have to first install the app, and then periodically update it—and there's friction that we as developers introduce. Induced friction includes things like:
- Requiring users to first register before using the app (and then having to verify their email)
- Including forms in the app that are too long, and overly complex
- An unintuitive UI that results in users struggling to find what they are looking for
Every bit of friction, whether induced or not, moves your users further away from converting. The more steps there are, and the more hoops we have to jump through in order to accomplish something, the more likely we are to simply walk away.
Progressive Web Apps not only offer the promise of eliminating what was previously viewed as unavoidable friction but also of helping you avoid induced friction. Although they aren't a miracle cure that magically eliminates all friction, they can motivate you to pay closer attention to what you expect from your users.
As smartphones have become more powerful—and more versatile in what users are able to do with them—so too has users’ demand for top performance from websites and apps grown. It isn't about instant gratification, but about squeezing our search for information in between all the other things we cram into each day. We search for information as we move from one meeting to the next, during our lunch breaks, and during commercial breaks while watching TV. Six or seven years ago we mostly did this while stuck in front of a computer, so could afford to wait for a slow website to load. At the same time, we didn't have as much choice as we have today when it comes to websites and information sources, so we had little choice but to navigate our way through tedious sign-up processes to access information.
Force a poorly optimised website, app, or sign up form, on users today, and they'll disappear faster than a toupee in a hurricane.
There aren't any official guidelines or standards for Progressive Web Apps yet, but Google—a major promoter of PWAs—has compiled a checklist, and auditing tool, of unofficial baseline criteria. One of these is that the app's first load should be fast, even on a 3G connection, ideally less than 10 seconds. Google knows that a significant number of mobile users do not have access to fast LTE and WiFi connections, relying on aging 3G connections. A really good load speed and overall experience for these users translates into an even better experience for faster connections.
As Jumia, an e-commerce site operating in Africa, discovered, a good baseline experience translates into higher conversions. Although they already had a native Android and iOS app, users in their main market seldom even had a 3G connection and were limited to 2G that itself only work intermittently. With limited data, and mainly using low-end phones, users either couldn't or weren't willing, to download a data-heavy native app. Jumia then adapted their website to also act as a progressive web app, which not only used less storage space but also used five times less data. By reducing or eliminating the friction of having to download a big app, and the amount of data used, they immediately saw a 50 percent drop in the bounce rate and a 33 percent jump in conversions.
Flatten the learning curve
Even if the only app a user has ever opened on a smartphone is Facebook, they would already be familiar with the subtle differences between a web page and an app. Apps include more gesture-based actions like taps and swipes, and there is a smooth, almost instant, transition between pages.
Although PWAs are essentially web pages that include a small number of new technologies, they are able to present the content of your website in a way that not only looks but also acts, more like a traditional app.
Using the Jumia PWA to search for accommodation is not only faster than using their standard mobile website, it is also more intuitive. Even the way the information on the main screen is presented feels more familiar in the PWA, which is exactly what you want when trying to reduce friction. The navigation is clear, and the transition from one page to the next is smoother. And this is especially beneficial to websites with a lot of navigation options, which don't always translate too well to smaller screens.
The less time users have to spend figuring your website out, the more likely they are to convert. MakeMyTrip, India's leading travel company, found that first time users of their PWA were three times more likely to convert simply because they were one tap away from the content, and what they were looking for was easily discoverable.
Show the way and the value
Leading on from the last point, online forms, whether used for registration or submitting info, are the bane of many mobile users. The smaller screen means they are already more difficult and time-consuming to complete than on a computer screen, but they often aren't properly optimized for mobile devices. With PWAs giving you the opportunity to create a more app-like user experience, you also have the opportunity to break forms up into smaller sections over multiple screens. But you shouldn't stop at only reducing the number of steps required to complete an action; make the user experience even more pleasurable by showing clearly how many steps still need to be completed.
By adding Smart Lock to their PWA, AliExpress was able to increase conversions by 11 percent, while reducing the amount of time spent signing in by 60 percent. An additional benefit to first time users was that three out of the four required sign-up fields could be pre-filled with their information, not only saving them time, but also reducing the number of manual errors made. And if you make the value of saving their credentials evident, like a faster sign-in in future, you could see similar figures as AliExpress, where 95 percent of users have saved their credentials, leading to an 85 percent drop in failed sign ins.
Progressive Web Apps are a relatively new use for existing technology, so while I have only explored three ways in which a PWA can help you reduce friction for your audience, there are other ways in which a PWA could benefit you. And as the technology matures and becomes even more widespread, more benefits for you and your audience will be unlocked.
Subscribe to our newsletter
Fresh small business insights and ideas delivered weekly to your inbox, gratis.