Microsoft and Google team up to make PWAs better in the Play Store

We’re glad to announce a new collaboration between Microsoft and Google for the benefit of the web developer community.
July 9, 2020
| Software Engineer APS W+D

hero-image
Web shortcuts on Android — now available to PWA developers through PWABuilder

We’re glad to announce a new collaboration between Microsoft and Google for the benefit of the web developer community. Microsoft’s PWABuilder and Google’s Bubblewrap are now working together to help developers publish PWAs in the Google Play Store.

PWABuilder.com is Microsoft’s open source developer tool that helps you build high quality PWAs and publish them in app stores.

Bubblewrap is Google’s command line utility and library to generate and sign Google Play Store packages from Progressive Web Apps.

Earlier this year we started working together with Google to make PWABuilder utilize Bubblewrap under the hood. Today, we’re announcing two great new features for PWA developers borne out of our collaboration:

  1. Web shortcuts support: PWAs packaged for Google Play via PWABuilder will now support the new [web shortcuts standard](https://w3c.github.io/manifest/#shortcuts-member
  2. Advanced Android features & customization: PWABuilder now supports the full range of trusted web activity options that makes your PWA shine on Android devices. From PWABuilder, you can customize the appearance of the Android status bar and nav bar in your PWA, customize your Android splash screen, change your launcher name, use an existing signing key, utilize deeper push notification support, configure your package’s ID and versioning, fallback behavior and more.

All of this was a result of the collaboration between Google and Microsoft, with
your PWAs reaping the benefit. More details below.

Web Shortcuts Support

Shortcuts are a new web standard that enables installed PWAs to have app shortcuts, a contextual list of common actions that users can quickly jump to:

alt
Twitter is using web shortcuts to enable quick actions like New Tweet, Notifications, DMs. This feature is now available in Edge Canary and Chrome Canary.

Web shortcuts integrate into the operating system — such as Windows’ task bar and start menu, or Android’s home screen— enabling users to quickly access your app’s core functionality.

Today we’re pleased to announce support for shortcuts in PWABuilder. Thanks to our collaboration with Google’s Bubblewrap, PWAs you package for the Google Play Store through pwabuilder.com will now receive full support for shortcuts. 😎

The support happens automatically; no extra work required. Shortcuts you define in your web app manifest will work in your Google Play Store APK package as one might expect them to. As users discover and install your PWA in the Google Play Store, they’ll be able to easily re-engage with your app through web shortcuts.

To try it out, go to pwabuilder.com and put in the URL to a PWA with shortcuts, such as https://sadchonks.com

alt

Click start to analyze the URL and then click “Build My PWA”:

alt

You’re asked which app stores to publish in. Choose Android to package for the Google Play Store:

alt
alt

This will generate an APK package that can be uploaded to the Google Play Store. And when it’s installed on Android, your app shortcuts will just work. For example, you can long-press on your app’s tile to see the web shortcuts:

alt
Web shortcuts working on Android in a PWA published to the Google Play Store

You can read up more about your PWA’s web shortcuts on Android over at the shortcuts with trusted web activities explainer

Android Features & Customization

When we rolled out our initial collaborative work with Google’s Bubblewrap this spring, PWABuilder didn’t have a way to customize the Android package it generated. While this was fine for some basic scenarios, like publishing to the Google Play Store for the first time, it fell short in other ways.

To address this, we’ve updated PWABuilder to allow for full customization of your Android app package:

alt
PWABuilder Android options. When you package your PWA for Android, we give you a
bunch of ways to customize the appearance and functionality of your Android app

With this new functionality, you can customize your PWA for Android:

Whew! As you can see, you can customize nearly every aspect of your PWA Android app package.

To access this functionality, put a URL into pwabuilder.com then:
Build My PWA -> Android -> Options

alt
Choosing Options here will open the Android package options discussed above

Final thoughts

Both web shortcuts and Android package customization are possible thanks to the collaboration between Google and Microsoft. We are working together to make the
web a more capable app platform.

In addition to the above, we’re also collaborating with Google on Project Fugu to incubate new web platform features, with PWAs front and center, toward the goal of standardization so everyone benefits. We’ve highlighted some Project Fugu capabilities in our web platform demo showcase

We hope you enjoy these capabilities in PWABuilder! Please give it a try over at pwabuilder.com

Share this article on your social media!