トーストって何?画面に出るあの小さな通知

トーストは「一瞬だけ出て消える小さな知らせ」

アプリやツールを使っていて、画面の隅にひょこっと小さなメッセージが出て、数秒後にすっと消えていく——あれがトースト(トースト通知)です。「コピーしました」「保存しました」「接続に失敗しました」みたいな短い一言が、操作の邪魔をしない位置に出てきて、放っておくと勝手に引っ込む。あの挙動を指す言葉です。

名前の由来はそのまんまで、パンを焼くトースターからポンと飛び出してくる様子に似ているから、と言われています。ポップアップして、しばらくすると消える。イメージとしてはかなり分かりやすいネーミングだと思います。

身近な例で言うと

スマホで写真を保存したときに、画面下に「保存しました」と黒い帯が一瞬出てくる、あれです。あるいはコンビニのレジで「ポイントが付きました」と言われるようなもの、と考えてもいいかもしれません。こちらが「はい」と返事をする必要はないし、聞き逃しても致命的ではない。でも聞こえていれば「ちゃんと処理されたんだな」と安心できる。トーストが担っているのはそういう役割です。

逆に、契約書にサインするときの「本当にこの内容でよろしいですか?」という確認は、トーストでやってはいけません。あれは相手が反応するまで消えてはいけない種類の情報だからです。

ダイアログとの違い

初心者が混同しやすいのが、トーストとダイアログ(確認ウィンドウ)の違いです。見た目はどちらも「画面に出てくる箱」ですが、性格がまったく違います。

つまり「返事がいらない知らせ=トースト」「返事が必要な問いかけ=ダイアログ」と覚えておけば、だいたい外しません。

トーストによく入っている情報

短いのが身上なので、詰め込める情報は限られます。実際のトーストはだいたい次のような要素でできています。

要素	役割	例
メッセージ本文	何が起きたかを一言で	コピーしました
種類(状態)	成功・警告・エラーなどの区別。色やアイコンで示されることが多い	成功=緑、エラー=赤 など
表示時間	何秒で自動的に消えるか	3秒程度
アクション(任意)	ワンタップで取り消しなどができるボタン	「元に戻す」

この「元に戻す」ボタン付きのトーストは、個人的にかなり気の利いた設計だと思っています。削除前に「本当に消しますか?」と毎回聞かれるとうっとうしいけれど、消したあとに「消しました/元に戻す」と出してくれれば、間違えたときだけ拾えばいい。確認の手間を後ろにずらす、という発想ですね。

トーストが向かない場面

便利な反面、トーストには弱点があります。消えてしまうので、あとから読み返せないんです。長いエラーメッセージや、コピーして誰かに送りたい内容をトーストだけで出されると、けっこう困ります。「今なんて書いてあった?」と思ったときにはもう手遅れ、というやつです。

なので一般的には、次のような使い分けになります。

• 短くて、見逃しても困らない報告はトーストで軽く出す
• 詳しく読む必要がある情報は画面内に残る形(ログや一覧、詳細画面)で出す
• ユーザーの判断が必要なことはダイアログで止めて聞く

また、トーストは同時にいくつも出るとかえって読めなくなります。何かを大量に処理しているときに1件ずつトーストが飛んでくると、画面が通知だらけになって本来見たいものが隠れてしまう。こういうときは「10件処理しました」とまとめて1回だけ出すのが親切です。

覚えておきたいポイント

トーストという言葉自体は難しいものではありませんが、「なぜトーストなのか」を意識しておくと、ツールの画面設計を読むときに理解が早くなります。トーストが出るということは、その処理はすでに終わっていて、あなたに確認を求めているわけではないという合図です。だから安心して作業を続けていい。逆にトーストではなく画面が止まって何か聞かれたら、そこは立ち止まるべき場所、という判断ができます。

UIの用語は雰囲気で覚えてしまいがちですが、こういう「何のために存在するのか」まで押さえておくと、他の通知系の仕組みに出会ったときにも応用が利きます。