Empty state

Added

Tells actors that there’s no content to display. Provides explanation and guidance to help actor progress. Typically surfaces a Button as the primary call to action.

Variants

Blank slate

Basic empty state for first use experience.

Nothing to report

We’ll keep you updated on any new developments.

Informational

Provides information about what to do next.

You don’t have access to this content

Make sure the content exists. If it does, ask an admin for a permission to see the content.

Educational

A contextual onboarding flow to gain deeper understanding of the system.

Get insights by connecting your data

Don’t worry—no coding needed. We’ll walk you through it step by step.

Guiding

Starter that allows users to learn the system by tinkering or setting up their data.

Pick a template to begin customising your workflow

TODO: Replace with some cards

Consequences

  • the gap explains itself and points somewhere: the actor knows why there is nothing here and what would put something here
  • first-run emptiness is the largest uninterrupted surface the product ever gets, and it arrives in front of an actor who has committed nothing yet
  • the empty states multiply — every filter, every permission boundary, every new container has one — and the ones nobody wrote say nothing

Related patterns

Hosts

  • Onboarding — the empty state is often the canvas onboarding builds on

Enacts

  • Learnability — the educational and guiding variants teach the system from inside the gap they announce