К основному содержанию
скилл CX Codex

governance — скилл для Claude Code: версии, депрекация, вклад

Скилл ведёт правила развития дизайн-системы: SemVer для токенов и компонентов, порядок приёма правок, депрекация и оповещение о изменениях.

Установить в Claude Code · Через Skills CLI (Vercel) Все способы и платформы ↓
npx skills add plugin87/ux-ui-agent-skills --skill governance -a claude-code
Открыть на GitHub

Что делает governance

Скилл разбирает изменение по уровню SemVer. Переименовали токен или проп, поменяли анатомию компонента — это major. Добавили токен, вариант или необязательный проп — minor. Поправили контраст, баг или значение в допуске — patch.

Для нового компонента или токена скилл требует подтвердить повторяющуюся потребность: минимум два места, где он нужен, прежде чем двигать его из продукта в candidate, а потом в core. Депрекация оформляется иначе: причина, замена, версия удаления, работающий компонент держится не меньше одного minor-цикла, плюс карта миграции. Удаление — только в major.

Скилл читает файлы из набора, а не из себя. Если установлены только папки скиллов (так делает npx skills add), проверка в начале вернёт KIT_MISSING — тогда нужен npx ux-ui-agent-skills init или установка плагина, иначе скилл остановится. Готовность подтверждается прогоном python3 ${CLAUDE_SKILL_DIR}/../../../scripts/validate_tokens.py и повторной проверкой контраста, если менялись цвета.

Какие задачи решает

  • решить, какой уровень версии ставить для правки токена
  • завести порядок приёма правок в дизайн-систему
  • пометить компонент устаревшим и дать замену
  • собрать карту миграции со старого токена на новый
  • не дать системе расползтись на дубли компонентов

Примеры запросов агенту

  • Помоги решить, это major или minor: переименовали токен color-bg-subtle
  • Оформи депрекацию компонента OldButton: причина, замена и версия удаления
  • Проверь, что новый токен нужен минимум в двух местах, прежде чем добавлять его в core

Как установить governance

1Через Skills CLI (Vercel)

npx skills add plugin87/ux-ui-agent-skills --skill governance -a claude-code

2Вручную: положить файлы

~/.claude/skills/governance/SKILL.md

Папка скилла целиком; для одного проекта — .claude/skills/governance/

По шагам, с командами для каждой платформы: Как установить скилл в Claude Code: пять способов

Вопросы о governance

Как установить governance в Claude?

Выполните npx skills add plugin87/ux-ui-agent-skills --skill governance -a claude-code. После этого скилл лежит в ~/.claude/skills/governance/SKILL.md.

Что делает скилл governance?

Классифицирует изменения дизайн-системы по SemVer, задаёт порядок приёма правок и правила депрекации. Ещё следит, чтобы у каждого изменения была запись в changelog.

Что нужно, чтобы скилл заработал?

Файлы набора: скилл читает workflows/governance.md и другие файлы по относительным путям. Если установлены только папки скиллов, проверка вернёт KIT_MISSING — тогда нужен npx ux-ui-agent-skills init или установка плагина.

Исходный текст

SKILL.md · MIT
---
name: governance
description: Govern how the design system evolves (SemVer for tokens/components, the contribution workflow, deprecation policy, and change communication). Use when the user wants to add/promote/deprecate a component or token, decide a version bump, set up a contribution process, or keep the system from fragmenting.
# `invocation:` was not a field Claude Code reads - unknown frontmatter keys are
# ignored without an error, so these six were auto-invocable the whole time they
# were marked user-only. This is the field that actually does it.
disable-model-invocation: true
---

# Skill: Governance

> **Step 0: is the kit here?** This skill reads files from the kit. Check once:
> `ls ${CLAUDE_SKILL_DIR}/../../../tokens >/dev/null 2>&1 && echo KIT_OK || echo KIT_MISSING`
> On `KIT_MISSING` only the skill folders were installed, which is what
> `npx skills add` does. Say so plainly, point the user at
> `npx ux-ui-agent-skills init` or the plugin install, and stop. Do not guess the
> contents of a file you could not open.

Keep the system consistent as it grows. Apply versioning, contribution, and deprecation rules.

