📋 What was this drill?

Drill: Empty states: 5 different empty states, each with what/why/next. No 'No data.' Target: each empty state teaches the user something.

Interpretation: Building five empty states for a fictional project-management tool ('Meridian'). States: first-use (no projects yet), no search results, filtered-empty (active filter matches nothing), error-empty (failed fetch), archived-empty (no archived items yet). Each follows the what/why/next structure. Tone-matched illustration via restrained SVG line drawings — orients rather than decorates.

Component Craft · Empty States

Five empty states, each one teaches

The worst empty state is “No data.” It blames the user for an absence and offers no path forward. Each state below answers what is empty, why, and the next action — copy is the craft, not the illustration.

Projects First run

No projects yet

Projects are where your team plans, tracks, and ships work. Create your first one in under a minute — most teams start from a template.

First-time. User has zero items because they just signed up. The CTA is an on-ramp, not a refresh.
Search Query

No results for “workflow automation”

We searched docs, changelogs, and API references. Try a broader term, or check the spelling — “workflow” alone returns 14 pages.

Search. Mirror the query, offer a concrete broader alternative with its count, teach the syntax. Never leave the user wondering if it searched.
Issues 4 filters
Status: Done × Priority: Urgent × Assignee: Me × Sprint 14 ×

No issues match these 4 filters

There are no Urgent issues assigned to you that are Done in Sprint 14. That's usually good news — but “Status: Done” is the filter most likely hiding results.

Filtered. Show the active chips, name the most likely culprit filter, offer granular clear. Don't make the user guess which filter is the problem.
Inbox 0 pending

You're all caught up

No reviews, mentions, or assignments are waiting on you. The last item was resolved 6 minutes ago. This state is intentional — celebrate the zero, don't apologize for the emptiness.

Celebratory. Zero can be a goal, not a void. Emerald checkmark + reassurance. Offer forward-looking action, not a “create something” push.
Workspace Restricted

You don't have access to this workspace

“Acme Design” is private. Access is granted by its three workspace admins — your request goes to all of them, and one must approve.

Permission. State the boundary clearly, name who controls it, make the request low-friction. Amber signals caution without red's alarm.
What each state does that “No data” can't: identifies the cause of emptiness (just signed up / no search match / over-filtered / genuinely done / access-gated), names a concrete next step, and matches tone to context — welcoming for first-run, neutral for search, helpful for filters, celebratory for inbox-zero, and clear-but-not-alarming for permission. The illustration is a 30px line icon in a tinted circle; it orients, it doesn't decorate.