プログレッシブ ウェブアプリとは

プログレッシブ ウェブアプリ(PWA)は、最新の API で構築、強化されたウェブアプリで、機能を強化しながら、単一のコードベースであらゆるデバイスのウェブユーザーにリーチできます。ウェブアプリの広範なリーチとプラットフォーム固有のアプリの豊富な機能を組み合わせて、ユーザー エクスペリエンスを向上させます。

PWA デザインの 3 つの柱

PWA をプラットフォーム固有のアプリと同じように使用できるようにするには、機能性、信頼性、インストール性を考慮して設計する必要があります。

有能

ウェブ アプリケーションの機能性はかつてないほど向上しており、その機能は拡大する一方です。最近では、これまでプラットフォーム固有のアプリしかアクセスできなかったウェブ向けソフトウェアの機能の開発が始まりました。たとえば、WebRTC、位置情報、プッシュ通知を使用してハイパーローカルなビデオチャット アプリを構築し、そのアプリをインストール可能にして、WebGL と WebVR を使用して会話をバーチャル リアリティに移行できるようになりました。WebAssembly の導入により、デベロッパーは C、C++、Rust などの他のエコシステムを活用し、これまでプラットフォーム固有の機能を何十年もウェブに提供できます。ウェブの新機能を活用しているデベロッパーの好例は、ウェブベースの画像圧縮ツール Squoosh.app です。

一部の機能はウェブでまだ利用できませんが、今後リリースされる新しい API では、ファイル システムへのアクセス、メディア制御、アプリのバッジ、クリップボードの完全サポートなど、ウェブの機能を拡張し続けています。これらの機能はすべて、ウェブの安全なユーザー中心の権限モデルを使用して構築されているため、ユーザーの安全を守り、新しいウェブサイトを使用する際の不安を軽減できます。

信頼性

信頼性の高いプログレッシブ ウェブアプリとは、ネットワークに関係なく高速で信頼できるアプリです。ユーザーには、操作にすばやく反応するアプリと信頼できるエクスペリエンスが必要です。

ユーザーに利用してもらうには、スピードが重要です。実際、ページの読み込み時間が 1 秒から 10 秒に増加すると、ユーザーが直帰する可能性は 123%上昇します。パフォーマンスの問題は、onload イベントだけでなく、ユーザー エクスペリエンス全体に影響します。信頼性の高いエクスペリエンスでは、アプリとのインタラクションが登録されたかどうかをユーザーが不思議に思わせることはありません。スクロールとアニメーションは滑らかにする必要があります。ユーザーは、アプリのパフォーマンスを必要な水準に保ちながら実際に高いパフォーマンスを実現できると認識する必要があります。

また、信頼できるアプリは、ネットワーク接続に関係なく使用できることも重要です。ユーザーは、ネットワーク接続が遅い、不安定な場合、あるいはオフラインであっても、アプリがすばやく読み込まれることを期待しています。ユーザーは、メディア トラック、チケット、旅行プランなど、アプリでサーバーへのリクエスト送信に問題が発生した場合でも、操作した最新のコンテンツが利用できることを期待します。リクエストを実行できない場合、ユーザーは通知なく失敗したりクラッシュしたりするのではなく、問題があることをアプリが通知することを期待します。

インストール可能

PWA をインストール可能にすると、PWA はブラウザからスタンドアロン ウィンドウに移動し、ユーザーの考えや操作の仕方が変わります。インストール済みの PWA は、ユーザーのホーム画面、ドック、タスクバー、シェルフから起動できます。ユーザーは、デバイス上でアプリを検索し、アプリ スイッチャーを使用してそれらの間を行き来できるため、インストールされているデバイスの一部であるかのように感じられます。

PWA をインストールすると、キーボード ショートカットなど、通常はブラウザで予約される新機能も利用できるようになります。PWA は、他のアプリのコンテンツを受け入れるように登録することも、特定のファイル形式を処理するデフォルトのアプリケーションとして登録することもできます。

PWA から結果を取得する

PWA のリリースは、ユーザー エクスペリエンスの向上だけではありません。また、指標が改善され、サービスから得られる価値も増加します。代表的な例には次のようなものがあります。

  • Twitter の PWA により、セッションあたりのページ数が 65% 増加し、ツイート数が 75% 増加し、直帰率が 20% 減少しました。また、アプリのサイズを 97% 以上削減できました。
  • 日経では、PWA への切り替え後、オーガニック トラフィックが 2.3 倍に増加し、サブスクリプションが 58% 増加、1 日あたりのアクティブ ユーザー数が 49% 増加しました。
  • Hulu では、プラットフォーム固有のデスクトップ エクスペリエンスを PWA に置き換えることで、再訪問が 27% 増加しました。

PWA を使用するメリットについて詳しくは、プログレッシブ ウェブアプリがビジネスを成功に導く仕組みをご覧ください。