トースト通知

Toast

画面の隅に短時間だけ現れて自動的に消える、操作を妨げずに結果を伝える軽量な通知。

○ 使う場面

  • 「保存しました」のような、操作の結果を一言伝えれば十分なとき
  • ユーザーの操作を止めずに、画面の隅で完結する通知で足りるとき

× 避ける場面

  • ユーザーの応答(確認・選択)が必須であるとき(→確認ダイアログ)
  • 通知を消さずに残しておく必要があるとき(→バナー通知)

別名

トースト、スナックバー

近縁種との比較

Toast と Snackbar は同じ「一時的な軽量通知」を指す呼称ゆれで、Material Design系は Snackbar、Polaris・Salesforce Lightning・Fluent・Bootstrapなど他の多くのデザインシステムは Toastと呼ぶ。日本語記事でも両方の呼称が流通しているため、本図鑑では当初トーストを見出し名 としていたが、より具体的に伝わるトースト通知へ改称し(R36)、操作ボタン(元に戻す等)を 持てる点も含めてSnackbarと同一のUIとして扱う。「トースト」という呼び名自体は、パンがトースターから焼き上がってポップアップする様子に見立てた命名として広く知られる。

近縁種違い・使い分け
バナー通知バナー通知が明示的に閉じるまで残り続けるのに対し、トースト通知は一定時間で自動的に消える点が最大の違い。
確認ダイアログ確認が必須の内容にはトースト通知は向かず、その場合は確認ダイアログを使う。

分類

機能・役割
  • ナビゲーション
  • 入力・操作
  • 表示・整理
  • フィードバック・状態
表示レイヤー
  • インライン
  • 固定・追従
  • オーバーレイ
  • 全画面・遷移
複雑さ
  • 単体パーツ
  • 複合パーツ
  • セクション