Design Empty States That Guide Users
Feedback & States · empty states
Updated 2026-07-28
- Treat empty states as a product experience, not a blank screen. When there is no content, users still need feedback that the system is working and guidance on what to do next.
- Avoid showing an unexplained empty page. A blank screen creates uncertainty because users cannot tell whether:
- There is no data yet.
- Something failed.
- They are in the wrong place.
- Use visual cues to create clarity. A simple illustration, icon, or meaningful graphic can communicate the situation faster than text alone and make the experience feel intentional.
- Write empty state copy for humans, not systems. Avoid cold, technical messages that sound like logs. Use language that explains the situation clearly and guides the user forward.
- Give every empty state a primary action. Do not make the default solution “refresh.” Instead, provide the next meaningful step the user would take if they understood the feature.
- Design for different types of empty states. Each situation needs a different message and action:
- First run: Help new users understand the feature and how to begin.
- No results: Explain that nothing matched and suggest what to try next.
- Error state: Explain what failed and provide recovery options.
- Filtered empty state: Help users adjust filters or broaden their search.
- Use empty states as onboarding opportunities. When users have not created anything yet, teach them what the feature does, why it matters, and how to get started.
- A strong empty state turns a moment of inactivity into a moment of guidance. It helps users understand the product before they even begin using it.
Related guides
UX Handbook