mcpField
E
empty-state-and-loading-review

empty-state-and-loading-review

github.com/sylphxaiDesign & UI153 installsUpdated today
Repository

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

  1. 01Classifies empty and loading states
  2. 02Checks explanations and next actions
  3. 03Separates product fixes from visual polish
  4. 04Produces copy and layout guidance
  5. 05Defines instrumentation and acceptance checks

Use cases

  1. 01Reviewing first-use or zero-result screens
  2. 02Improving offline and error states
  3. 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-review

After 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 README

Empty State And Loading Review

Use this skill to make non-happy-path UI feel intentional, useful, and fast.

Workflow

  1. Identify the state type: first-use empty, zero-result, permission-blocked, loading, partial loading, offline, error, or completed.
  2. Read references/empty-loading-patterns.md.
  3. Check whether the state explains what happened, why it matters, and what the user can do next.
  4. Separate product-state fixes from visual polish.
  5. 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