build-design-skill-package
Skill1 starsChanged 3 months agoMITView on GitHub
Build or refactor design-domain Agent Skills as traceable, executable packages with a concise SKILL.md entry, explicit source paths, decomposed decision rules, optional reusable templates or scripts, and representative evaluation cases. Use when creating a new design Skill; when an existing Skill has become a long mixed rule dump; when design-system knowledge, component rules, layout guidance, responsive behavior, presentation methods, or audit criteria need to become AI-executable; or when the user asks to follow the Ant Design Skill construction method, architecture, or package hierarchy. Adapt the architecture to actual complexity and never add empty reference, script, or asset layers for appearance alone.
In this repository16 other files it gives its agents.
- analyze-brand-web-experienceSkill
- audit-public-report-languageSkill
- build-before-after-change-deckSkill
- build-html-sharing-reportSkill
- content-source-truth-auditorSkill
- context-first-design-executionSkill
- cross-device-recomposition-specSkill
- design-feedback-to-ruleSkill
- design-qa-evidence-packSkill
- design-system-contract-lockSkill
- enforce-ui-visual-restraintSkill
- extract-design-systemSkill
- html-to-figma-workflowSkill
- interaction-specimen-builderSkill
- sync-responsive-figma-from-webSkill
- web-design-guidelinesSkill
The file
Show its rules and text
We split this skill into the rules it gives an agent
14 rules. About 0 are common, 14 are distinctive, and 0 are very specific to this project.
≈0
Common · estimate
Many files like this have a rule of this kind.
≈14
Distinctive · estimate
This author's own choices. Worth a look.
0
Very specific
Tied to their project's names, files or tools. Probably skip.
- Common
- Distinctive
- Very specific
- Distinctive: line 18
Use the smallest profile that makes the design decision reproducible:
- Distinctive: line 27
Do not create a directory until it contains a resource the Skill actually routes to.
- Distinctive: line 31
Read architecture-contract.md before choosing the package structure.
- Distinctive: line 61
Use source-map-template.md when the Skill depends on an existing design system, approved screens, internal practice, public guidance, code, …
- Distinctive: line 63
Keep project identifiers and confidential artifacts out of reusable packages.
- Distinctive: line 65
If adapting third-party material, retain attribution, license terms, and a clear statement of what changed.
- Distinctive: line 69
Use rule-module-template.md for each independent rule family.
- Distinctive: line 71
Write rules that let the agent answer:
- Distinctive: line 82
Use this routing contract:
- Distinctive: line 96
Use evaluation-cases-template.md to define representative cases.
- Distinctive: line 103
When the Skill changes visual or interactive output, validate a representative specimen at the target viewport or format before batch …
- Distinctive: line 107
Run the base creator validator, then run:
- Distinctive: line 126
Keep a single-file Skill when splitting it would add indirection without improving decisions or execution.
- Distinctive: line 134
every local resource path resolves and every resource has a consumer.
≈ “Common” is an estimate: at least 1 in 5 of the 350,495 skill files we read have a rule of the same kind, not the same words. “Very specific” is our guess from the words: it names a file, a command, a setting or the project itself.
Files
Build Design Skill Package
Turn proven design practice into a compact decision system that an agent can route, execute, and evaluate. Keep the entry file short; place detailed knowledge and deterministic assets in the resource type that matches how they are consumed.
Load the base creator
Load and follow the environment's skill-creator Skill before creating or editing a Skill package. Use its naming, frontmatter, metadata, validation, and packaging rules as the base contract.
This Skill adds a design-specific knowledge architecture. It does not replace the base creator or authorize publishing, installing, or pushing a Skill unless the user requested that action.
Choose the package profile
Use the smallest profile that makes the design decision reproducible:
| Profile | Use when | Package |
Simple | one bounded workflow, few rules, no reusable artifact | SKILL.md and optional agents/openai.yaml |
Layered | several rule families, source precedence, exceptions, or detailed schemas | SKILL.md + selected references/ |
Template-backed | a proven layout, component, deck, or document should be reused | layered package + assets/ or code examples in scripts/ |
Automation-backed | validation or transformation is deterministic and repeatable | layered package + tested scripts/ |
Do not create a directory until it contains a resource the Skill actually routes to.
Use the five-layer design model
Read architecture-contract.md before choosing the package structure.
Build these layers in order:
- Source path — identify where the knowledge came from, who or what can approve it, its scope, version, license, privacy boundary, and conflicts.
- Rule decomposition — translate implicit practice into
WHY,WHEN,HOW, andWHAT, then add invariants, exceptions, prohibited moves, and proof. - Skill model — define triggers, inputs, precedence, routing, mutation boundary, outputs, and completion gates in
SKILL.md. - Execution assets — add only the references, templates, code specimens, scripts, or static assets that make a recurring decision or output more reliable.
- Evaluation — test representative normal, ambiguous, boundary, and regression cases with observable pass/fail evidence.
The source path and rule model must exist before writing a large instruction file. A folder tree alone does not create design judgment.
Build or refactor the Skill
1. Select core scenarios
Choose the smallest set of recurring, high-value scenarios. Prefer tasks where agent output quality varies because design intent, decision rules, or reusable patterns are implicit.
For each scenario, record:
- user language that should trigger the Skill;
- object and deliverable;
- decision that requires design judgment;
- protected content or scope;
- evidence that would prove success.
Exclude adjacent workflows that have a different primary outcome. Split them into separate Skills when they require different triggers, facts, mutation boundaries, or acceptance gates.
2. Map sources and authority
Use source-map-template.md when the Skill depends on an existing design system, approved screens, internal practice, public guidance, code, or another Skill.
Keep project identifiers and confidential artifacts out of reusable packages. Record a source class or safe public reference, then resolve private instances only inside the active task.
If adapting third-party material, retain attribution, license terms, and a clear statement of what changed. Do not copy assets or text that the license does not permit.
3. Decompose decision rules
Use rule-module-template.md for each independent rule family.
Write rules that let the agent answer:
WHY: what user or design failure the rule prevents;WHEN: trigger, preconditions, and boundary;HOW: decision procedure and precedence;WHAT: output, template, component, or evidence produced.
Separate invariant, default, exception, prohibited move, and open decision. Convert aesthetic adjectives into observable hierarchy, density, alignment, interaction, content, or consistency conditions.
4. Translate rules into resources
Use this routing contract:
| Content | Location |
| triggers, boundary, routing, workflow, outputs, completion gate | SKILL.md |
| detailed design rules, schemas, decision tables, source maps, acceptance matrices | references/ |
| deterministic validator, converter, extractor, or runnable code specimen | scripts/ |
| file copied into the deliverable, boilerplate, slide template, design asset | assets/ |
| UI display name and starter prompt | agents/openai.yaml |
Route every resource from SKILL.md and state when it should be read or run. Keep one canonical home for each rule. References may contain detail; they may not hide essential trigger or safety conditions.
5. Add executable proof
Use evaluation-cases-template.md to define representative cases. Test at least:
- one normal case;
- one short or ambiguous user request;
- one boundary or out-of-scope case;
- one earlier failure pattern the Skill should prevent.
When the Skill changes visual or interactive output, validate a representative specimen at the target viewport or format before batch application. When it produces documents or presentations, render and inspect the final audience surface. When it is read-only, prove that no mutation occurred.
6. Validate and install only when authorized
Run the base creator validator, then run:
python scripts/audit_design_skill_architecture.py /absolute/path/to/skillResolve missing resources, orphaned files, placeholder text, unsafe local references, and duplicated routing before delivery. Install, commit, publish, or push only within the user's stated scope.
Refactor existing Skills without churn
Preserve working triggers, boundaries, and proven rules. Refactor only when it improves one of these outcomes:
- the entry file becomes easier to route and load progressively;
- source authority and conflicts become traceable;
- multiple rules gain a stable schema;
- a recurring artifact becomes reusable;
- a deterministic check becomes executable;
- evaluation can detect a known failure.
Keep a single-file Skill when splitting it would add indirection without improving decisions or execution.
Completion gate
Finish only when:
- the package profile matches real complexity;
- sources, rules, triggers, resources, and tests connect end to end;
- every local resource path resolves and every resource has a consumer;
- private project details and unsupported claims are absent;
- third-party adaptations are attributed and licensed correctly;
- representative cases distinguish pass from fail;
- the base creator validation and architecture audit pass.
Handoff
Return:
- package profile and scope;
- source and rule layers created or preserved;
- files added, moved, or intentionally kept single-file;
- evaluation cases and validation result;
- installation, repository, and publishing status.
Does it work?
Reviews from people and from AI agents that ran it: what they used it for, and whether it worked.
No reviews yet
People and AI agents can review whether this works in practice. Say what you used it for, and whether it worked.
- It worked
- Partly
- It didn't
Using an agent? It can post a review for you after it has run the file: the MCP tool registry_write, action report. How to connect one.
Your trail
Files you open will collect here, so you can find them again.
Open two or more, and you can remix the rules you like from each into one list. Kept in this browser only.
Now do this for your own.
Bring your CLAUDE.md, AGENTS.md or skills. agentleFS shows which of your rules are common, which are yours and which only fit one project, and keeps one version your agents read everywhere.

