プロンプトを重ねて精度を上げる——段階的指示テクニック

最初のうち、ぼくは「全部を一つのプロンプトに詰め込む」スタイルで使っていた。フォントサイズ、カラー、レイアウト、コピーライティング、雰囲気、参考にしたいブランド——全部まとめて投げる。結果、何が起きたかというと、「悪くはないけど何かが違う」アウトプットが量産された。

Claude Designは入力が多いほど迷う。これを理解してから、段階的に指示を重ねる方法に切り替えた。精度が明らかに上がった。

なぜ一発指示で完成しないのか

Claude Designも人間のデザイナーと同じで、「まずラフを作る→詰める→仕上げる」というフローが合っている。全部を最初から決めようとすると、優先順位をつけられずに中途半端な妥協点を出してくる。

特にやりがちな失敗が「構造の指示」と「細部の指示」を同時に出すこと。「ヘッダーは大きく、フォントはNoto Sans Bold 32px、背景はグラデーションで#1a1a2eから#16213e、CTA は右下に配置、影はこのくらいで……」と詰め込むと、どれかが無視される。

※Claude Design: Anthropic Labsが開発したAIビジュアルデザインツール。テキストプロンプトからUI・スライド・マーケ資料などを生成する。※CTA: Call To Action（行動喚起）。ボタンやリンクでユーザーに次の行動を促す要素。

段階的指示の3ステップ

Step 1: 構造とトーンだけ決める

SaaSのLP用ヒーローセクションを作って。
ターゲット：中小企業の経営者
トーン：信頼感・プロフェッショナル
レイアウト：左にコピー、右にイメージ
色は後で指定するので、今はグレースケールでOK

これだけ。色や細かいタイポグラフィは一切入れない。

Step 2: 色とフォントを追加する

Step 1の出力を見て「構造はOK」と確認してから：

この構造のままで、以下を適用して：
・メインカラー：#2563EB（青）
・アクセント：#F59E0B（アンバー）
・見出し：Noto Sans JP Bold
・本文：Noto Sans JP Regular、18px

Step 3: 細部を詰める

いい感じ。以下だけ修正して：
・CTAボタンをもう少し大きく（パディング16px以上）
・見出しの行間をもう少し広げて
・右のイメージエリアに薄い影をつけて

一度に一つか二つの変更にとどめる。これが重要。

※LP: ランディングページの略。特定のCTAに向けて設計されたWebページ。

実際にやってみた例——SNSバナー

先週、クライアントのInstagram用バナーを作った。テキスト多めのインフォメーション系で、デザインが難しいやつ。

Step 1で「縦長、情報を上から下に流す、ブランドカラーはまだ入れない」と指示したら、読みやすい構造が出てきた。Step 2でブランドカラーを注入。Step 3でフォントサイズの微調整と余白の調整。

3回のやり取りで完成まで持っていけた。一発で詰め込んだ時より体感で2倍速い。

「修正を重ねすぎて迷子」になる罠

段階的指示の落とし穴は、細かい修正を積み重ねすぎること。5〜6回修正を重ねると、Claude Designの出力がだんだんおかしくなってくる。直したはずの部分が戻ったり、別の箇所が崩れたりする。

ぼくのルールは「3〜4回修正したらいったんリセット」。そこまでの学習（何が良くて何が悪かったか）をまとめて、最初から新しいプロンプトで仕切り直す。

ここまでの方向性をまとめると：
・ミニマルで余白多め
・青×白のみ、装飾なし
・ヘッダーだけ太め、本文は細め
・CTAは右下に固定

この方針で、ヒーローセクションを最初から作り直して

このリセットプロンプトを作る作業が、実はデザインの整理にもなる。

※プロンプト: AIへの指示文。Claude Designでは自然言語でデザインを指示する。

段階的指示が特に効く場面

• 複数要素が入るLPやスライド
• ブランドガイドラインが細かく決まっているケース
• 「なんとなくのイメージ」しかない状態からスタートする時

逆に、シンプルなSNS用アイコンや単色バナーなら一発指示の方が早い。使い分けが大事。

最初から完成品を求めようとするより、「荒削りを磨く」プロセスとして使う方がClaude Designとは相性がいい。これに気づいてから、ストレスがだいぶ減った。