Agent skill
admin-design
Minimal, high-clarity admin UI design for this repo. Use when redesigning /admin pages (translation manager, dashboards, tables, forms), defining admin design tokens, or improving admin UX/keyboard workflows without changing core functionality.
Install this agent skill to your Project
npx add-skill https://github.com/majiayu000/claude-skill-registry/tree/main/skills/design/admin-design-0futuresystems-future-water-systems-00526bc9
SKILL.md
Admin Design
Goals
- Minimal, low-distraction UI for internal tools.
- High information density without clutter.
- Clear hierarchy and obvious primary actions.
- Fast scanning and keyboard-first workflows.
- Core 2.0 inspired admin shell (collapsible sidebar + header, soft cards).
- Header stays minimal: workspace label + Sign Out only (no avatar, no user details).
- Preserve existing functionality and data flows.
Workflow
- Audit the current page structure and required features before proposing layout changes.
- Pick a layout pattern from
references/layout-patterns.md. - Apply the admin tokens from
references/design-tokens.md(mirrors.admin-rootinclient/src/index.css). - Keep interaction behavior consistent with
references/interaction-guidelines.md. - Only introduce new components if they reduce clicks or improve clarity.
- Validate that every existing action still works (save, suggest, publish, notes, voice, Manglish).
References
references/design-tokens.mdreferences/layout-patterns.mdreferences/interaction-guidelines.mdreferences/component-patterns.md
Recommended Agent Skills
Expand your agent's capabilities with these related and highly-rated skills.
majiayu000/claude-skill-registry
agent-ops-spec
Manage specification documents in .agent/specs/. Use when user provides requirements, acceptance criteria, or feature descriptions that need to be tracked and validated against implementation.
majiayu000/claude-skill-registry
agent-ops-state
Maintain .agent state files. Use at session start, after meaningful steps, and before concluding: read/update constitution/memory/focus/issues/baseline consistently.
majiayu000/claude-skill-registry
agent-ops-spec
Manage specification documents in .agent/specs/. Use when user provides requirements, acceptance criteria, or feature descriptions that need to be tracked and validated against implementation.
majiayu000/claude-skill-registry
agent-ops-testing
Test strategy, execution, and coverage analysis. Use when designing tests, running test suites, or analyzing test results beyond baseline checks.
majiayu000/claude-skill-registry
agent-ops-testing
Test strategy, execution, and coverage analysis. Use when designing tests, running test suites, or analyzing test results beyond baseline checks.
majiayu000/claude-skill-registry
agent-ops-state
Maintain .agent state files. Use at session start, after meaningful steps, and before concluding: read/update constitution/memory/focus/issues/baseline consistently.
Didn't find tool you were looking for?