Tier 2 — 適応型最適化

最適化されたアプリは、状態遷移を含むすべての画面タイプとデバイスの状態に完全に対応しています。

3 つの品質レベルが縦に積み重ねられたレイヤとして描画され、真ん中のレベルがハイライト表示されている。

ガイドライン

あらゆる表示サイズとデバイスの状態に対応できるようにアプリを作成します。

ユーザー インターフェース

ガイドライン ID テスト ID 説明
Responsive_adaptive_layouts T-Layout_Flow

あらゆる画面サイズに対応したレスポンシブ レイアウトとアダプティブ レイアウトを用意します。すべてのレイアウトがレスポンシブである（UI をレスポンシブ レイアウトに移行するをご覧ください）。アダプティブ レイアウトの実装は、ウィンドウ サイズクラスに基づく。

アプリ UI には次のものを含められる。

  • 大きなウィンドウ サイズの場合は、すべてが表示されるナビゲーション パネルに拡張する最先端のナビゲーション レール
  • ウィンドウ サイズの変更に合わせて列数を調整するグリッド レイアウト
  • 大画面でのテキストの列
  • デスクトップ パソコンの画面サイズではデフォルトで開き、小さい画面の場合は閉じる後端パネル

大画面のスペースを利用するため、必要に応じてマルチペイン レイアウトを作成します。正規レイアウトをご覧ください。

Jetpack Compose アプリの場合は、アダプティブ レイアウト（ListDetailPaneScaffold など）を使用してマルチペイン UI を作成します。アクティビティ ベースの従来のアプリの場合は、アクティビティの埋め込みにより、アクティビティを並べて表示してマルチペイン レイアウトを実現します。
UI_Secondary_Elements T-Layout_Flow

以下のように、モーダル、コンテキスト メニューなどのセカンダリ要素を、あらゆる画面タイプとデバイス状態で適切に設定します。

  • 大画面ではボトムシートは全幅にならない（引き延ばされないよう、最大幅が適用される）。シート: ボトムの動作をご覧ください。
  • 大画面ではボタンは全幅にならない。ボタンの動作をご覧ください。
  • 大画面ではテキスト フィールドとボックスが全幅に引き延ばされない。テキスト フィールドの動作をご覧ください。
  • 小さな編集メニューまたはモーダルは、画面全体に広がることなく、可能な限りコンテキストを維持する。メニューをご覧ください。
  • コンテキスト メニューはユーザーが選択したアイテムの横に表示される。メニューの「コンテキスト メニュー」トピックをご覧ください。
  • 大画面では、より操作しやすいよう、ナビゲーション バーに代わってナビゲーション レールが使用される。ナビゲーション レールをご覧ください。
  • ナビゲーション ドロワーは拡張されたナビゲーション レールに更新される。ナビゲーション ドロワーをご覧ください。
  • ダイアログ ボックスは最新のマテリアル コンポーネントに更新される。ダイアログをご覧ください。
  • 画像は適切な解像度で表示され、引き伸ばされず、切り抜かれない。
Touch_Targets T-Touch_Targets タップ ターゲットが 48 dp 以上である。マテリアル デザインのレイアウトとタイポグラフィのガイドラインをご覧ください。
Drawable_Focus T-Drawable_Focus インタラクティブなカスタム ドローアブルの場合は、フォーカスされた状態が作成される。カスタム ドローアブルとは、Android フレームワークで提供されない視覚的な UI 要素を指す。ユーザーがカスタム ドローアブルを操作できる場合、デバイスがタップモードになっていないときは、ドローアブルをフォーカス可能にして、フォーカスされた状態を視覚的に示す必要がある。

キーボード、マウス、トラックパッド

ガイドライン ID テスト ID 説明
Keyboard_Navigation T-Keyboard_Navigation アプリの主要なタスクフローで、Tab キーと矢印キーによるナビゲーションを含め、キーボード ナビゲーションをサポートします。ユーザーが利用しやすいアプリを作成するをご覧ください。
Keyboard_Shortcuts T-Keyboard_Shortcuts 選択、切り取り、コピー、貼り付け、元に戻す、やり直しなど、よく使用される操作のキーボード ショートカットをサポートします。キーボード、マウス、トラックパッドをご覧ください。
Keyboard_Media_Playback T-Keyboard_Media_Playback Spacebar キーでメディアの再生と一時停止を行うなど、キーボードでメディア再生を操作できます。
Keyboard_Send T-Keyboard_Send キーボードの Enter キーで、通信アプリの 送信 機能が果たされる。
Keyboard_Exit T-Keyboard_Exit キーボードの Esc キーで、操作を終了または元に戻す 終了 機能が果たされる。次に例を示す。
  • モーダル、ダイアログ、ポップアップ、メニューを閉じる
  • 検索語句をクリアするか、検索フォーカスを削除する
  • キーボード フォーカスをキャンセルする
  • 全画面動画、PiP、全画面モード、スライドショーを終了する
  • 進行状況バーやメニューなどの画面上のコントロールを閉じる
  • 次の動画 / 自動再生タイマーをキャンセルする
  • 選択したすべてのアイテムの選択を解除する
  • 保存せずに名前の変更/編集を中止する
  • 切り抜き/変換ツールを終了し、変更を破棄する
