オーバーレイ

オーバーレイは、アプリ コンテンツの主要なサーフェスの一つです。アプリ コンテンツを容易に視認できるように表示するウォッチフェイスの追加機能またはタイルとは異なり、より多くの情報を表示し、よりインタラクティブな操作をサポートします。ユーザーは、通知、ウォッチフェイスの追加機能、タイル、音声操作など、別のアプリのサーフェスからオーバーレイを頻繁に入力します。

原則

オーバーレイを設計する際は、次の原則に留意してください

フォーカス

重要なタスクにフォーカスして、ユーザーが数秒で完了できるようにします。

シャロー(線形)

2 階層より深い階層の作成は避けます。可能な場合は、コンテンツとナビゲーションをインラインで表示することを目指します。

スクロール

オーバーレイはスクロールできます。この動作は、ユーザーがスマートウォッチで他のコンテンツを表示する際の自然な操作です。

ガイドライン

オーバーレイを設計する際は、次のガイドラインに従ってください。

縦向きレイアウト向けに最適化する

縦向きレイアウトを使用してアプリのデザインを簡素化できます。これにより、ユーザーは一方向にスクロールしてコンテンツ間を移動できます。

このアプリの目的は、ユーザーをポイント A からポイント B に導くことです。
縦方向と横方向の両方のスクロールは使用しない。アプリを操作する際に混乱が生じる可能性があります。

時刻を表示する

ユーザーがオーバーレイに費やす時間は増加する傾向にあるため、時刻にすばやくアクセスできるようにすることが重要です。

オーバーレイの上部に時刻を表示する。これにより、ユーザーは決まった場所で時刻を確認できるようになります。
ダイアログ、確認画面、選択ツールに時刻を表示する。ユーザーがそれらの画面に費やす時間は数秒間のみである可能性が高いためです。

ユーザー補助用のインライン エントリ ポイント

ユーザー補助用の明確なアイコンとラベルを使用して、すべてのアクションがインラインで表示されるようにします。これには、設定のエントリ ポイントが含まれます。

可能な場合は、アイコンとラベルの両方を使用する。
アイコンのみを使用してユーザーにアクションを促すプロンプトを表示する。

メイン アクションの優先順位を引き上げる

メイン アクションをオーバーレイの一番上に配置して、ユーザーがアプリ内でアクションを簡単に実行できるようにします。

曖昧さのないメイン アクションをオーバーレイの一番上に配置する。

ラベルを使用してユーザーが適応できるようにする

オーバーレイが長い場合は、ラベルを使用してユーザーがコンテンツをスクロールするのをサポートします。

セクション区切り、ラベル、その他のキューを使用してコンテンツを整理することで、ユーザーが混合コンテンツが配置された長いビューをスクロールするのをサポートする。
コンテンツ タイプが 1 つしかないオーバーレイにラベルを追加する。

スクロールバーを表示する

ビュー全体をスクロールする場合に、スクロールバーを表示する。

コンテンツ コンテナ

コンテンツ コンテナの例を以下に示します。

図 1. 高さが固定されたコンテナ。
図 2. 高さが可変のコンテナ。
図 3. 高さと幅がビューポートより大きいコンテナ。
図 4. ページ分けされたコンテナ。
図 5a. 画面全体を占有し、縦方向にページ分けされるコンテンツ ページ。
図 5b.