デザイナー以外でも、Claude Codeでデザインを作れるために取り組んだこと｜坪田 朋
この記事で分かること
デザイン経験がないエンジニアでも、Claude Codeを使ってUIデザインを生成するための工夫が得られる。具体的には、デザインシステムのルールをプロンプトに組み込む方法や、生成結果を段階的に修正する手順が紹介されている。
詳細要約
デザイン未経験者がClaude Codeを使って実用的なデザインを生成するには、プロンプトに「デザインの目的」と「避けたい表現」を明示することが有効。具体的には、配色やレイアウトの意図を一文で説明し、同時に「派手すぎない」「情報が詰まりすぎない」といった否定的な条件を加えることで、意図に沿った出力を得やすくなる。また、生成結果に対して「この部分の余白を詰める」「フォントサイズを一段階下げる」など、修正指示を一つずつ与えると、試行錯誤の回数を減らせる。