アプリ設定のガイドライン

アプリ設定は、Windows アプリの中でもユーザーによるカスタマイズが可能な部分であり、アプリ設定ページからアクセスします。 たとえば、ニュース リーダー アプリでは、表示するニュース ソースや画面に表示する記事の数を指定できる場合があります。また、天気予報アプリでは、摂氏または華氏を選ぶことができます。 この記事では、アプリ設定の作成と表示に関する推奨事項とベスト プラクティスを示します。

設定ページを提供する場面

アプリ設定ページに属するアプリ オプションの例を次に示します。

• アプリの動作に影響を与え、頻繁な再調整を必要としない構成オプション (天気予報アプリの温度の既定の単位として摂氏または華氏の選択、メール アプリのアカウント設定の変更、通知の設定、アクセシビリティ オプションなど)。
• 音楽、効果音、色のテーマなど、ユーザーの好みに応じて選択できます。
• プライバシー ポリシー、ヘルプ、アプリのバージョン、著作権情報など、あまり頻繁にアクセスされないアプリ情報。

一般的なアプリ ワークフローの一部であるコマンド (アート アプリのブラシ サイズの変更など) は、設定ページに含めることはできません。 コマンドの配置の詳細については、「 コマンドデザインの基本を参照してください。

一般的な推奨事項

• 設定ページをシンプルにし、バイナリ (オン/オフ) コントロールを使用します。 切り替えスイッチは、通常、バイナリ設定に最適なコントロールです。
• ユーザーが最大 5 つの相互排他的な関連オプションのセットから 1 つの項目を選択できるようにする設定では、 radio ボタンを使用します。
• アプリ設定のページですべてのアプリ設定のエントリ ポイントを作成します。
• 設定をシンプルに保ちます。 スマートな既定値を定義し、設定の数を最小限に抑えます。
• ユーザーが設定を変更すると、アプリはすぐに変更を反映する必要があります。
• 一般的なアプリ ワークフローの一部であるコマンドは含めないでください。

エントリ ポイント

ユーザーがアプリ設定ページにアクセスする方法は、アプリのレイアウトに基づく必要があります。

ナビゲーション ウィンドウ

ナビゲーション ウィンドウ レイアウトの場合、アプリの設定はナビゲーションの選択肢の一覧の最後の項目であり、下部にピン留めする必要があります。

コマンド バー

コマンド バーまたはツール バーを使用している場合は、設定のエントリ ポイントを [その他] オーバーフロー メニューの最後の項目の 1 つとして配置します。 設定のエントリ ポイントを簡単に検索できることがアプリで重要となる場合は、オーバーフローではなく、コマンド バーに直接エントリ ポイントを配置します。

ハブ

ハブ レイアウトを使っている場合は、アプリ設定のエントリ ポイントをコマンド バーの [その他] オーバーフロー メニュー内に配置することをお勧めします。

タブ/ピボット

タブまたはピボット レイアウトの場合、アプリ設定のエントリ ポイントをナビゲーション内の上位項目の 1 つとして配置することはお勧めしません。 代わりに、アプリ設定のエントリ ポイントをコマンド バーの [その他] オーバーフロー メニュー内に配置することをお勧めします。

リストと詳細

アプリ設定のエントリ ポイントをリストと詳細ペイン内の深い位置に配置するのではなく、リスト ペインのトップ レベルに、最後のピン留めされた項目として配置してください。

レイアウト

アプリ設定のウィンドウは全画面で開き、ウィンドウ全体に表示されるはずです。 アプリ設定メニューに最大 4 つの最上位グループがある場合、それらのグループは 1 列下にカスケードする必要があります。

[色モード] の設定

アプリでユーザーがアプリのカラー モードを選択できる場合は、 radio ボタン または combo ボックス ヘッダー "アプリ モードの選択" を使用してこれらのオプションを表示します。 オプションの読み取り

• "ライト"
• 濃色
• Windows の既定

また、ユーザーが現在の既定のアプリ モードにアクセスして変更できる Windows 設定アプリの [色] ページにハイパーリンクを追加することもお勧めします。 ハイパーリンク テキストには "Windows の色の設定" という文字列を使用し、URI には ms-settings:colors を使用します。

[概要] セクションと [フィードバック] ボタン

専用のページとして、または独自のセクションで、アプリに "バージョン情報" セクションを配置することをお勧めします。 [フィードバックの送信] ボタンが必要な場合は、[このアプリについて] ページの下部に配置します。

