Agent-Skills.md

Agent Skills: Design Compliance Dashboard Skill

Tracks and visualizes the progress of the design system migration. Generates compliance reports across Typography, Shape, Color, Motion, and Accessibility metrics to provide a clear path to the "Definition of Done."

UncategorizedID: okgoogle13/careercopilot/design-compliance-dashboard

Repository

okgoogle13/careercopilot
okgoogle13
1

Install this agent skill to your local

pnpm dlx add-skill https://github.com/okgoogle13/careercopilot/tree/HEAD/skills/design-compliance-dashboard

Skill Files

Browse the full folder contents for design-compliance-dashboard.

Download Skill

Loading file tree…

skills/design-compliance-dashboard/SKILL.md

Skill Metadata

Name
design-compliance-dashboard
Description
Tracks and visualizes the progress of the design system migration. Generates compliance reports across Typography, Shape, Color, Motion, and Accessibility metrics to provide a clear path to the "Definition of Done."

Design Compliance Dashboard Skill

Capabilities

  • Generate a real-time Markdown dashboard of component compliance.
  • Identify "High Priority" components for refactoring.
  • Track 5 key metrics: Typography, Shape, Color, Motion, and Accessibility.

Workflow

  1. Execute python3 scripts/generate-compliance-dashboard.py.
  2. Present the summary results to the user.
  3. Suggest the next batch of 3 components for the component-transformer to process.

Value

  • Provides clarity on the "Definition of Done".
  • Prevents "Design Debt" accrual.
  • Gamifies the migration process for stakeholders.