次の方法で共有


バルーン

Note

この設計ガイドは Windows 7 用に作成されており、新しいバージョンの Windows では更新されていません。 ガイダンスの多くは原則として適用されますが、プレゼンテーションと例には 現在の設計ガイダンスは反映されていません。

バルーンは、重大でない問題またはコントロール内の特別な条件をユーザーに通知する小さなポップアップ ウィンドウです。

Caps Lock がオンになっていることを示すバルーンを示すスクリーンショット。

一般的なバルーン。

吹き出しにはアイコン、タイトル、本文のテキストがあり、これらはすべて省略可能です。 ヒントやヒントとは異なり、バルーンにはソースを識別する尾もあります。 通常、ソースはコントロールの場合はコントロールであり、 所有者コントロールと呼ばれます。

バルーンは重要ではない問題をユーザーに通知しますが、所有者が制御する可能性がありますが、問題を防ぐわけではありません。 ハンドルされない問題は、ユーザーがアクションにコミットしようとしたときに、所有者ユーザー インターフェイス (UI) によって処理される必要があります。

吹き出しは通常、テキスト ボックス、またはコンボ ボックス、リスト ビュー、ツリー ビューなどの値を変更するためにテキスト ボックスを使用するコントロールで使用されます。 他の種類のコントロールは十分に制約されており、追加のフィードバック バルーンは必要ありません。 さらに、他の種類のコントロールに問題がある場合は、バルーンが適していない状況で複数のコントロール間の不整合が発生することがよくあります。 テキスト入力コントロールのみが、制約がなく、 単一ポイント エラーの一般的な原因となります。

通知は、 通知領域 アイコンによって表示される特定の種類のバルーンです。

メモ:通知ヒント、ヒントおよびエラー メッセージに関連するガイドラインは、別の記事で示されています。

これは適切なコントロールですか?

それを判断するには、以下の質問を考えます。

  • この情報には、問題や特別な条件が記載されていますか? そうでない場合は、別のコントロールを使います。 バルーンを使用してコントロールの補足情報を表示しないでください。代わりに 、静的テキストヒントプログレッシブ開示、またはプロンプトを使用することを検討してください。
  • 入力時または所有者コントロールが入力フォーカスを失ったときに、問題または特別な条件をすぐに検出できますか? 表示されない場合は、 タスク ダイアログ またはメッセージ ボックスに表示されるエラー メッセージを使用します。
  • 問題の場合、問題は重要ですか? その場合は、タスク ダイアログまたはメッセージ ボックスに表示されるエラー メッセージを使用します。 このようなエラー メッセージには相互作用が必要ですが (重大なエラーに適しています)、バルーンは必要ありません。
  • 特別な条件の場合、条件は有効ですが、意図しない可能性がありますか? その場合は、バルーンが適しています。 条件が無効な場合は、まずそれらを防ぐ方が良いです。 意図した条件が考えられる場合は、何もする必要はありません。
  • 問題や特別な条件を簡潔に表現できますか? そうでない場合は、別のコントロールを使います。 バルーンに詳細な説明を含めたり、補足情報を提供したりすることはできません。
  • 情報は、現在マウス ポインターを置いているコントロールを記述していますか? その場合は、ユーザーがメッセージを操作する必要がない限り、代わりにヒントを使用してください。
  • 情報はユーザーの現在のアクティビティに関連していますか? そうでない場合は、代わりに 通知 または ダイアログ ボックス を使用することを検討してください。 ユーザーは現在のアクティビティ以外のバルーンを見落とし、既定では 10 秒後にバルーンがタイムアウトする可能性があります。
  • 情報は単一の特定のソースから取得されますか? 問題または条件に複数のソースがある場合、または特定のソースがない場合は、代わりに インプレース メッセージ またはダイアログ ボックスを使用します。

不正解:バルーンのスクリーン ショット: ログオンに失敗しました

この例では、問題はユーザー名またはパスワードである可能性がありますが、バルーンの問題を報告すると、パスワードだけが問題であることが視覚的に示されています。 そのため、誤ったユーザー名を入力した場合のフィードバックは誤解を招く可能性があります。

バルーンは、ヒント、ダイアログ ボックス、インプレース メッセージの代替手段です。 ヒントとヒントとは対照的に、次の手順を実行します。

  • バルーンは現在のポインターの位置とは独立して表示できるため、ソースを示す尾が付きます。
  • 吹き出しにはタイトル、本文、アイコンがあります。
  • バルーンはインタラクティブにできますが、先端をクリックすることはできません。

