UI/UXデザインの意図を実装視点に翻訳・整理する。コンポーネント分解・責務整理・UI状態の洗い出し・実装構造の設計を行う。デザインからの実装・コンポーネント設計・実装プラン策定を依頼されたときに使用する。
ui-design-grounding スキルを呼び出し、以下のリファレンスを読み込む:
ui-design-grounding/reference/design-system.mdui-design-grounding/reference/design-tokens.mdui-design-grounding/reference/color-system.mdui-design-grounding/reference/implementation.mdui-design-grounding/reference/responsive-design.mdui-design-grounding/reference/motion-design.mdui-design-grounding/reference/typography.md## デザイン意図の整理
- ...
## コンポーネント構成案
| コンポーネント | 粒度 | 責務 | 再利用元 |
|-------------|------|------|---------|
| ... | Atom/Molecule/Organism | ... | 既存/新規 |
## UI状態一覧
| コンポーネント | Initial | Loading | Success | Error | Empty |
|-------------|---------|---------|---------|-------|-------|
| ... | ... | ... | ... | ... | ... |
## 実装上の注意点
- ...
## 推奨される次のステップ
- `/audit-ui`（実装後の技術品質監査 — a11y・パフォーマンス・トークン準拠を確認）
- `/optimize-ui`（パフォーマンス最適化 — CWV・レンダリング・バンドルサイズ）