About empty-state-and-loading-review
empty-state-and-loading-review is a skill for reviewing empty, loading, and other non-happy-path interface states. It helps teams identify product-state issues and produce copy, layout, instrumentation, and acceptance checks.
Key features
- 01Classifies empty and loading states
- 02Checks explanations and next actions
- 03Separates product fixes from visual polish
- 04Produces copy and layout guidance
- 05Defines instrumentation and acceptance checks
Use cases
- 01Reviewing first-use or zero-result screens
- 02Improving offline and error states
- 03Checking partial loading behavior
Install
Copy the command and run it in a terminal.
$
npx skills add https:/ / github.com/ sylphxai/ skills --skill empty-state-and-loading-reviewAfter installing, type/empty-state-and-loading-reviewin Claude Code to confirm it loaded.
Bundled filesagents/openai.yamlreferences/empty-loading-patterns.md
Details
From the project READMEEmpty State And Loading Review
Use this skill to make non-happy-path UI feel intentional, useful, and fast.
Workflow
- Identify the state type: first-use empty, zero-result, permission-blocked, loading, partial loading, offline, error, or completed.
- Read
references/empty-loading-patterns.md. - Check whether the state explains what happened, why it matters, and what the user can do next.
- Separate product-state fixes from visual polish.
- Produce copy, layout, instrumentation, and acceptance checks.
When not to use
- Do not use for generic advice the base model already handles without this skill's specific artifact contract.
Guardrails
- Do not use cute empty-state copy when the user has lost work, money, or access.
- Do not hide loading uncertainty behind fake precision.
- Preserve accessibility, reduced motion, and layout stability.
Output format
Surface:
State type:
Findings/spec:
- <rule id> <issue or decision> -> <fix>
Copy and action:
- Message:
- Primary action:
- Secondary action:
Acceptance checks:
- <check>
Comments
Markdown supported