원클릭으로
design-system-governance
Design system governance and scaling: centralized vs federated, lifecycle, contribution model, multi-team adoption.
Codex 또는 Claude로 설치 이 Prompt를 복사해 Codex, Claude 또는 다른 어시스턴트에 붙여 넣으면 Skill 페이지를 검토하고 설치를 진행할 수 있습니다.
메뉴
Design system governance and scaling: centralized vs federated, lifecycle, contribution model, multi-team adoption.
Codex 또는 Claude로 설치 이 Prompt를 복사해 Codex, Claude 또는 다른 어시스턴트에 붙여 넣으면 Skill 페이지를 검토하고 설치를 진행할 수 있습니다.
SOC 직업 분류 기준
Generates complete brand identity systems with color psychology, typography pairings, and visual identity rules mapped to Universal Design System palettes. Use when the user asks for brand identity, brand design, brand colors, style guide, or visual identity.
Component documentation and Storybook: stories, MDX, props tables, usage guidelines from UDS component specs.
Audits existing UIs for WCAG accessibility, color contrast, typography hierarchy, spacing consistency, and industry anti-patterns. Generates scored reports with actionable fixes. Use when the user asks for design audit, UI audit, accessibility audit, or design review.
Figma to code handoff using UDS tokens. Align Figma variables with design-tokens.json, naming conventions, Dev Mode, and token sync.
Internationalization and right-to-left layout using UDS localization data. Logical CSS properties, dir="rtl", text expansion, and RTL mapper for existing CSS.
Multi-brand and theming: derive palettes from base, palette overrides, data-theme, white-label UI using UDS tokens.
| name | design-system-governance |
| description | Design system governance and scaling: centralized vs federated, lifecycle, contribution model, multi-team adoption. |
Use this skill when the user needs governance, scaling, or adoption guidance for a design system — including centralized vs federated models, lifecycle, contribution rules, and how the Universal Design System fits as a single source of truth with palette overrides for brands.
tokens/design-tokens.json — one file. Foundation tokens (spacing, motion, typography scale, z-index) are locked; palette tokens (color, shadow, radius, display font) vary per palette. Custom palettes can be added via palette.py create and merged into the same structure.src/data/components.csv and implementation (React/Vue/Svelte) — one canonical set. Variants and states are defined once; products use the same components with different data-theme (palette).src/data/ui-reasoning.csv — sector/product-type rules (e.g. IF sector=finance THEN palette=corporate). Governance can extend this with org-specific overrides or leave it as-is for recommendation only.UDS uses a defined lifecycle for components. Reference docs/governance/LIFECYCLE.md:
| Stage | Meaning |
|---|---|
| Proposal | RFC, discussion, acceptance criteria |
| Alpha | Initial implementation; API may change; limited a11y |
| Beta | API stabilizing; a11y audit; documentation draft |
| Stable | API frozen; WCAG 2.2 AA; docs and examples complete; cross-palette tested |
| Deprecated | Migration guide; maintained 2 major versions; then removed |
Promotion: Proposal → Alpha (RFC + impl), Alpha → Beta (API review + basic a11y), Beta → Stable (full a11y, docs, 2+ palette tests), Stable → Deprecated (replacement + migration guide).
Use this lifecycle in your own governance: e.g. new components start as Proposal, reach Stable only after a11y and docs, and deprecation is time-bound.
uds install, tokens in repo), (2) palette choice per product (data-theme), (3) component usage from the canonical list, (4) docs/Storybook for usage. Design ops can track adoption (e.g. token usage, component usage) to find gaps and deprecations.palette.py). Each product or brand sets data-theme to its palette. Single documentation and one codebase.| Topic | Reference |
|---|---|
| Component lifecycle | docs/governance/LIFECYCLE.md |
| Token architecture | CLAUDE.md or project Token Architecture section — foundation vs palette |
| Custom palettes | python src/scripts/palette.py create/list |
| Rules and reasoning | src/data/ui-reasoning.csv |
Governance should keep the design system predictable (lifecycle, tokens, components) while allowing controlled extension (palettes, rules) for multi-team and multi-brand use.