具体的な結果を述べる
決定または修正が必要な情報は、乾杯の音よりも長くする必要があります。
乾杯 デザインシステム
作業を妨げることなく、アクション後に短いフィードバックが得られます。
チェックリストの内容
確認の進捗
01
構造と意味
使用状況に応じて情報とプレゼンテーションを比較します。
02
インタラクションとユーザビリティ
操作を試し、ステータスを変更して作業を続行します。
03
体験を完了する
デザインを実用化する際に見落としがちな細部を確認してください。
進捗はこのブラウザーに自動保存されます。
ガイド
確認方法
使用例
使用例
具体的な結果を述べる
「元に戻す」ボタンを使用して「3 つのアイテムをアーカイブに移動しました」。
バリエーションと利用場面
迅速に行動する
ユーザーが編集または次に進むことができるときに、便利なアクションをトーストに配置します。
トーストが消える前にキーボードを使用して「元に戻す」を押してください。状態を復元する必要があります。
例 ドキュメントを保存した後、トーストには [元に戻す] ボタンが表示されます。
変更が保存されました
変更が保存されました
変更が保存されました
ステータスアイコン
アイコンは結果を示しますが、テキストの内容は発生したタスクを明確に示す必要があります。
アイコンを非表示にしてトーストを読みます。ユーザーは引き続き、成功した保存と失敗した送信を区別します。
例 「下書き保存」には確認スタンプが押されます。
変更が保存されました
情報をご確認ください。
ポジションはオペレーションをカバーしていません
メインボタン、キーボード、読み取り領域を覆わずに、トーストを目に見える場所に置きます。
キーボードとモバイル ナビゲーション バーを開きます。トーストは読み取れる必要があります。
例 トーストは、安全領域のあるモバイル タブバーにあります。
変更が保存されました
表示時間
十分な時間をかけて読んでください。処理が必要な情報やノードがある情報は、すぐに消えてはいけません。
トーストアクションに焦点を当てます。締め切りを止めるか、見直す方法が必要です。
例 Undo Toast は、ユーザーが [Undo] ボタンにフォーカスしているときに保持されます。
変更が保存されました
操作を中断しない短い通知。