AI DS Composer

Ræsonnerer gennem designsystem-metadata for at komponere UI fra eksisterende komponenter i stedet for at opfinde ny kode.

Af cris-achiardi · cris-achiardi/claude-skills

Testet · Virker ★ 9.2/10

AI DS Composer — Ræsonnerer gennem designsystem-metadata for at komponere UI fra eksisterende komponenter i stedet for at opfinde ny kode.

Hvad det gør

Vejleder Claude til at læse et projekts hierarkiske designsystem-metadata (filosofi på topniveau, metadatafiler per atom/molekyle/organisme) og vælge komponenter, varianter og props ved at citere selectionCriteria snarere end intuition. Udløses ved generering eller ændring af UI-komponenter/layouts, hvor genbrug og overholdelse af et eksisterende designsystem er vigtigt, og markerer udtrykkeligt anti-mønstre og ikke-kortlagte krav i stedet for lydløst at opfinde komponenter.

Testrapport

Bad om en fremtrædende hero CTA-knap til /pricing: baseline-svaret udsendte blot <Button href> uden yderligere overvejelse, mens skill'en fremhævede det medfølgende anti-mønster ('Button for plain navigation → use Link') og derefter eksplicit ræsonnerede gennem den dokumenterede undtagelse for primære hero CTA'er, før den beholdt Button — en beslutning, baseline aldrig engang overvejede.

Testet: 2026-07-14 · Claude Code 2.x (agent harness)

Installation

git clone https://github.com/cris-achiardi/claude-skills
cd claude-skills
mkdir -p ~/.claude/skills
cp -r skills/ai-ds-composer ~/.claude/skills/ai-ds-composer

Kommandoer og eksempelprompter

/ai-ds-composerRæsonnerer gennem designsystem-metadata for at komponere UI fra eksisterende komponenter i stedet for at opfinde ny kode.

Skills udløses af almindelige forespørgsler — ingen kommandoer at huske. Efter installationen aktiverer prompter som disse skillen (på engelsk):

I need a button for the hero section, what fits our design system?
Build this card using our existing design system components
Does this new Modal fit our design system or should I reuse something?

Læs hele rapporten →