create-design-doc
Installation
SKILL.md
create-design-doc
$ARGUMENTS で渡された入力文書(アイデア・要件文書)を読み、UX/UI デザイナーの専門家として UI/UX 設計資料一式を生成する。
プロト開発の前に「どんな見た目で・どんな場面で・どう使うか」を示す設計資料を作り、ユーザーの フィードバック・修正を挟むことで、期待値ずれを開発前に検出することが本スキルの存在理由であ る。そのため成果物は必ず冒頭に「前提と解釈」、**末尾に「フィードバック観点」**を含む。
想定利用シーンは「ユーザーが PO(プロダクトオーナー)で、AI が承認会に資料を持ってきて説明
する」形。レビューの主役は storyboard.png(主要シナリオの流れに沿って各画面の表示要素を
日本語説明する縦長1枚)であり、wireframes/*.html と screens/*.png はその部品/実装用
素材という位置づけになる。
Figma ではなく HTML ワイヤーフレームを採用する理由
Figma はファイル生成 API が無くエージェント生成に不向き。HTML はブラウザ確認・スクショ資料 化・実装への直接流用が可能なため採用する。