ホスピタリティ業界のスタートアップが、ユーザー エンゲージメントを大幅に高め、ファイルサイズを小さく抑えるために、ウェブ コンテンツを利用する Android アプリを構築した方法
2013 年に設立された OYO Rooms は、インド最大級のホスピタリティ企業であり、80 か国以上の数百もの都市にホテルを擁しています。この成功の一因は、オンライン予約のエクスペリエンスを可能な限り迅速かつ簡単に実現したことにあります。
OYO チームは最近まで、この目標を達成するためにプログレッシブ ウェブアプリ（PWA）と Android アプリの両方を提供していました。Android アプリのエンゲージメントは大幅に高く、ユーザーは PWA を使用した場合の 3 倍のコンバージョンを達成しています。しかし、保存容量に関する懸念から、時間の経過とともにユーザーが Android アプリをアンインストールする傾向もありました。
Android エクスペリエンスの利点を維持しながら、ユーザーのデバイス上の Android アプリのフットプリントを削減するために、チームは Trusted Web Activity（TWA）を採用することにしました。
TWA とは
Chrome 72 より前では、Android デベロッパーは WebView を使用する必要がありましたが、これにはいくつかの重要な制限がありました。そのため、WebView のレンダリング エンジンでサポートされていない動作が必要な場合は、それを中心に独自のブラウザを構築する必要がありますが、これは簡単なことではありません。
Trusted Web Activity（TWA）は、ウェブ コンテンツを Chrome に直接表示することで、こうした制限に対処します。TWA 名を切り分けると、TWA の機能を説明するのに役立ちます。 - アクティビティとは、Android アプリのユーザー インターフェースにおける 1 つの画面またはビューです。- TWA は Chrome を使用して、アプリのアクティビティ用のウェブ コンテンツを表示します。 - TWA のコンテンツは、デジタル アセット リンクを使用して、Android アプリとそのアプリに表示されるウェブ コンテンツの作成者が同じであることを確認できるため、信頼できるコンテンツです。
プラットフォーム固有のアプリではなく TWA を作成する理由
デベロッパーのウェブサイトからコンテンツを配信する Android アプリはますます増えています。TWA は、プラットフォーム固有のウェブアプリとウェブアプリの機能を最大限に活用することで、この事実を認識しています。
- ランチャー アイコン、プッシュ通知、全画面表示など、Android アプリに期待される機能をすべて備えています。
- Chrome と同じパフォーマンスと機能を提供します。
- 使用する Chrome のバージョンはデバイスにインストールされているため、常に最新の API と機能を利用できます。
- アプリはプラットフォーム固有のアプリよりも使用するストレージが大幅に少なくて済みます。これは多くのユーザー、特にローエンド デバイスのユーザーにとって重要な問題です。
Chrome で実行すると、便利な機能も多数あります。 たとえば、TWA は、Cookie、パスワード、Web Storage API を使用して保存されたデータなど、Chrome のストレージを共有します。この設定の利点の 1 つは、ユーザーがブラウザと TWA アプリにログインしたままになることです。
OYO Lite をビルドする
OYO チームは、デバイス ストレージを犠牲にすることなく、フル機能のアプリ エクスペリエンスを提供したいと考え、既存の PWA をベースに構築された TWA である OYO Lite を作成することにしました。
PWA から始めることが重要です。ユーザーは、Android ランチャーから実行するアプリにフル機能のエクスペリエンスを期待しているため、TWA で配信されるウェブ コンテンツは、次のようなエクスペリエンスを提供する必要があります。
- 読み込み時間と応答時間が速い
- ユーザーの接続が制限されているか接続できない場合の信頼性
- 統一感のあるデザイン（スプラッシュ画面やアプリの色などを用意する）
すでに PWA をお持ちの場合、Android 向けの開発が初めてでも、基本的な TWA の作成手順は少ない労力で設計されています。OYO チームは次のように実施しました。
- アプリが oyorooms.com のコンテンツを表示できるように、
DEFAULT_URLとインテント フィルタを含む Android マニフェスト ファイルを作成しました。 - デジタル アセット リンク検証を使用して、ブラウザの URL バーを削除しました。
- ランチャー アイコンを作成しました。
- カスタム スプラッシュ画面を作成。
次の結果が表示されます。
基本的な TWA の作成に関する詳細なチュートリアルについては、Peter McLachlan と Andre Bandarra の Google I/O 2019 での TWA の講演をご覧ください。
OYO チームが OYO Lite をどのように作成したかについての詳細（すべての Android ユーザーがアクセスできるスプラッシュ画面を作成するアプローチの詳細など）については、Ankit Jain の Medium への投稿をご覧ください。
OYO がユーザーのニーズに応えるうえで TWA がどのように役立ったか
OYO チームは、アプリアセットのほとんどを Chrome のキャッシュに保存することで、OYO Lite の初期ダウンロード サイズを 850 KB に抑えることができました。これは、同社の Android アプリのサイズのわずか 7% にすぎません。
フットプリントが小さいことと、Google Play ストアからダウンロード可能な Android アプリを利用できることから、ユーザー エンゲージメントが大幅に向上しました。
- コンバージョン率は PWA の 3 倍
- ログイン ユーザー数が平均で PWA の 3 倍
- Google Play ストアでの評価が 4.1 である
ユーザーにとってのメリットは別として、TWA を使用することにより、チームはコードベースが 1 つしかなく、ユーザーが最新バージョンのアプリをダウンロードするのを待たずに簡単に更新できました。
独自の TWA を作成する
OYO のオンライン予約プラットフォームは、TWA のユースケースの 1 つにすぎません。ショッピング カート、購入手続きのフロー、よくある質問、お問い合わせフォームなど、現在プラットフォーム固有のアプリやウェブページとして構築されている多くのプロジェクトに適しています。
TWA を開始するには、次のリンクを確認してください。