Nothing Special   »   [go: up one dir, main page]

Back to Stories

How Simplifi by Quicken is giving ChromeOS users a fit-for-Chromebook experience with its Progressive Web App

Simplifi

Quicken

Different screenshots of the Simplifi user interface, focusing in on the Reports and Spending Plan screens.

Quicken’s no stranger to user-friendly digital tools. After all, its desktop and cloud product suite has helped over 17 million people manage their finances for more than 30 years. In 2020, the brand further expanded its lineup of products tailored to different devices and financial needs with its mobile and web app, Simplifi.

But the way people use their favorite apps is changing. And as browsers have evolved over time, so have web apps — which are more powerful than ever. With app usage on Chromebooks almost doubling⁠ throughout 2020 and 2021, Quicken saw an opportunity to fuel better user experiences with the web’s latest capabilities.

Here’s how the brand built a more responsive, reliable in-browser experience for ChromeOS users by developing a Progressive Web App⁠ (PWA).

Going from tabs to top-level apps

When Quicken launched Simplifi in 2020, the made-for-mobile Android app wasn’t optimized for Chromebooks. And while the brand did have a web app, it wasn’t available on the Chrome Web Store where people could find Simplifi.

With a PWA, Quicken was able to address these pain points by rolling out modern APIs to its existing web app. The brand kicked off this transformation by deploying the web app manifest⁠ with the Webpack manifest plugin⁠ to unlock a native-like look and feel. Quicken then used Workbox⁠ to create a service worker⁠ so its PWA could access the Cache API⁠ and work offline.

With a PWA, Quicken was able to address pain points by rolling out modern APIs to its existing web app.

To make sure users were running the latest version of the PWA, the developers ensured it updated automatically when people were in-app or went idle for more than five minutes — or they could simply update manually.

Quicken also implemented support for push notifications to encourage people to come back to the PWA. The developers added the brand’s own enabling layer following web optimization best practices⁠, which displays before the browser permission prompt.

Preparing the PWA for Play and pay

For ultimate “appiness”, Quicken made sure that its PWA was installable⁠. The brand then went through Google’s documentation to prepare a Trusted Web Activity⁠ (TWA) so it could list its PWA in the Google Play store. With Bubblewrap⁠, Quicken had no problem generating a TWA, and the entire development process took close to one week with a specialized, streamlined team.

Once its PWA and TWA were ready to go with manifest and asset links, the brand deployed the former to its stage environment and the latter to the internal testing track. To move forward with no-fuss monetization, Quicken implemented the Digital Goods API⁠.

The brand’s back-end service and RDNS were built as part of the Android app’s Google Play billing integration, so the development team was able to implement the Digital Goods API with minimal changes. This meant people could follow a familiar Google Play billing flow while the brand could easily accept in-app payments for subscriptions.

Meeting users across any and all devices

One of Quicken’s goals is to provide an easy and customizable experience for customers no matter what device they’re using. Many people gravitate toward larger screens simply because they want to see and do more at the same time than they can on mobile. That’s why Quicken made sure its PWA offers unique features that make the most of Chromebooks’ screen real estate.

For instance, cash flow projection in the brand’s mobile app is only available as a table. But in Quicken’s PWA, the information can be displayed as a graph — complete with estimates that extend further into the future. Other PWA-exclusive features include additional data visualization and import options as well as advanced spending, income, and savings reports.

Simplifi dashboard.

Once these large-screen experiences and monetization were ready, Quicken pushed its PWA live alongside its mobile Android app in the Google Play store⁠. Thanks to this unified listing, the brand can ensure that users always download the version of the app most fit for their preferred device.

To gauge success, Quicken is currently measuring the number of PWA trials and installs, the percent of users who upgrade from a trial subscription to a paid one, and the net promoter scores of users on a Chromebook compared to other devices.

These metrics are all trending up at two months in — and the brand’s already planning to invest more in PWAs. “We believe PWAs could be the future of running applications locally on many devices,” says Kristen Dillard, senior director of product management at Quicken. “We’re able to provide our customers with an experience that feels native, without having to invest in native applications for every platform.”