34
Confidential & Proprietary Confidential & Proprietary PWA Revolution 2016

Startups And Their Way From AMP to PWA (In 7min)

Embed Size (px)

Citation preview

Page 1: Startups And Their Way From AMP to PWA (In 7min)

Confidential & ProprietaryConfidential & Proprietary

PWA Revolution2016

Page 2: Startups And Their Way From AMP to PWA (In 7min)

ZERONUMBER OF APPS

AVERAGE USER INSTALLS PER MONTH

Source: comScore Mobile Metrix, U.S., Age 18+, June 2015

Psst! Mobile users visit over 100 websites per month.

Page 4: Startups And Their Way From AMP to PWA (In 7min)

Reliable Fast Engaging

Progressive Web Apps are…

Page 5: Startups And Their Way From AMP to PWA (In 7min)

Confidential & ProprietarySource: xkcd.com a webcomic of romance, sarcasm, math, and language

Page 6: Startups And Their Way From AMP to PWA (In 7min)

Confidential & ProprietarySource: Top 1000 mobile apps vs. top 1000 mobile web propertiescomScore Mobile Metrix, U.S., Age 18+, June 2015

The web offers broader reach, but engagement is low

10.9

Monthly unique visitors (MM)

3.3

Average minutes per visitor

Mobile webApps

8.9201.8

Page 7: Startups And Their Way From AMP to PWA (In 7min)

Confidential & Proprietary

Opportunity to capitalize on broad mobile web reach

Mobile Web Lots of users (hard to re-engage)

High engagement (small piece of overall user traffic)

Modern web enable better engagementOpportunity to engage users

Apps

Page 8: Startups And Their Way From AMP to PWA (In 7min)

Confidential & ProprietaryConfidential & Proprietary

“There is no higher form of user validation than having customers support your product with their wallets. However, the path to a profitable business is not necessarily an easy one.”

udacity.com/course/app-monetization--ud518

Page 9: Startups And Their Way From AMP to PWA (In 7min)

Confidential & Proprietary

Startups must focus + provide the best experience

Site/App App

Page 10: Startups And Their Way From AMP to PWA (In 7min)

Confidential & ProprietaryConfidential & Proprietary

Speed and Engagement

Page 11: Startups And Their Way From AMP to PWA (In 7min)

Confidential & Proprietary

Accelerated Mobile Pages

● Articles are cached and load instantly

● Publishers have control over visual design and business model

● Supports existing ad formats

● Deepen engagement with related articles

● Launched with news and expanding to other content verticals

Page 12: Startups And Their Way From AMP to PWA (In 7min)

AMP is simple for users to start fast

Web pages, today Accelerated Mobile Pages

Page 13: Startups And Their Way From AMP to PWA (In 7min)

Confidential + ProprietaryConfidential + Proprietary

AMP: Start Fast

Progressive Web Apps:Stay Engaged

Page 14: Startups And Their Way From AMP to PWA (In 7min)

Confidential & Proprietary

Progressive Web AppsAll the goodness of websites:

● One click away from accessing content● Available across browsers● Fast loading, smooth animations and navigations

With new capabilities:

● Access via Home screen icon on device● Good experience on flaky or no network connections● Re-engages with push notifications

Page 15: Startups And Their Way From AMP to PWA (In 7min)

Confidential & Proprietary

Increase in conversion rate and lower data cost

higher conversions from users arriving via home

screen icon (Flipkart, 2015)

+70%

3xLower data usage

Page 16: Startups And Their Way From AMP to PWA (In 7min)

Confidential & Proprietary

Enabling app-like capabilitiesService Worker

● Client-side proxy written in JavaScript● Access device capabilities to allow your site to be

“app like”

Web App Manifest File

● Rich presence on user’s Android homescreen● Launch in full-screen mode on Android (no URL bar)● Control the screen orientation for optimal viewing● Define “splash screen” launch, theme color for site

{"short_name": "My Cool App", "name": "My Totally Cool Application", "icons": [{"src": "launcher-icon-3x.png", "sizes": "192x192", "type": "image/png"}, {"src": "launcher-splash.png", "sizes": "512x512", "type": "image/png"}], "start_url": "index.html", "display": "standalone", "background_color" : "#aeaeae", "theme_color" : "#aeaeae", "orientation" : "landscape"}

Page 17: Startups And Their Way From AMP to PWA (In 7min)

Confidential & Proprietary

Add to Homescreen and launch in full-screen mode

User who visits 2x within two weeks will be prompted with “add to homescreen”

One tap to add to homescreen

Opens full screen (no URL bar)

Page 18: Startups And Their Way From AMP to PWA (In 7min)

Confidential & Proprietary

Show content when on flaky networks

6

Page 19: Startups And Their Way From AMP to PWA (In 7min)

Confidential & Proprietary

Send Web push notifications

System level notifications, like apps

Ask to notify users with specific information

Can send notifications even when page closed

Page 20: Startups And Their Way From AMP to PWA (In 7min)

Confidential & Proprietary

AMP to PWA Flow (1 of 2)

WaPo article in AMP carousel Once on AMP article, WaPo silently registers Service Worker

PWA launchable from menu; in future WaPo may direct more navigations to PWA experience

Page 21: Startups And Their Way From AMP to PWA (In 7min)

Confidential & Proprietary

AMP to PWA Flow (2 of 2)

Site loads instantly on WaPo domain Frequent users prompted to add to homescreen

Icon appears on device like other app icons

Page 22: Startups And Their Way From AMP to PWA (In 7min)

Confidential & Proprietary

PWAs can work across browsers

Using standard progressive enhancement techniques, PWAs can be made to work across all modern browsers

Page 23: Startups And Their Way From AMP to PWA (In 7min)

Confidential & Proprietary

AliExpress is seeing increased engagement across browsers

74% increase in time spent overall and...

82% more conversions on iOS

Page 24: Startups And Their Way From AMP to PWA (In 7min)

Confidential & ProprietaryConfidential & Proprietary

Simplicity

Page 25: Startups And Their Way From AMP to PWA (In 7min)

Typing on mobile is hard

Page 26: Startups And Their Way From AMP to PWA (In 7min)

Asking users to sign in today is hard

of users give up if they are unable to sign in

92%

Page 27: Startups And Their Way From AMP to PWA (In 7min)

Chrome already helps users sign in more easily

8B Sign-ins are assisted by Chrome’s password manager a month

Page 28: Startups And Their Way From AMP to PWA (In 7min)

One-tap sign in

Page 29: Startups And Their Way From AMP to PWA (In 7min)

Auto sign in

Page 30: Startups And Their Way From AMP to PWA (In 7min)

66% Of mobile purchases are on the web

...but conversionlags behind

other platforms

-66%Mobile web vs desktop web conversion rate

Page 31: Startups And Their Way From AMP to PWA (In 7min)

How to close the mobile web conversion gap?

Web Today

Make checkout forms

less painful

Autofill

Next Generation

Eliminate checkout

forms entirely

PaymentRequest

API

Page 32: Startups And Their Way From AMP to PWA (In 7min)

Autofill

Fill payment forms in one-tap

Cards/Addresses Synced

Zero merchant integration

Increase form submission rate

More: checkout-faster-with-autofill

Page 33: Startups And Their Way From AMP to PWA (In 7min)

PaymentRequest API

Open Javascript API

Browser handles payment collection

Cross Browser / Cross Platform

Any form of Payment

Single Click Checkout UI

Page 34: Startups And Their Way From AMP to PWA (In 7min)

Be Strong!

Thank you!