モーダル ダイアログ ボックスとは対照的に、

  • バルーンは入力フォーカスを盗んだり、操作を必要としたりしません。
  • バルーンは、1 つの特定のソースを識別します。 モーダル ダイアログには、複数のソースを含めたり、特定のソースをまったく含めたりすることはできません。

インプレース メッセージとは対照的に、次の手順を実行します。

  • バルーンの方が目立ちます。
  • バルーンには、使用可能な画面領域や、インプレース メッセージを表示するために必要な動的レイアウトは必要ありません。
  • バルーンは、タイムアウト後に自動的に削除されます。

使用パターン

バルーンには、次の使用パターンがあります。

使用法
入力の問題 1 つの所有者コントロール (通常はテキスト ボックス) からの重要でないユーザー入力の問題。
エラー メッセージにバルーンを使用しても入力フォーカスは盗まれませんが、所有者コントロールに入力フォーカスがある場合は依然として非常に顕著です。 問題を解決するには、ユーザーが入力を変更または再入力する必要がある場合があります。ただし、所有者コントロールが正しくない入力を無視した場合、ユーザーは変更を行う必要がない可能性があります。 問題は重要ではないので、 エラー アイコン は必要ありません。
正しくない文字を示すバルーンを示すスクリーンショット。
重要でないユーザー入力の問題を報告するために使用されるバルーン。
特殊な条件 所有者コントロールは、入力に影響を与える状態です。 この状態は意図しない可能性があり、ユーザーは入力が影響を受ける可能性があります。
バルーンを使用して、発生した直後に特別な条件をユーザーに警告してフラストレーションを防ぎます (たとえば、最大入力サイズを超える、誤ってキャップ ロックを設定するなど)。 これらの条件は意図的な可能性があるため、入力フォーカスを盗んだり、相互作用を強制したりすることなく、このようなフィードバックを提供することが重要です。 これらのバルーンは、ユーザーが最小限のフィードバックで作業しているパスワードボックスとピンボックスにとって特に重要です。 これらのバルーンには 警告アイコンがあります。
Caps Lock がオンで、正しくない文字が入力されていることを示すバルーンを示すスクリーンショット。
特殊な条件を報告するために使用されるバルーン。

ガイドライン

表示するタイミング

  • 問題または特別な状態が検出されるとすぐに、繰り返しでも、顕著な遅延なしでバルーンを表示します。
    • 個々の文字や最大入力サイズに関する問題については、入力時にバルーンをすぐに表示します。
    • 入力値に関する問題 (空白以外の値の要求を含む) の場合は、所有者コントロールが入力フォーカスを失ったときにバルーンを表示します。 そうしないと、ユーザーが有効な入力を入力している間にバルーンを表示すると、気が散り、面倒になる可能性があります。
  • 一度に 1 つのバルーンのみを表示します。 複数のバルーンを表示すると、圧倒される可能性があります。 1 つのイベントで複数の問題が発生する場合は、すべての問題を一度に表示するか、最も重要な問題のみを報告します。

不正解:1 つのボックスを指す 2 つのバルーンのスクリーン ショット

この例では、2 つの問題が同時に正しく表示されません。

表示する期間

  • 次の場合に吹き出しを削除します。
    • 問題が解決されたか、特別な条件が削除されます。
    • ユーザーは有効なデータを入力します (入力の問題の場合)。
    • バルーンがタイムアウトします。既定では、バルーンは 10 秒後に自分自身を削除しますが、ユーザーはこれを変更するには、SPI_MESSAGEDURATION システム パラメーターを変更します。
  • 問題が解決するまでユーザーが続行できない場合は、タイムアウトを削除します。開発者: Win32 では、TTM_SETDELAYTIME メッセージで表示時間を設定できます。

表示方法

  • 所有者コントロールの下に吹き出しを表示します。 これにより、ユーザーは所有者コントロールとそのラベルを含むコンテキストを表示できます。 Microsoft Windows では、バルーンの位置が画面に完全に表示されるように自動的に調整されます。 既定の動作では、通知で行われるように、所有者コントロールの上にバルーンを表示します。

正解:コントロールの下に表示されるバルーンのスクリーン ショット

不正解:コントロールの上に表示されるバルーンのスクリーン ショット

正しくない例では、バルーンは所有者コントロールの上にぎこちなく表示されます。

パスワードと PIN のテキスト ボックス

  • 次の例のテキストを使用して、バルーンを使用して Caps Lock がオンになっていることを示します。

キャップ ロックがオンになっていることを示すバルーンのスクリーン ショット

この例では、バルーンは PIN テキスト ボックスで Caps Lock がオンになっていることを示します。

  • バルーンを使用して、ユーザーが最大入力サイズを超えようとするタイミングを示します。 パスワードと PIN のテキスト ボックスでは、通常のテキスト ボックスに比べて、入力の最大サイズに達することは明らかではありません。

