Empty States
Overview
Empty states are product moments, not blanks. They appear on first use, after clearing data, or when searches return nothing — and they strongly shape activation and confidence.
When to Use
- First-run and zero-data screens
- No-results and filtered-empty views
- Permission-denied or setup-required states
- Error states that leave a screen empty
Core Practices
- Explain why the screen is empty
- Offer a clear primary action to move forward
- Use illustration or visuals sparingly and purposefully
- Differentiate first-use empty from “you cleared everything” empty
- Avoid dead ends
Principles
- Empty states are onboarding opportunities
- Be helpful, not cutesy at the expense of clarity
- Match tone to the user’s likely emotional state
- Design empty states as intentionally as populated ones
Verification
- User knows what to do next
- Primary action is obvious
- Different empty reasons are handled differently when needed