"法的" 小見出しの下に、"使用条件" と "プライバシーに関する声明" (テキストを折り返すボタンする必要があります) と、著作権などの追加の法的情報を配置します。

推奨されるページ コンテンツ

アプリ設定ページに含める項目の一覧を取得したら、次のガイドラインを考慮してください。

• 類似または関連する設定を 1 つの設定ラベルの下にグループ化します。

• 設定の合計数を最大 4 または 5 に保つようにします。

• アプリのコンテキストに関係なく、同じ設定を表示します。 一部の設定が特定のコンテキストに関連しない場合は、アプリ設定のポップアップで無効にします。

• 設定には、わかりやすい 1 単語のラベルを使用します。 たとえば、アカウント関連の設定には、"アカウント設定" ではなく "Accounts" という設定に名前を付けます。 設定のオプションが 1 つだけ必要で、設定がわかりやすいラベルに適していない場合は、[オプション] または [既定値] を使用します。

• 設定がポップアップではなく Web に直接リンクしている場合は、"ヘルプ (オンライン)" や "Web フォーラム" などの視覚的な手掛かりを使用して、 hyperlinkとしてスタイルを設定して、ユーザーに知らせます。 Web への複数のリンクを 1 つの設定でポップアップにグループ化することを検討してください。 たとえば、"About" 設定では、利用規約、プライバシー ポリシー、アプリのサポートへのリンクを含むポップアップを開く場合があります。

• 使用頻度の低い設定を 1 つのエントリに結合して、より一般的な設定がそれぞれ独自のエントリを持てるようにします。 情報のみを含むコンテンツまたはリンクを [バージョン情報] 設定に配置します。

• [アクセス許可] ウィンドウで機能を複製しないでください。 Windows には既定でこのウィンドウが用意されており、変更することはできません。

• 設定ポップアップに設定コンテンツを追加する

• 必要に応じてスクロール可能な 1 つの列にコンテンツを上から下に表示します。 スクロールを画面の高さの最大 2 倍に制限します。

• アプリ設定には、次のコントロールを使用します。

  • 切り替えスイッチ: ユーザーが値をオンまたはオフに設定できるようにします。
  • ラジオ ボタン: ユーザーが相互に排他的な関連するオプションを 5 つまでのセットから 1 つの項目を選択できるようにします。
  • テキスト入力ボックス: ユーザーがテキストを入力できるようにします。 メールやパスワードなど、ユーザーから取得するテキストの種類に対応するテキスト入力ボックスの種類を使用します。
  • ハイパーリンク: ユーザーをアプリ内の別のページまたは外部 Web サイトに移動します。 ユーザーがハイパーリンクをクリックすると、[設定] ポップアップが閉じます。
  • ボタン: ユーザーが現在の [設定] ポップアップを閉じずに即時アクションを開始できるようにします。

• いずれかのコントロールが無効になっている場合は、わかりやすいメッセージを追加します。 無効になっているコントロールの上にこのメッセージを配置します。

• [設定] ポップアップとヘッダーがアニメーション化された後、コンテンツとコントロールを 1 つのブロックとしてアニメーション化します。 enterPage または EntranceThemeTransition アニメーションを 100px 左オフセットで使用してコンテンツをアニメーション化します。

• 必要に応じて、セクション ヘッダー、段落、ラベルを使用して、コンテンツの整理と明確化を支援します。

• 設定を繰り返す必要がある場合は、追加レベルの UI または展開/折りたたみモデルを使用しますが、2 レベルより深い階層は避けてください。 たとえば、都市ごとの設定を提供する天気アプリでは、都市を一覧表示し、ユーザーが都市をタップして新しいポップアップを開くか、展開して設定オプションを表示できます。

• コントロールまたは Web コンテンツの読み込みに時間がかかる場合は、不確定な進行状況コントロールを使用して、情報が読み込まれることをユーザーに示します。 詳細については、「進行状況コントロールの Guidelinesを参照してください。

• ナビゲーションや変更のコミットにはボタンを使用しないでください。 ハイパーリンクを使用して他のページに移動し、ボタンを使用して変更をコミットする代わりに、ユーザーが [設定] ポップアップを閉じると、アプリ設定に対する変更が自動的に保存されます。

関連記事

• コマンド設計の基本
• 進行状況コントロールのガイドライン
• アプリ データの保存と取得
• EntranceThemeTransition