ホスピタリティ スタートアップが、ウェブ コンテンツを活用した Android アプリを構築し、ユーザー エンゲージメントを大幅に高め、ファイルサイズを抑えた方法
2013 年に設立された OYO Rooms は、80 か国以上の数百の都市にホテルを展開する、インド最大のホスピタリティ企業の一つです。この成功は、オンライン予約をできるだけ迅速かつ簡単にしたことが要因のひとつです。
OYO チームは、この目標を達成するために、最近までプログレッシブ ウェブアプリ(PWA)と Android アプリの両方を提供していました。Android アプリのエンゲージメントは大幅に高く、ユーザーのコンバージョン率は PWA を使用したユーザーの 3 倍でした。一方で、ユーザーはストレージ容量の懸念から、Android アプリを削除する傾向もありました。
Android エクスペリエンスのメリットを維持しながら、ユーザーのデバイスに対する Android アプリのフットプリントを削減するため、チームは Trusted Web Activity(TWA)に注目しました。
TWA とは何ですか?
Chrome 72 より前は、プラットフォーム固有のアプリでウェブ コンテンツを表示したい Android デベロッパーは WebView を使用せざるを得ませんでした。WebView には、Chrome ほど高速ではなく、Chrome の API と機能の一部が含まれていないという重要な制限がありました。そのため、WebView のレンダリング エンジンがサポートしていない動作が必要な場合は、WebView をベースに独自のブラウザを構築する必要がありました。これは決して簡単なことではありません。
Trusted Web Activity(TWA)は、Chrome でウェブ コンテンツを直接表示することで、これらの制限に対処します。TWA の名前を分解すると、その機能が説明できます。 - アクティビティは、Android アプリのユーザー インターフェースの 1 つの画面またはビューです。- TWA は Chrome を使用して、アプリのアクティビティのウェブ コンテンツを表示します。- TWA のコンテンツは信頼できるものであり、Digital Asset Links を使用して、Android アプリとそのアプリが表示するウェブ コンテンツを同じユーザーが作成したことを確認します。
プラットフォーム固有のアプリではなく TWA を作成する理由
ますます多くの Android アプリが、デベロッパーの独自のウェブサイトからコンテンツを提供しています。TWA は、プラットフォーム固有のアプリとウェブアプリの両方の長所を活かすことで、この現実を認識しています。
- ランチャー アイコン、プッシュ通知、全画面表示など、Android アプリに期待されるすべての機能を備えています。
- Chrome のパフォーマンスと機能を提供します。
- デバイスにインストールされているバージョンの Chrome を使用するため、常に最新の API と機能を利用できます。
- プラットフォーム固有のアプリよりもストレージの使用量が大幅に少なく、特にローエンドのデバイスを使用しているユーザーにとって懸念事項となっています。
Chrome で実行することには、便利なメリットもいくつかあります。たとえば、TWA は Chrome のストレージ(Cookie、パスワード、Web Storage API を使用して保存されたものなど)を共有します。この設定の利点の一つは、ユーザーがブラウザと 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 を作成した方法について詳しくは、Ankit Jain の Medium での投稿をご覧ください。すべての Android ユーザーがアクセスできるスプラッシュ画面を作成するアプローチについて詳しく説明しています。
TWA が OYO のユーザーのニーズを満たすうえでどのように役立ったか
OYO チームは、アプリアセットのほとんどを Chrome のキャッシュに保存することで、OYO Lite の初回ダウンロード サイズを 850 KB に抑えることができました。これは Android アプリのサイズの 7% にすぎません。
小さなフットプリントと、Google Play ストアからダウンロードできる Android アプリの利便性が相まって、ユーザー エンゲージメントが大幅に向上しました。
- PWA のコンバージョン率の 3 倍のコンバージョン率
- ログイン ユーザー数が PWA の 3 倍(平均)
- Google Play ストアでの評価 4.1
また、ユーザー向けのメリット以外にも、TWA を選択することで、チームは 1 つのコードベースのみを管理できるため、ユーザーが最新バージョンのアプリをダウンロードするのを待たずに簡単に更新できます。
独自の TWA を作成する
OYO のオンライン予約プラットフォームは、TWA のユースケースの一つにすぎません。ショッピング カートや購入手続きフローからよくある質問やお問い合わせフォームまで、現在プラットフォーム固有のアプリやウェブページとして構築されている多くのプロジェクトに適しています。
TWA の利用を開始するには、次のリンクをご覧ください。