合同会社バックアップ
Blog

ブログ

Googleが推す「PWA」とは? iOS16からプッシュ通知も可能に

アプリで失敗しないためのポイント
2022.06.14
Contents
目次を非表示

    (2022 年 6 月更新)

    以前から情報自体は出ていましたが、WWDC22 にて「iOS が Web Push に対応する」ことが正式に発表されました。

    Apple 公式サイト内の iOS 16 Preview にも「Adds support for opt‑in notifications on iOS. Coming in 2023.」と明記されています。

    PWA の発表自体から実は 7 年ほど経っていますが、このニュースによって日本国内でも PWA が再注目され始めています。

    そこで、今回は iOS/Android アプリ開発案件が多い会社の立場から、PWA の定義・役割・メリットなどまず知っておきたい情報をまとめました。

    1. PWA とは? Webアプリ/ネイティブアプリとの違い

    PWA (Progressive Web Apps) とは、Google が提案する概念で、Web ブラウザ上でネイティブ(スマホ)アプリのようなユーザー体験を提供する高機能な Web アプリです。

    事例としては、顧客のスマホに “インストール” してホーム画面上にショートカットを作成したり、プッシュ通知を配信したり、オフラインでも一定の動作ができるといった機能を実装されることが多いです(詳細は後述)。

    スマホアプリの代替品・モバイルフレンドリー施策の一貫というイメージも強いですが、Google としては PC・タブレット・スマートフフォンすべてのデバイス/ブラウザでも快適に利用できるユニバーサル展開を推奨しています。

    また、Google 側も「PWA は特定の基準を満たせばインストール可能にもできる」というような表現をしていることから、インストールできることも必須条件ではありません。

    PWA という概念は「Web をもっとユーザーにとって便利にしよう」という思想がベースにあり、(Service Worker を利用するという点以外に)機能面での厳格な定義はないようにも見えます。

    • Web アプリ = Web ブラウザ上で情報を見せるだけでなく、さまざまな機能を利用できるアプリケーション(大枠では Web サイト)
    • SPA(Single Page Apps) = 一つのページ内で全コンテンツを読み込み、動作を高速化する Web アプリ。通称「スパ」
    • PWA (Progressive な Web Apps) = よりネイティブアプリらしい UX を提供する Web アプリ
    • App Clips = iOS アプリをインストールしてもらうために Web 上で動作させている、ネイティブアプリの一部分(機能) ※スマホアプリが必須

    1-1. AMP とともに、Android をメインに数年前から注目

    PWA は 2015 年、Google Chrome のエンジニア(当時)によって提唱されました

    Google は PWA の普及に熱心で、Google Developpers 内に充実した公式ドキュメントが整備されました。

    今ではドキュメント類が Web 分析ツールである web.dev 内に移行されましたが、このガイドライン自体は 2020 年に整備されているので、2023 年の Apple の対応によって改めて注目を集めています。

    公式ガイドプログレッシブウェブアプリ (web.dev)

    App Store が収益源になっている Apple の「アプリありき」の姿勢に対し、広告会社である Google は「Web を快適に」という姿勢が見えていました。

    そのため、PWA のリリース直後の 2018-19 年頃は、ページ読み込みを高速化する AMP と組み合わせた「PWAMP」なるものも提唱していました。

    1-2. 2022 年までは「のらりくらり」の対応だった Apple

    2018 年 3 月にリリースされた iOS 11.3 から、Apple は (Google の提案である) PWA に対応しました。

    この時点では「端末にインストールしてホーム画面のアイコンから起動できる」「ローカルにデータを保存できる」という程度で、プッシュ通知をはじめバックグラウンド同期、アプリ内課金など主要な機能には対応していませんでした。

    2019 年 9 月の iOS 13 では Apple Pay を使った決済、URL を表示するツールバーを隠したネイティブ風 UI を実現可能にしたものの、それでも PWA 本来の世界観に近づいたとは言えませんでした。

    参考

    そんな中で 2022 年初頭から「ついに」というニュースが報じられ、Safari が Web PUSH に対応する旨が正式に発表されたことで、開発者の間でも話題になりました。

    とはいえ、Apple が対応を先送りにした結果、「多くの PWA は(波が来た際に作られたものの)、その後アップデートされていないままになっている」とも言われています。今後日本企業がどこまで PWA に新規対応・追加対応するかは要注目といえます。

    1-3. Apple が発表した、2022/2023 年 (iOS 16) からの対応内容

    2022 年 6 月の WWDC の内容をまとめると

    • まずは macOS から iOS 16 のリリース時にアップデート
    • ユーザーが Safari を開いていないときにも PUSH 配信が可能
    • 通知の送信にはユーザーごとに許諾が必要
    • iOS/iPadOS は 2023 年〜(内容が同じかは不明?)

    とのこと。

    Web Push is coming to Safari 16 on macOS Ventura. This lets you remotely send notifications to users of your websites and web apps — and deliver those notifications even when Safari isn’t running. It uses the same combination of web standards you may be familiar with from other browsers: Push API and Notifications API, along with Service Worker.

    Users opt into notifications by first indicating interest through a user gesture — such as clicking a button. Then, they’ll be prompted to give permission for your site or app to send notifications. Users will be able to view and manage notifications in Notifications Center, and customize styles and turn notifications off per website in Notifications Settings.

    Web Push in Safari uses the same Apple Push Notification service that powers native push on all Macs and iOS devices. If you tightly manage push endpoints on your server, be sure you allow URLs from any subdomain of push.apple.com. You do not need to be an Apple Developer Program member.

    And look for Web Push for iOS and iPadOS in 2023.

    出典

    なお、Web PUSH 配信にブラウザ上での許諾が必要なことは Android (Google) がすでに宣言済で、iOS/Android 共通の仕様となります。

    2. PWA ができること(対応してない SPA/Web アプリとの違い)

    一般的に、Web サイトを Web アプリ化するメリット/役割としては

    • Web サイトとして広く集客しながらアプリに近い UI/UX を提供
    • ホーム画面にアイコンを追加すると、次回からワンタップで起動できる(ネイティブアプリ同様の特長)
    • アプリに近い UX ではあるが、顧客にとってはインストールの手間がない
    • 企業も iOS/Android の両方のコードを書き分けることなく、Web 用の単一コードで開発〜管理できる(開発/保守費用の削減)

    という点が挙げられます。

    「インストール不要」「一つのコードで iOS/Android 両方に対応」という点は、LINE ミニアプリなど類似サービスでも強調されています。

    一方、PWA の事例や Google の公式コンテンツを見ると、

    などが Web アプリへの付加価値として提案されています。

    参考

    とはいえ、Google のドキュメントに記載されている PWA の推奨機能は Android のみ、あるいは PC のみであるものも多いです。

    App Badging API などは可能性を秘めていますが、現状は PC 向けの機能となっています。

    3. PWA の事例とは? 海外では EC サイトを筆頭にマーケティング視点での事例も多数

    国内では日経電子版がいち早く PWA 化しましたが、

    • オーガニックトラフィックが2.3倍に増加
    • サブスクリプションが58%増
    • DAU が49%増

    という成果が Google 公式ドキュメント内で強調されています。

    iOS のシェアが強い国内に比べると PWA を積極的に開発してきた海外各国の事例は、「PWA Stats」というサイトで見ることができます。

    参考

    当然ながら成功事例しか掲載されないので参考程度に見ておくほうがいいですが、PWA 化のメリットの大枠はつかむことができそうです。

    • ページ読み込み速度の向上
    • AU・再訪ユーザーの増加
    • CVR の向上
    • 収益性の向上

    といった基本的な指標に加え、「PWA のインストールはアプリのダウンロードより 40% 高くなった」というデータも見逃せません(Lyft の事例)。

    まとめ. アプリ事業の立ち上げ前後には PWA などの知識も重要

    業態を問わず、顧客との継続的な接点をつくるために iOS/Android アプリを検討する企業は増えています。

    一方で、スマホアプリ事業には

    • 新規顧客の集客には不向き
    • 業態によってはイチ企業のアプリをインストールしてもらう難易度が高い(単価が低い店舗・来店頻度が低い業態など)
    • 初期構築費用・保守運用やパッケージの利用料金などは安くない

    という課題は残っています。ですので、Web PUSH への対応により PWA の実用性が高まったことから、

    1. アプリの「前段階」:ネイティブアプリの費用対効果が高くなさそうなケースで、アプリの代替品として PWA やミニアプリを構築
    2. アプリの「サポート」:新規集客やインストールの壁を超えるためのツールとして PWA やミニアプリを同時展開

    という両方のパターンで、PWA は注目を集める可能性があります。

    また、PWA だけでなく LINE ミニアプリ/App Clips なども含めた周辺領域は、アプリ事業を始める場合や運用中の企業にとって知っておくべき領域になるはずです。

    お手頃価格で簡単に自社アプリを開発~運用するなら
    img
    • 「自社アプリを考えているが、初期投資を抑えてまずは試してみたい」
    • 「LINE からの PUSH 配信で顧客と継続的に接点は作れているが、費用対効果が見合わなくなってきた」
    • 「安すぎるシステムだと動作速度や拡張性などが不安」

    といったお悩みを抱えている企業様に向けて、ノーコードでアプリを開発するサービス「PASTA」を展開しています。