ピン コードの制限を示すバルーンのスクリーン ショット

この例では、バルーンは、ユーザーが最大入力サイズを超えようとしていることを示します。

  • バルーンを使用して、ユーザーが正しくない文字を入力したタイミングを示します。 ただし、パスワードや PIN のセキュリティが低下するため、このような制限を設けないようにすることをお勧めします。 情報漏えいを防ぐために、バルーンは有効なパスワードまたは PIN に関する文書化された事実のみをメンションする必要があります。

正しくない入力を示すバルーンのスクリーン ショット

この例では、バルーンは PIN に数値が必要であることを示します。

その他のテキスト ボックス

  • バルーンを使用して、ユーザーが初心者向けのクリティカルで短いテキスト ボックスの最大入力サイズを超えようとするタイミングを示すことを検討してください。 例には、ユーザー名とアカウント名が含まれます。 テキスト ボックスは、ユーザーが最大入力を超えようとしたときにビープ音を鳴らしますが、初心者のユーザーはビープ音の意味を理解していない可能性があります。

文字制限を示すバルーンのスクリーン ショット

この例では、バルーンは、ユーザーが最大入力サイズを超えようとしたことを示します。

相互作用

  • ユーザーがバルーンをクリックすると、他の UI を表示したり、他の副作用を発生させたりすることなく、バルーンを閉じます。 通知とは異なり、バルーンには閉じるボタンを含めることはできません。

アイコン

  • 使用パターンに基づいてアイコンを選択します。

    Pattern アイコン
    入力の問題 アイコンなし。 ここで エラー アイコン を使用しない場合は、 Windows トーン のガイドラインと一致します。
    特殊な条件 標準の 16 x 16 ピクセル の警告アイコン

ユーザー補助

適切に使用すると、バルーンによってアクセシビリティが向上します。 バルーンにアクセスできるようにする場合:

  • ユーザーの現在のアクティビティに関連するバルーンのみを表示します。
  • 吹き出しのテキストは簡潔にしてください。 これにより、視覚の低いユーザーのバルーン テキストの読み取りが容易になり、スクリーン リーダーによる読み取り時の中断が最小限に抑えられます。
  • 問題または条件が繰り返されるたびにバルーンを再表示します。

[テキスト]

タイトル テキスト

  • 入力の問題または特別な条件を簡潔で簡潔な特定の言語で簡単に要約したタイトル テキストを使用します。 ユーザーは、バルーンの目的をすばやく最小限の労力で理解できる必要があります。
  • 句読点を終了せずに、テキスト フラグメントまたは完全な文を使用します。
  • 文章スタイルで大文字と小文字を使い分けます。 詳細については、 用語集を参照してください。
  • ローカライズに対応するには、48 文字以内 (英語) を使用してください。 タイトルの最大長は 63 文字で、ローカライズに対応するために 30% 以上拡張できる必要があります。

本文

  • 本文テキストの最初の文を使用して、ユーザーに明確に関連する方法で問題または状態を示します。 タイトル内の情報を繰り返さないでください。 これ以上追加する必要がない場合は、これを省略します。
  • 2 番目の文を使用して、ユーザーが問題を解決したり状態を元に戻したりするために実行できる操作を指定します。 スタイルとトーンのガイドラインに従って、このステートメントで Please という単語を使用する必要はありません。 1 番目と 2 番目の文の間に 2 つの改行を配置します。

タイトルと本文テキストを含むバルーンのスクリーン ショット

この例では、標準のバルーン テキスト レイアウトを示します。

  • 問題を解決する方法を説明するか、その説明が明らかであっても状態を元に戻しますが、 問題ステートメントとその解決の間の冗長性は省略します。 例外:
    • 簡潔に表現できない場合、または大幅な冗長性がない場合は、解決策を省略します。
    • 正しくない文字が無視された場合など、ユーザーが何も行わない場合は、解像度を省略します。
  • 終了句読点で完全な文を使用します。
  • 文章スタイルで大文字と小文字を使い分けます。
  • ローカライズに対応するには、200 文字以内 (英語) を使用してください。 本文テキストの最大長は 255 文字で、ローカライズに対応するために少なくとも 30% 拡張できる必要があります。

ドキュメント

バルーンを参照する場合:

  • 大文字と小文字を含む正確なタイトル テキストを使用します。
  • 通知やアラートとしてではなく、コンポーネントをバルーンとして参照します。
  • 可能な場合は、太字のテキストを使用してタイトル テキストの書式を設定します。 それ以外の場合は、混乱を防ぐために必要な場合にのみ、タイトルを引用符で囲みます。