Agentic Design System

Autor pokynů pro design-systém s pevnými brandovými tokeny a QA checklistem

od bergside · bergside/awesome-design-skills

Otestováno · Funguje ★ 8.0/10

Agentic Design System — Autor pokynů pro design-systém s pevnými brandovými tokeny a QA checklistem

Co umí

Vytváří pokyny pro design-systém připravené k implementaci ve stylu značky Agentic: pevné tokeny pro barvy/typografii/rozestupy, požadované stavy komponent, kritéria přijatelnosti WCAG 2.2 AA a QA checklist pro kontrolu kódu. Spouští se při psaní specifikací komponent nebo designového jazyka pro konverzační, AI-first uživatelské rozhraní produktu.

Testovací report

Spuštěno na specifikaci Button proti základní linii bez dovedností: vynucená tabulka tokenů dovednosti a její brána 'flag aesthetics-vs-accessibility conflicts' odhalily, že její vlastní primární barva značky #FF5701 dosahuje na bílém pozadí pouze 3.17:1 a selhává v kontrastu textu WCAG AA, což je vada, kterou základní specifikace přehlédla. Skutečně strukturovanější a testovatelnější výstup; slabým místem je popis v úvodní části, který zní jako UI archetyp a nikdy neříká 'design system', takže hrozí chybné spuštění u agentic coding úkolů.

Testováno: 2026-07-18 · Claude Code 2.x (agent harness)

Instalace

git clone https://github.com/bergside/awesome-design-skills.git
mkdir -p ~/.claude/skills
cd awesome-design-skills && cp -r skills/agentic ~/.claude/skills/agentic

Příkazy a ukázkové prompty

  • /agenticAutor pokynů pro design-systém s pevnými brandovými tokeny a QA checklistem

Skilly se spouštějí běžnými požadavky — žádné příkazy k zapamatování. Po instalaci ho aktivují prompty jako tyto (anglicky):

  • I need token-based design guidelines for a primary button in our AI chat UI.
  • Can you write component specs for a delegated-task agent interface?
  • Help me draft a design system for my conversational AI product's UI.