Dialog

neutral

中立的なの情報提示や確認で使用するオプションです。

ユーザーに意思決定を促しますが、破壊的でないアクションに対して使います。

warning

警告的文脈を含む情報をユーザーに伝える際に使用するオプションです。

ユーザーの操作によって、重要な変更が間接的に失われる場合に使用します。

negative

ネガティブな情報をユーザーに伝える際に使用するオプションです。

ユーザーの操作が破壊的なアクションへ直接的につながる場合に使用します。

ダイアログはウインドウの画面中央に固定表示されます。

上下左右には40pxのオフセットが存在します。また、ダイアログはオーバーレイコンポーネントの上に配置されます。

ダイアログはユーザーの作業を中断させます。アクションの実行に必要な確認をするために使用してください。重要度や優先度が低い情報を提示する場合はInline MessageやToastの使用を検討します。

オブジェクトの選択や属性の指定などを行うためにダイアログを使用しないでください。

オブジェクトの操作など、確認以外の作業を行う場合はModalを使用します。

ダイアログはユーザーが主体性を持ってアクションを実行できるように設計します。タイトルとトリガーにはシステムが実行するアクションを具体的に明示します。デスクリプションではそのアクションを取る理由やリスクを補足し、ユーザーが判断できる情報を提示します。

ダイアログのトリガーのラベルはタイトルの内容を元に命名してください。また、ユーザーにとってネガティブに作用するアクションを実行するためのトリガーはThemeをNegativeにして提示してください。

ユーザーが意図せず重要な変更を失う可能性がある場合はWarningを使用してください。

ダイアログを質問形式でなるべく提示しないでください。質問が含まれているとメッセージが冗長になると同時に、「はい」「いいえ」で回答する形式にするとユーザーの主体性が失われます。

ユーザーに気づいてもらう必要があり、中立的なアクションを提示する場合はNeutralを使用してください。