TV デバイスでは、アプリ向けに一部のナビゲーション コントロールが提供されます。TV UI の効果的なナビゲーション スキームを作成するには、こうした限定的なコントロールを考慮し、ユーザーがタッチ スクリーンではなくリモコンボタンを使用して操作する方法を検討します。
ハイライト
- コントローラのナビゲーション機能（上下左右）は限られているため、この機能によってアプリの UI デザインをどのように形成できるかをよく検討してください。
- 操作が自然で使い慣れたものである必要があります。
- リモコンの戻るボタンで操作を簡単に行えるようにします。
- ユーザーがコントロールに確実に到達できる経路がない場合は、コントロールを移動することを検討してください。
原則
その目的は、ユーザー インターフェースを支配したり、コンテンツから注意をそらしたりすることなく、自然でなじみのあるナビゲーションを実現することです。以下の原則は、TV アプリ全体で一貫性があり直感的なユーザー エクスペリエンスのベースラインを設定する際に役立ちます。
効率的
コンテンツに素早く簡単にアクセスできるようにします。ユーザーは、最小限のクリックでコンテンツにすばやくアクセスしたいと考えています。画面数を少なくして情報を整理します。
予測可能
ベスト プラクティスと推奨事項に沿って、ユーザーがナビゲーションを予測できるようにします。ナビゲーション パターンを不必要に作り直さないでください。混乱や予測不可能性につながります。
直感的
広く採用されているユーザー行動にシームレスに対応できるよう、ナビゲーションをシンプルにします。ナビゲーションの不要なレイヤを追加して複雑にしすぎないでください。
コントローラ
コントローラには、シンプルなリモコンから複雑なゲーム コントローラまで、さまざまなスタイルがあります。すべてのコントローラに、十字キー（D-pad）、選択ボタン、ホームボタン、戻るボタンがあります。その他のボタンはモデルによって異なります。
- 十字キー（D-pad） - テレビの主なナビゲーション方法は D-pad です。D-pad には、上、下、左、右の十字キーがあります。
- 選択ボタン - 画面上の項目をフォーカスして選択します。 長押しすると、他のオプションを表示できます。
- ホームボタン - システムのホーム画面に移動します。
- [戻る] ボタン - 前のビューに戻ることができます。
- マイクボタン - Google アシスタントまたは音声入力を呼び出します。
D-pad によるナビゲーション
TV デバイスでは、ユーザーは上下左右の 4 方向の D-pad を使用して移動します。 最適な TV アプリを作成するには、ユーザーが 4 つの矢印キーでアプリの使用方法を簡単に習得できるナビゲーション スキームを設計します。D-pad は、ある要素から対応する方向の最も近い要素にフォーカスを移動します。
TV デバイスの D-pad でアプリのナビゲーションが適切に動作することをテストするには、次の点を考慮してください。
- ユーザーが画面上のすべてのフォーカス可能な要素に移動できることを確認します。
- ナビゲーションの方向がわかりやすく、予測可能であることを確認する。
- リストをスクロールする場合は、D-pad の上下ボタンを使用してリスト全体をスクロールし、各リスト項目を選択できるようにします。
ホームボタン
ホームボタンを押すと、常に Google TV のホームまたはランチャーに戻ります。現在のアプリは、デフォルトではバックグラウンドで一時停止します。
ホームボタンを長押しすると、Google TV にシステム ダッシュボードが表示され、Android TV にアプリグリッドが表示されます。デフォルトの動作はメーカーによって異なる場合があります。
戻るボタン
プラットフォーム上のアプリ間で一貫性を保つため、[戻る] ボタンの動作が以下のガイドラインに沿っていることを確認してください。
予測可能な [戻る] ボタンの動作を使用する
予測可能なナビゲーション エクスペリエンスを実現するには、ユーザーがリモコンの [戻る] ボタンを押したときに、前のデスティネーションに戻るようにします。ユーザーが戻るボタンを押し続けると、最終的には Google TV のホームまたはランチャーが表示されます。
ユーザーがすばやくスクロールしてページ上部に戻り、メニューにフォーカスする。
左側のメニューが有効になり、アクティブなメニュー項目にユーザーのフォーカスが移動します。
[戻る] ボタンが、確認画面や無限ループの一部によって制限されないようにします。
すべきでないこと
戻るボタンを表示しない
ハンドヘルド デバイスとは異なり、リモコンの [戻る] ボタンは、テレビで戻るときに使用します。画面に仮想の「戻る」ボタンを表示する必要はありません。
すべきでないこと
必要に応じてキャンセル ボタンを表示する
確認、破壊、購入などのアクションのみが表示されている場合は、前のデスティネーションに戻る [Cancel] ボタンを用意することをおすすめします。
すべきこと
ナビゲーション アーキテクチャ
固定的な開始デスティネーションを設定する
ユーザーがランチャーからアプリを起動したときに最初に表示される画面は、ユーザーが [戻る] ボタンを押してランチャーに戻ったときに表示される最後の画面でもあります。
ディープリンクの場合は手動ナビゲーションをシミュレーションする
ディープリンクを使用している場合でも、特定のデスティネーションに手動で移動する場合でも、ユーザーは [戻る] ボタンでアプリ内のどこからでも開始デスティネーションに移動できます。
別のアプリから特定のアプリへのディープリンクを行うと、手動ナビゲーションがシミュレートされます。たとえば、ユーザーが Google TV から Moviestar アプリの詳細ページに直接アクセスして戻るボタンを押すと、Moviestar アプリのホームページが表示されます。
フォーカス可能なすべての要素への明確なパス
ユーザーが明確な指示で UI を操作できるようにします。コントロールに確実に到達する方法がない場合は、コントロールの再配置を検討してください。
すべきこと
すべきでないこと
軸
横軸と縦軸を利用してレイアウトを設計します。大きな階層をすばやく移動できるように、各方向に特定の機能を与えます。
すべきこと
