Category · 空状態
空状態のAIプロンプト集
受信箱が空、検索結果0件、まだプロジェクトがないなど、データがない状態のUIのAIプロンプト集。次に何をすればよいかを明確に伝えるデザイン。
空状態について
空状態(Empty State)は「まだ何も起きていない」画面のUI。放置されがちですが、初回利用者の体験を決める重要なパートです。良い空状態は「現在何が無いのか」「次に何をすればよいのか」「使うとどう便利になるのか」の3点を一画面で伝えます。イラストや簡潔なコピーで親しみを作りつつ、明確な1つのCTAで次のアクションへ送る設計が求められます。
よく使われる場面
- 受信箱・タスクリストが空のとき
- 検索結果0件・フィルター結果なし
- 初回ログイン直後のオンボーディング画面
- エラー後の状態リセット
- データがまだない管理画面のダッシュボード
成功のポイント
- イラストは1点だけ・派手すぎない
- コピーは20-30字で次の一手を提示
- CTAは1つに絞る(複数並べると迷う)
- 絵文字で温度感を補完するのも有効
- 404ページとは別の文脈として設計する