Claudeをデザインアーキテクトに変える指示レイヤー
ux-ui-agent-skillsは、Claude Codeに構造化されたデザイン指示を与えるスターターキット。CLAUDE.mdを配置するだけで動作し、外部依存はない。
7つのスキル領域で構成される:
- トークン生成 — DTCG形式JSONでPrimitive→Semantic→Componentの3層アーキテクチャを出力
- コンポーネント設計 — アトミックデザイン準拠。解剖学・バリエーション・状態・アクセシビリティ仕様を含む
- コード生成 — React 19 + Tailwind v4、Next.js 15、SwiftUI 6に対応
- アクセシビリティ監査 — WCAG 2.2 AA/AAA準拠の優先度付けレポート
- デザインレビュー — 6次元評価とNielsenの10ヒューリスティクス
- デザイン→コード変換 — トークンマッピング、状態ドキュメント、エッジケース処理
- プロトタイピング — 5段階の忠実度ラダーとユーザビリティテストスクリプト
トークン設計からアクセシビリティ監査まで、デザインシステムの構築プロセス全体をカバーする。114 stars。
