Test Drive a PWA Digital Business Card and Brochure
Updated: Jul 16, 2020
A progressive web app (PWA) is a new type of saveable website that makes for the perfect digital business card. The best way to understand the broad utility of a digital business PWA is to test drive a few.
Below are links to three PWAs that combine contact and product info, which is the whole point of being digital - you can tailor them to fit the need.
These PWAs share content, which is rearranged to make:
Digital business card + product brochure
Simple digital business card
Digital brochure + contact links
I created all three in a few minutes from existing content. Launch the first PWA by tapping the link or by scanning its QR code with a mobile device and then let’s explore its capabilities.
User Experience (UX)
First, notice that a PWA loads from a link for immediate engagement. It’s low friction.
One can use it anywhere on the web -- in an email, as a social bio link, in the chat window of a video conference. It’s convenient.
Because it can launch from a QR code, it can be the touch-free way to begin a service or transaction from print.
As with paper, PWAs are universal. This PWA works with almost every browser and device. It has a mobile-first user interface that is perfect for today’s audiences, but it also displays nicely on desktop.
It works offline too. Load it on a mobile device, then place it in airplane mode, and you can continue to navigate the app. Test offline use by navigating the “Learn more about PWAs” subpage.
A PWA also has two modes of operation: "Browser" and "Standalone." Browser mode is standard when you first launch a PWA. You see your browser's navigation bar and can use its built-in “share” controls.
Save this PWA to your home screen for standalone mode, and the user interface will change to full-screen navigation. It then feels more like an app. The Tapps no-code PWA platform automatically adds a new navigation bar that also accesses the browser's share function.
Most paper business cards and handouts get tossed. PWAs are easier to keep.
You have three options to save this PWA:
Save it to your home screen as an app. You should see an automatic prompt from Android or pop-up directions if you use iOS. Most mobile browsers now have an "Add to Home Screen" function for PWAs.
Save it to your contacts as a vCard. Try the "Save vCard" option in the app’s menu (or in a vCard action in the brochure PWA). The saved contact will include the PWA's link, so users will always be able to access updated information.
Bookmark the link just as you would any website.
It's not in the same category, but you can also save the image of the QR code, which can launch the app.
The superpower of PWAs is shareability. It alone is reason enough to use them. PWAs spread virally in ways unavailable to paper cards. They can be shared with one or thousands and are just as easy to re-share. Copies are free.
Use the “Share To” button in the bottom menu of this demo PWA to share it through an email, SMS, AirDrop, or through a social channel. (The “Share To” button will access the same share API as the browser’s share button. The only difference is that the “Share To” button will automatically add a custom message to the shared link.)
Try texting the PWA to yourself.
See how seamless the process is
Notice the custom message
And notice the image-rich marketing message (i.e., metadata)
Another sharing option is the QR action in the app. Tap it to display a QR code that will launch the app when scanned.
Optionally, a PWA will even show up in search results.
PWAs are more engaging than their paper step-sisters. They are interactive and can deliver any functionality available to a website and most that are available to an app.
Below is an educational PWA that includes samples and directions for the standard actions available in the Tapps no-code PWA platform. It demonstrates how content-rich a PWA can be compared to a basic digital business card.
Tutorial PWA: action-tutorial.tapps.to
The previous example PWAs make use of menus, in-app messaging, a social feed feed, a carousel of testimonials, a subpage of tutorial microsites, an embedded video, a tap-to-email and call links, a map, a share button, a vCard, social links, and I can update or add to them whenever I want.
Updates are immediate and universal. You can even have digital business cards for the entire staff and make a logo and brand color change in one place that will instantly update in all outstanding cards.
Finally, PWA's have a feedback loop that paper lacks. Measure page views to understand engagement. Measure the click-through-rate of the actions of the PWA to understand what is working so you can improve the experience.
The examples in this blog offer a glimpse of just how powerful and flexible PWAs can be. Business communication has shifted to online. PWAs are a necessary tool for those who want to network most effectively in a post-pandemic market.