## Steps
1. Read `${CLAUDE_SKILL_DIR}/../../../workflows/governance.md` (SemVer table, contribution workflow, deprecation policy, change comms).
2. Classify the change: **major** (breaking: renamed/removed token or prop, changed anatomy/default), **minor** (additive: new token/component/variant/optional prop), **patch** (fix: contrast/bug/doc/value tweak in tolerance).
3. For a **new** component/token: confirm it serves a real, repeated need (≥ 2 places) before promoting product → candidate → core. Design it to the full quality bar (`${CLAUDE_SKILL_DIR}/../../../.claude/rules/components.md` → Component Quality Bar).
4. For a **deprecation**: mark with reason + replacement + removal version; keep working ≥ 1 minor cycle; provide a migration map (`${CLAUDE_SKILL_DIR}/../../../design-systems/crosswalk.md` style); remove only in a major.
5. Wire any new file into `CLAUDE.md` (File Reference Map + relevant table/router) and add a changelog entry.

## Verification (definition of done)
- Change has a SemVer level **and** a changelog entry.
- Removals have a deprecation window, a replacement, and a migration table.
- New spec meets the 8-state + a11y + token-mapping bar and is reachable via the router.
- `python3 ${CLAUDE_SKILL_DIR}/../../../scripts/validate_tokens.py` passes; contrast re-checked if colors changed.

© plugin87 · MIT · plugin87/ux-ui-agent-skills

Похожие скиллы

Всё по теме «Дизайн» →
design-system-governance Owl-Listener Скилл описывает, как дизайн-система меняется: кто владеет, кто предлагает правки, как версионировать и что выводить из обращения. Нужен, когда над системой работает несколько команд. CX Codex +1 1 700установок api-versioning-policy Samuel Berthe Скилл помогает составить регламент версионирования и вывода API из эксплуатации. Пригодится при подготовке к ломающим изменениям или переходу на схему /v2. CX Codex +1 7 600установок figma-generate-library официальный openai Скилл для синхронизации дизайн-системы Figma с кодовой базой. Помогает создать или обновить переменные, компоненты, режимы (светлая/тёмная тема) и документацию в правильном порядке — без фаз, выполненных в неправильной последовательности. CX Codex +1 2 700установок om-ux-setup open-mercato Собирает дизайн-систему вашего репозитория в .uxproof/, чтобы UX-скиллы судили код по вашим правилам, а не по встроенным. CX Codex +1 2 500установок professional typeui.sh Задаёт агенту правила дизайн-системы: токены, типографику, состояния компонентов и критерии доступности. Пригодится, когда нужен аккуратный интерфейс без ручных правок. CX Codex +1 2 400установок claude typeui.sh Задаёт агенту правила оформления интерфейса: тёплая бумажная основа, почти чёрные чернила, сдержанный акцент. Пригодится, когда нужен строгий редакционный вид без теней и градиентов. CX Codex +1 2 300установок

Из того же набора16

design-component Создаёт спецификацию UI-компонента с анатомией, 8 состояниями, токенами и доступностью. Пригодится при проектировании контролов в дизайн-системе до написания кода. CX Codex +1 522установок ux-writing Пишет и проверяет тексты интерфейса: кнопки, ошибки, пустые состояния и уведомления. Пригодится, когда нужен единый тон без обвинений и тупиковых сообщений. CX Codex +1 517установок design-qa Настраивает проверки интерфейса перед слиянием: токены, контраст, доступность и визуальные снимки. Нужен для контроля состояний компонентов и регрессий. CX Codex +1 516установок brandkit Создаёт систему бренд-токенов и theme.css по брифу, включая светлую и тёмную темы. Нужен для новой палитры, типографики и единой основы интерфейса. CX Codex +1 510установок migrate-design-system Скилл сопоставляет ваши дизайн-токены с внешней системой: Material 3, Apple HIG, Fluent, Carbon, shadcn/ui. Пригодится при миграции или переходе на чужой стек. CX Codex +1 487установок prototype Ведёт проектирование интерфейса по лестнице детализации от структуры контента до кода. Помогает собирать вайрфреймы, карты путей пользователей и сценарии тестов. CX Codex +1 484установок token-build Превращает DTCG-токены в артефакты для платформ: CSS-переменные, Tailwind @theme, JS/TS, iOS и Android. Нужен, когда тема задаётся один раз, а собирается под каждый стек. CX Codex +1 480установок figma-integration Синхронизирует токены и компоненты между кодом и Figma в обе стороны. Пригодится для настройки Variables, MCP-связи и проверки расхождений. CX Codex +1 478установок

Спонсоры проекта

Компании, которые помогают держать аналитику открытой