Google Play Instant 版アプリの UX に関するおすすめの方法

Google Play Instant を使用すると、ユーザーがアプリを新しい方法で利用できるようになります。こうしたアプリは Instant App と呼ばれ、ネイティブの Android アプリですが、デバイスにインストールしなくても実行されます。各 Instant App には、ユーザーがインストール可能な、対応す��バージョンが���ります。

Instant Apps はユーザー操作に固有の方法であるため、特定のユーザー エクスペリエンスの慣行を遵守する必要があります。このガイドでは、Instant App で良好なユーザー エクスペリエンスを実現するためのガイドラインを示します。

Instant App を設計する際は、マテリアル デザインの原則を使用することを強くおすすめします。アプリにマテリアル デザインを適用する方法については、Android 用のマテリアル デザインをご覧ください。

また、ゲームアプリに固有のガイドラインも用意されています。詳しくは、Google Play Instant 版ゲームの UX に関するおすすめの方法をご覧ください。

 

アプリにわかりやすいランディング スクリーンを用意する

図 1. Instant App に表示される [今すぐ試す] ボタン

アプリやゲームの Play ストアに [今すぐ試す] ボタンを表示する、または Android ランチャーに表示されるようにするには、デフォルトのメイン アクティビティが必要です。

[今すぐ試す] またはランチャーからアプリに入ったユーザーには、アクセスしようとしているディープリンクのコンテキストや特定のコンテンツがありません。そのため、ユーザーがアプリの機能を閲覧して検出できる場所を用意する必要があります。

また、アプリの名前を画面に目立つように表示することもおすすめします。ユーザーは、十分な文脈がない状態でアプリへのリンクをクリックすることがあるため、アプリ名がわからない場合があります。

 

リンクの代替リンク先を確認する

図 2. ユーザーを Instant App に誘導するウェブサイト バナー

Google Play Instant のアプリやゲームへのリンクは、可能な限りすぐに開きます。 そうでない場合は、代替手段としてブラウザで開きます。

Google Play にリンクすることで、代わりに Play ストアに移動するようにフォールバック シナリオを変更できます。この戦略は、ユーザーがアプリをすぐに開かず、ウェブ上でアプリを使用してほしくない場合は、アプリをダウンロードするようユーザーを誘導したい場合に便利です。

別の方法として、ユーザーを Google Play ストアに誘導する代わりに、ウェブサイトのバナーを使用してアプリを直接開くこともできます。この方法を図 2 に示します。

ユーザーがタスクを完了できるようにする

Instant App でユーザーに機能をアドバタイズする場合、ユーザーがアプリをインストールしなくてもその機能を利用できるようにします。

目的を達成できるように、ユーザーにアプリのインストールを求めることは避けてください。アプリ内のページの主要なクリックスルー アクションでインストール プロンプトをトリガーしないでください。

図 3. ユーザーにアプリのインストールを促すことなく、特定のタスクを完了できるようにします。

 

適切なタイミングでユーザーにログインを求める

アプリに関連するサービスへのログインや登録を必要とせずに、可能な限り多くの機能を提供する。

認証を必要とする機能をユーザーが使用しようとするまで待ってから、ログインを求めるようにします。ログインのメリットがすぐにわかれば、ユーザーはログイン プロンプトの煩わしさを軽減できると感じます。

たとえば、起動時にユーザーにログインを求める写真共有アプリについて考えてみましょう。ユーザー エクスペリエンスを向上させるため、一般公開されている写真を閲覧する、デバイス上の写真を編集するなど、ユーザーがログインせずに使用できる機能を用意しました。友だちと写真を共有しようとすると、ログインを求められます。

図 4. 不要なログイン プロンプトを使用しないようにします。

 

ユーザーの状態をアプリのインストール後も保持する

ユーザーがアプリをインストールしたら、必ず Cookie またはローカル ストレージを使用して、保存されているアプリの状態をアプリに転送します。図 5 に示すように、ユーザーがアプリで中断したところから再開できるようにする必要があります。

図 5.インストール後にユーザーの状態を復元する
 

追加のスプラッシュ画面を作成しない

Instant App ��起動エクスペリエンスには、アプリのブランディング、アプリのタイトル、アプリ ランチャー アイコンが組み込まれています。ユーザーにとって不要なため、独自のスプラッシュ画面を追加作成しないでください。

