Claude Design × Claude Code：実感を生む補助輪を託し直す

前回「Claude CodeによるtoB LP生成サイクル」のPhase 2に、Google Stitchを組み込みました。今回はこのサイクルに"Claude Design"をどう組み込むかを考えました。

目的は変わらない：企業内におけるtoB LPの量産

ツールが変わっても、目的は同じです。デザイナー以外の社員でもLPをデザイン・実装できる仕組みをつくること。

軸はClaude Codeのまま。Phase 2の補助輪を、Stitchから入れ替えるかどうか。ここが今回の判断ポイントでした。

Claude Designの性質：描く手前にある"翻訳"

触ってみて、Claude Designは単なるデザイン生成ツールではないと感じました。強みは3つ。質問設計力、リサーチ力、表現力。

「サービスデザインのスライドを作って」と一文渡しただけで、目的・トーン・トピックの分岐を提案してきます。領域知識・ブランドカラー・タグラインを自律的に調べてくる。指示がなくても判断を先回りしてくる。

これは、描く技術の手前にある「翻訳」。ユーザーの曖昧な意図を"デザインの語彙"に変換する。これまでデザイナーがヒアリングで担っていた役割が、AIに移りつつあります。

ツール横断のコストと、視覚判断の質

組み込むかどうかを考えるとき、悩んだのはトレードオフの構造でした。

Claude Designを挟めばツール横断のコストが発生しますが、Claude Codeであれば一気通貫の体験が得られる。一方で、Claude Designは視覚を見ながら判断できる質が得られる。ここがトレードオフの核心です。

どちらを優先するか。その判断には"目的"に立ち返る必要がありました。

決め手は、ユーザーの"実感"

決め手はユーザーの"実感"でした。ターミナルで生成されたHTMLを見て「デザインの楽しさ」を感じるのは難しい。

しかし、Claude Designで画面を触りながら調整した成果物には、「自分でデザインした」という感覚と楽しさがあると思うのです。

Claude Designは、"デザインができる"という実感をすべての人に与えてくれるツールです。私は「誰でもデザインできる環境」を設計したい。よってこれは、"使われるために"必要な実感です。

Phase2の補助輪として組み込む

軸はClaude Codeのまま。Claude Designは「可変部分のデザイン検証」に限定して組み込みました。FVのトーン、各業界への訴求表現、ビジュアル案。複数案を生成・比較し、確定したらClaude Codeにハンドオフする。

Stitchのときと同じ構造です。中の役者だけが変わりました。サイクルの骨格は保ったまま、Phase 2の補助輪を入れ替える。この判断の一貫性こそが、仕組みを長く使える状態にすると思っています。

変わらない軸、変わる景色

3つのmdファイル（デザインシステム・LP構造・コンテンツ原稿）が判断基準として機能することは変わりません。ツールが変わっても、mdが軸として効き続ける。

Stitchのときと同じく、"やらないこと"を決める発想も変わりません。可変と不可変の層を定義して、AIの創造性をどこで活かすかを制御する。枠と型を決めて、狙ったものを生成する仕組みをつくる。

変わるのは、仕組みに触れる人の景色です。ターミナルを前に身構えていた人が、画面を見ながら「もう少し強く」と指示できるようになる。デザインが、もう少しだけ身近なものになる。

「誰でもデザインできる」に、また一歩近づいた気がします。