← ClaudeAtlas

orbit-designer-empty-errorlisted

Audit empty-states + error-states across a WordPress plugin's admin UI — every list / table / dashboard / form should have a designed empty state with CTA, and every error path should have a recoverable error message (not a stack trace). Use when the user says "empty state audit", "error state design", "blank screen UX", or after a UX review.
adityaarsharma/orbit · ★ 1 · Web & Frontend · score 55
Install: claude install-skill adityaarsharma/orbit
# 🪐 orbit-designer-empty-error — Empty + error state audit The two states designers forget. Empty = "nothing here yet" = first impression. Error = "something broke" = trust moment. Both ship as afterthoughts in 80% of plugins. --- ## Quick start ```bash PLUGIN_SLUG=my-plugin npx playwright test --project=designer-states ``` The spec navigates to every admin page in a fresh-install state (no data) AND a forced-error state (broken DB, missing file, expired session) and screenshots both. --- ## What it checks ### 1. Empty-state coverage For every list / table / dashboard: - Is there content shown when no data exists? - Does it explain *why* it's empty? - Does it include a CTA to populate it? **Whitepaper intent:** A blank table after fresh install = user thinks "broken." A designed empty state = user thinks "next step is clear." ``` ✅ Good empty state ┌──────────────────────────────────────────┐ │ 📋 No submissions yet │ │ │ │ When someone fills out your form, │ │ their submissions will show up here. │ │ │ │ [ Create your first form → ] │ └──────────────────────────────────────────┘ ❌ Bad empty state ┌──────────────────────────────────────────┐ │ No items found. │ ← nothing else └──────────────────────────────────────────┘ ``` ### 2. Error-state coverage For every error path: - Replace stack traces with friendly mes