図 6. Google Play Instant フレームワークは、アプリの起動エクスペリエンスを提供します。

 

アップボタンとシステムの [戻る] ボタン

[上へ] ボタンは、ユーザーがアプリのホーム画面に到達するまで、アプリのナビゲーション スタック内を上に移動します。[戻る] ボタンを使用すると、最近表示した画面の履歴を逆時系列順に移動できます。

上へボタンはユーザーをアプリ内に留めますが、戻るボタンによりアプリ外の最近の画面に戻ることがあります。つまり、ボタンを押してもアプリが終了することはありません。

[戻る] ボタンと [上へ] ボタンを使用したナビゲーションを設計する方法について詳しくは、「戻る」ナビゲーションと「上へ」ナビゲーションの設計をご覧ください。

図 7. ナビゲーションが鍵となります。

 

UI を統一する

Instant App の UI は、インストール バージョンの UI と同じである必要があります。Instant App のデザインや UI は変更しないでください。

図 8.インストール版と Instant App の間で一貫した UI を維持する
 

Android での本人確認には Smart Lock for Passwords を使用する

Android の Smart Lock for Passwords は、Chrome と Android で使用できるパスワード マネージャーです。また、Smart Lock はそれ以降の訪問時にユーザーを自動的にログインさせます。ユーザーの認証を容易にするために、Instant App で Google Smart Lock をサポートします。

図 9. 認証には Smart Lock を使用します。

 

明示的なインストール メッセージを表示する

インストール ボタンをアプリのユーザー インターフェースの一部にして戦略的に使用する。インストール ボタンには、マテリアル デザインの「アプリをダウンロード」アイコンINSTALL ラベルを使用します。

「アプリを入手」、「完全版のアプリをインストール」、「アップグレード」などの他のラベルは使用しないでください。バナーなどの広告のような手法を使用して、ユーザーにインストール プロンプトを表示しないでください。

図 10. インストール ボタンを戦略的に使用する

 

暗黙的なインストール メッセージを 2~3 個に抑える

暗黙的なインストール プロンプトとは、インストール プロンプトの起動以外を行わない Instant App 内のリ��クです。こうした暗黙的なインストール プロンプトは、Instant バージョンにはない機能がインストール版アプリに含まれている場合に表示されることがあります。

暗黙的なインストール メッセージは 2~3 個に抑えるようにします。

暗黙的なインストール プロンプトを使用する場合は、プロンプトをトリガーした機能に関するコンテキストと情報をご提供ください。ユーザーがアプリをインストールする理由を提示します。

図 11. 暗黙的なインストール プロンプトの数を制限する。

 

アプリの機能しないセクションを削除する

アプリを Instant App に変換すると、Instant App の UI の一部がアプリの他の機能モジュールにリンクしている場合があります。そのようなセクションは Instant App から削除してください。

図 12. アプリの機能しない部分を削除します。

 

支払いの煩わしさを減らす

Instant App での購入が Google Play 請求サービスでサポートされておらず、ユーザーのお支払い情報も登録されていない場合は、Google Pay API などの別の支払い API を使用できます。Google Pay API を使用すると、代金引換などの純粋なオフライン支払いを行ったり、Instant App にギフトカードを保存したりできます。

図 13. Google Pay API を使用した支払いワークフロー

 

サードパーティのサービスやコンテンツへのリンクは、Chrome のカスタムタブまたはブラウザで開くことができます。リクエストされたリソースが HTTPS プロトコルで提供される場合は、WebView を使用してレンダリングできます。

独自のサービスはブラウザにリンクするのではなく、必要に応じて WebView を使用して、Instant App 内にとどまるようにします。Instant App 内からのネットワーク トラフィックはすべて、HTTPS プロトコルを使用する必要があります。

Instant App 内では、アプリが提供する機能と外部ソースから提供される機能を明確に定義する必要があります。

図 14. 管理していない外部リンクをブラウザで開きます。

 

Instant App の URL の共有手段を提供する

Instant App には、ユーザーが URL をコピーするためのアドレスバーは用意されていないため、ユーザーが Instant App の URL を共有できる「共有」アクションをアプリ内で提供します。

図 15. ユーザーが Instant App を共有できるようにします。

参考情報

高品質の Instant エクスペリエンスの作成について詳しくは、以下のリソースをご覧ください。

Codelab