はじめに
2020 年の初め、モバイルとパソコンの Chrome チームは、インストール済みのウェブアプリの見つけやすさとエンゲージメントを向上させる計画を策定しました。この取り組みの結果、PWA のインストールとエンゲージメントが 100% を超えるようになりました。これは、既存の機能を調査し、A/B テストとユーザー インタビューを実施して、ユーザーの認識と期待についてのインサイトを得ることで実現しました。この記事では、その経緯を説明します。
インストール言語の統一
PWA のインストールをトリガーする行動を促すフレーズが、ウェブ プラットフォーム間で一貫していません。Android 版の Chrome では [ホーム画面に追加] を選択しましたが、デスクトップ プラットフォームでは [インストール] を重視しました。この相違の根拠は、チームが 2016 年にさまざまな文字列を比較した調査に基づいています。その結果、ホーム画面に追加機能の動作は、モバイルではわずかにでも十分であることが判明しました。
2019 年の分類に関するさらなる調査では違いが見られなかったため、PWA のインストール エクスペリエンスを統合したいと考えているチームは、ラベルを「Android にインストール」に更新することを決定しました。2021 年に実施したさらなる調査では、「Install」、「Get」、「Download」という表現が比較されました。その結果、ユーザーが「インストール」を、実際に起きているプロセスとして理解していることがわかりました。ユーザーは、[Get] というラベルのボタンをタップするとウェブサイトにリダイレクトされ、[Download] を使用してファイルはダウンロード フォルダまたは同等のものに保存されると思いました。
こうした点を踏まえて、[インストール] ラベルは PWA に最も適していると結論付けました。ウェブ プラットフォーム全体では、優先文字列として「インストール」を採用することをおすすめします。
デスクトップ上のインストール アイコン
Google のデスクトップ プラットフォームでは、ウェブサイトで PWA が読み込まれるたびに Chrome のアドレスバーの右側に、アイコンと [インストール] というラベルが付いたピルが表示されるというデザイン パターンを採用しています。その後、ユーザーがサイトにアクセスした場合は、アイコンだけが表示されます。このピルをクリックすると、デスクトップ PWA のインストールがトリガーされます。
このアイコンは元々はプラス記号でした。これは、モバイルで使用されていた「ホーム画面に追加」というメタファーがあったことです。ただし、ここで使用した言語は「インストール」でした。デベロッパー コミュニティからは、このアイコンがわかりにくいというフィードバックが寄せられました。さらに、ユーザーがズーム機能を使用してテキストを拡大すると、ズームのアイコンが非常に似通ったため、ユーザーはさらに混乱します。
ほとんどのフィードバックは経験に基づくもので、ユーザーの認識を調査することにしました。Google は UX 研究者と共同で、米国とインドネシアの 10,000 人のユーザーを対象に、インストールのアイコンに関するユーザーの理解度を確認する調査を実施しました。既存のものを含む 5 つの異なるデザインをテストし、ユーザーに「インストール」の意味を尋ねました。現在のアイコンであるプラス記号がユーザーにとって最もわかりにくいものであることがわかりました。多くの人がこの記号を「薬」、「応急処置」、「電池」と混同していました。
また、ユーザーは主に矢印やデバイスなどの画像をインストールに関連付けていることがわかりました。これらの結論に基づいて、Chrome で A/B/C テストを実施して、既存のデザインを 2 つの代替案と比較しました。モニターを指している矢印が 他の 2 つよりも大幅にパフォーマンスが優れていましたまた、この新しいアイコンにより、インストール UI を閉じる回数も減少しました。
その結果、現在のデザインで、ウェブサイトにおける PWA のインストール率が 2 倍以上に向上しました。また、このアイコンと、マテリアル デザイン アイコンセットに相当するモバイル機能を追加して、最も魅力的なアイコンをコミュニティで使用できるようにしました。
もちろん、1 つのアイコンで世界が変わることはありません。そのため、次の機能に進みます。
サービス内ヘルプ
サービス内ヘルプは、青色のふきだしのツールチップで、特定の条件に基づいてユーザーが興味を持つ可能性がある新機能についてユーザーにオンボーディングできます。今回のデザイン パターンのリリースは、ユーザーにインストール機能について通知するとともに、新しいアイコンのデザイン変更をサポートすることを目的としています。
ユーザーが定期的にウェブサイトにアクセスしている場合、Chrome はサイト エンゲージメントと呼ばれるサービスを使用します。ユーザーがサイトに対してどの程度関心を持っているかに関する情報を確認できます。chrome://site-engagement/ にアクセスすることで、よく閲覧するサイトを確認できます。このスコアから、ユーザーがウェブサイトに興味を持っているかどうかを判断できます。サイトが PWA で、ユーザーが操作している場合は、インストール サービス内ヘルプ UI を表示します。サイトに 1 回だけアクセスしてユーザーが煩わしさを感じることなく、関心の高いユーザーのみに焦点を絞ることができました。
パソコン版のプロダクト内ヘルプを使用することで、PWA のインストールが 100% 以上増加しました。これは、エンゲージメントの高いユーザーに焦点を当てることで、ウェブアプリのインストール可能性が向上したことを示しています。
インストール UI の拡充
ほとんどのユーザーにとってのインストール パラダイムはストアです。 2000 年代半ばから、Google はユーザーがアプリをインストールするたびに、説明やスクリーンショット、その他のメタデータを見ることで、そのアプリを本当に必要かどうか判断できるようにしてきました。
PWA では、ユーザーがウェブアプリのインストールを決定したときに表示される UI は比較的少数でした。そこでチームは、ウェブアプリに関するコンテキストをユーザーに提供し、デベロッパーがネイティブ エクスペリエンスと同等の PWA を活用できるように、より充実したインストール エクスペリエンスの提供を検討することにしました。
今年、Richer Install をリリースしました。これは、デベロッパーがスクリーンショットをマニフェストに追加できるようにする、Android の Chrome の拡張インストール UI です。デベロッパーは説明を追加することもできます。説明を追加できますが、これは必須ではありません。この新しい UI により、一部の PWA のインストール率は 2 倍になりました。これは、コンテキストやエクスペリエンスが充実すれば、ユーザーはウェブアプリをより自信を持ってインストールできることを示しています。この UI のデスクトップ版は現在開発中です。
まとめ
チームはこの 2 年間、PWA 開発者を支援して強化し、ウェブ エクスペリエンスの利点をユーザーに伝えるのに役立つ Chrome の新機能を調査し、実験してきました。まだまだ多くの可能性がありますが、協力することでユーザーの生活を改善し豊かなものにし、オープンウェブをさらに支援することができます。