Context_Menus T-Context_Menus マウスとトラックパッドの一般的な右クリック（セカンダリ マウスボタンまたはセカンダリ タップ）操作でコンテキスト メニューにアクセスできる。
Content_Zoom T-Content_Zoom マウスのスクロール ホイール操作（Control キーまたは Ctrl キーの押下との組み合わせ）とトラックパッドのピンチ操作でアプリ コンテンツをズームできる。
Hover_States T-Hover_States 操作可能な UI 要素のホバー状態（該当する場合）により、マウスやトラックパッドのユーザー向けに要素がインタラクティブであることを示します。

テスト

アプリがすべてのディスプレイ設定に最適化され、レスポンシブであることを確認するには、次のテストを行います。

ユーザー インターフェース

テスト ID ガイドライン ID 説明
T-Layout_Flow Responsive_adaptive_layouts、
UI_Secondary_Elements

スマートフォン、折りたたみ式スマートフォン、小型および大型タブレット、デスクトップ デバイスなど、さまざまな画面サイズのデバイスでアプリを実行する。デバイスのマルチ ウィンドウ モードでアプリを実行する。

アプリのレイアウトが変化して、異なる画面サイズとウィンドウ サイズに適応することを確認する。アプリでナビゲーション レールの拡大と縮小、グリッド レイアウトでの列数の調整、列へのテキストのフローなどが実行されるかを確認する。UI 要素が見た目と機能の両方においてフォーマットされていることを確認する。

アクティビティの埋め込みを使用する従来のアプリでは、アクティビティが大画面では並んで表示され、小さな画面では重ねて表示されることをテストする。
T-Touch_Targets Touch_Targets すべてのディスプレイのサイズと設定で、タップ ターゲットが一貫性を持ってアクセス可能なサイズと位置を保持しており、他の UI 要素によって隠れたり、見えなくなったりしていないことを確認する。ユーザー補助に関する情報は、ユーザー補助検証ツールをご覧ください。
T-Drawable_Focus Drawable_Focus インタラクティブなカスタム ドローアブルがある各アプリの画面で、UI 要素をフォーカスできる外部キーボード、D-pad、その他のデバイスを使用して、ドローアブルがフォーカス可能であることを確認する。フォーカス状態が視覚的にわかることを確認する。関連情報については、Compose フォーカスのドキュメントをご覧ください。

キーボード、マウス、トラックパッド

テスト ID ガイドライン ID 説明
T-Keyboard_Navigation T-Keyboard_Navigation 外部キーボードの Tab キーと矢印キーを使用して、アプリのフォーカス可能なコンポーネント間を移動する。
T-Keyboard_Shortcuts Keyboard_Shortcuts 外部キーボードのキーボード ショートカットを使用して、選択、切り取り、コピー、貼り付け、元に戻す、やり直しの操作を行う。
T-Keyboard_Media_Playback Keyboard_Media_Playback 外部キーボードを使用して、メディア再生の開始、停止、一時停止、巻き戻し、早送りを行う。
T-Keyboard_Send Keyboard_Send 外部キーボードの Enter キーを使用して、データを送信または提出する。
T-Keyboard_Exit Keyboard_Exit

外部キーボードの Esc キーを使用して、終了機能を行う。キーで次の操作が行われることを確認する（該当する場合）。

  • モーダル、ダイアログ、ポップアップ、メニューを閉じる
  • 検索語句をクリアするか、検索フォーカスを削除する
  • キーボード フォーカスをキャンセルする
  • 全画面動画、PiP、全画面モード、スライドショーを終了する
  • 画面上のコントロールを閉じる
  • 次の動画 / 自動再生タイマーをキャンセルする
  • 選択したすべてのアイテムの選択を解除する
  • 保存せずに名前の変更/編集を中止する
  • 切り抜き/変換ツールを終了し、変更を破棄する
T-Context_Menus Context_Menus セカンダリ マウスボタンまたはトラックパッドのセカンダリ タップ機能を使用して、インタラクティブ要素のコンテキスト メニューにアクセスする。
T-Content_Zoom Content_Zoom マウスのスクロール ホイール（Control キーまたは Ctrl キーと組み合わせて使用）とトラックパッドのピンチ操作を使用して、コンテンツをズームイン、ズームアウトする。
T-Hover_States Hover_States 実行可能な UI 要素の上にマウスまたはトラックパッドのカーソルを合わせ、要素がホバー状態になるようにする。