空白は故障に見える
何もない画面を見ると人は「読み込み中か、故障か、自分のミスか」と考えます。ニールセン（1994）のシステム状態の可視性が崩れる瞬間です。マテリアルデザインは種類を区別します。読み込み中はスケルトンスクリーンで区別しましょう。
良い空の状態の三要素
カプラン（2021）は状態の伝達、学習の手がかり、次の行動への道筋を勧めます。フォッグ（2009）のモデルではボタンがきっかけになります。空の状態はオンボーディングの自然な場所でもあります。
種類別の文言
結果なしでは検索語を再表示し、綴りの確認やフィルター解除を提案します。すべて完了なら達成を祝い、エラーなら原因と再試行を示し利用者を責めません。これはニールセンのユーザビリティヒューリスティックの応用です。
よくある質問
- 何を入れるべき？
- 空の理由、何が入る場所か、次の行動ボタンの三つです。
- 読み込み中との違いは？
- 読み込み中はスケルトン、本当にデータがないときだけ空の状態を表示します。
出典確認日：2026-10-27
参考文献
- Kaplan, K. (2021, September 19). Designing empty states in complex applications: 3 guidelines. Nielsen Norman Group. 状態の伝達・学習の手がかり・次の行動の道筋を示す指針です。
- Google. (n.d.). Empty states. Material Design 2. 初回利用・利用者が空にした状態などの種類を区別しています。
- Tidwell, J., Brewer, C., & Valencia, A. (2020). Designing interfaces: Patterns for effective interaction design (3rd ed.). O'Reilly Media. インターフェースのパターン集です。
- Hoober, S., & Berkman, E. (2011). Designing mobile interfaces. O'Reilly Media. モバイル画面のパターンを幅広く扱っています。
- Nielsen, J. (1994). Usability engineering. Morgan Kaufmann. システム状態の可視性などの基本原則を扱っています。
- Fogg, B. J. (2009). A behavior model for persuasive design. In Proceedings of the 4th International Conference on Persuasive Technology (Article 40). ACM. 空画面のボタンが行動のきっかけになるという視点を与えます。
- Norman, D. A. (2013). The design of everyday things (Revised and expanded ed.). Basic Books. シグニファイアとフィードバックの概念を説明しています。