Tier 2 — 適応型最適化

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

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

ガイドライン

すべてのディスプレイ サイズとデバイスの状態に対応するようにアプリをビルドします。

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

Guideline ID Test IDs Description
Responsive_adaptive_layouts T-Layout_Flow

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

アプリ UI には次のものを含めることができます。

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

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

アクティビティの埋め込みを使うと、アクティビティ ベースのアプリでアクティビティを並べて表示し、マルチペイン レイアウトを作成できる。
UI_Secondary_Elements T-Layout_Flow

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

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

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

Guideline ID Test IDs Description
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 キーで、通信アプリの send 関数が実行される。
Context_Menus T-Context_Menus マウスとトラックパッドの一般的な右クリック（セカンダリ マウスボタンまたはセカンダリ タップ）操作でコンテキスト メニューにアクセスできます。
Content_Zoom T-Content_Zoom マウスのスクロール ホイール（Control キーまたは Ctrl キーを押しながら使用）とトラックパッドのピンチ操作でアプリ コンテンツをズームできます。
Hover_States T-Hover_States 操作可能な UI 要素のホバー状態（該当する場合）により、マウスやトラックパッドのユーザー向けに要素がインタラクティブであることを示します。

テスト

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

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

Test ID Guideline IDs Description
T-Layout_Flow Responsive_adaptive_layouts,
UI_Secondary_Elements

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

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

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

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

Test ID Guideline IDs Description
T-Keyboard_Navigation Keyboard_Navigation 外部キーボードの Tab キーと矢印キーを使用して、アプリのフォーカス可能なコンポーネント間を移動する。
T-Keyboard_Shortcuts Keyboard_Shortcuts 外部キーボードのキーボード ショートカットを使用して、選択、切り取り、コピー、貼り付け、元に戻す、やり直しの操作を行う。
T-Keyboard_Media_Playback Keyboard_Media_Playback 外部キーボードを使用して、メディア再生の開始、停止、一時停止、巻き戻し、早送りを行う。
T-Keyboard_Send Keyboard_Send 外部キーボードの Enter キーを使用して、データを送信または提出する。
T-Context_Menus Context_Menus セカンダリ マウスボタンまたはトラックパッドのセカンダリ タップ機能を使用して、インタラクティブ要素のコンテキスト メニューにアクセスする。
T-Content_Zoom Content_Zoom マウスのスクロール ホイール（Control キーまたは Ctrl キーと組み合わせて使用）とトラックパッドのピンチ操作を使用して、コンテンツをズームイン、ズームアウトする。
T-Hover_States Hover_States 実行可能な UI 要素の上にマウスまたはトラックパッドのカーソルを合わせ、要素がホバー状態になるようにする。