Claude Codeに「/create-design-md」を自作して、0→1開発のUIブレをなくした話
Zenn / 2026/4/26
💬 オピニオンDeveloper Stack & InfrastructureTools & Practical Usage
要点
- Claude Codeに対して「/create-design-md」を自作し、0→1開発時のUIブレを抑えるための設計指示ワークフローを整備した。
- コマンド(/create-design-md)を起点に、UIの方針・粒度・表現を揃えることで、初期段階の試行回数と手戻りを減らす狙いがある。
- 生成AIの出力を“その場の提案”ではなく“開発プロセスに組み込む手順”へ落とし込む発想がポイントだ。
- UI表現の揺れを抑えるため、テンプレート化された指示(設計MD)を用いて再現性を高めている。
2025年末ごろから、AIコーディングエージェントの文脈で DESIGN.md という概念が広まり始めました。
これまで README.md が「人間向けのプロジェクト説明書」として機能してきたように、DESIGN.md は 「AIエージェント向けのデザイン仕様書」 として機能します。カラートークンやタイポグラフィ、コンポーネントのルールをAIが解釈できる形で列挙したものです。
きっかけのひとつは Google Stitch です。Stitchを使えば、デザインファイルから DESIGN.md を自動生成できます。
しかし、「 Stitchを使わない環境(個人開発の0→1フェーズや、まだ...
この記事の続きは原文サイトでお読みいただけます。
原文を読む →
