📅 2026年4月18日 ⏱️ 7分で読めます

Claude Designの使い方｜初稿作成、修正、出力、Claude Code連携までの手順

執筆小林編集ファネルAi編集部監修ファネルAi監修チーム最終更新2026年4月18日

Anthropicは2026年4月17日に Claude Design by Anthropic Labs を発表しました。Claudeと会話しながら、デザイン案、プロトタイプ、スライド、1枚資料などを作れるresearch previewです。

この記事では、Claude Designを実務で使う手順を整理します。ポイントは、いきなり見た目を作らせることではなく、目的、読者、素材、ブランド条件、出力先を先に渡し、Claudeの初稿を人間がレビューできる形にすることです。

Claude Designで目的設定、素材投入、初稿作成、修正、出力、レビューへ進む実務フロー — Claude Designは、作りたいものを伝えるだけでなく、素材、ブランド条件、出力先、レビュー条件をセットで渡すと実務に乗せやすくなります。

本記事のポイント

Claude Designは、目的、素材、ブランド条件、出力先を先に決めるほど初稿の精度が上がる。
修正は会話だけでなく、インラインコメント、直接編集、調整用スライダーを使い分ける前提で進める。
公開物にする前に、Canva、PDF、PPTX、HTML、Claude Codeのどれへ出すかと、人間レビューの範囲を決める。

この記事で扱うテーマ

Claude Designを始める前に決めること

Claude Designは、思いついた文章から視覚的な初稿を作れる点が強みです。ただし、入力が曖昧なままだと、きれいに見えるだけで成果指標やブランド条件に合わない案が出やすくなります。

最初に決めるべきなのは、作りたいもの、誰に見せるものか、どの素材を使えるか、最後にどこへ出力するかです。LP、営業資料、プロトタイプ、社内説明資料では、必要な粒度とレビュー観点が変わります。

準備する項目	入力する内容	精度に効く理由
目的	問い合わせ獲得、社内説明、営業提案、仕様相談など	構成とCTAの優先順位が決まりやすくなる
対象読者	経営者、マーケ担当、開発者、営業責任者など	言葉の抽象度と必要な説明量が変わる
素材	既存資料、画像、ブランドルール、コードベース、参考ページ	汎用的な見た目から自社文脈へ寄せやすい
制約	避けたい表現、必須要素、色、余白、画面サイズ	やり直し回数を減らせる
出力先	Canva、PDF、PPTX、HTML、Claude Code	作り込みの方向とレビュー方法が変わる

基本の使い方は5ステップで考える

Claude Designは、通常のデザインツールのようにキャンバス操作から入るというより、会話で制作条件を渡し、Claudeが初稿を作る流れです。その後、会話、インラインコメント、直接編集、調整用スライダーで詰めていきます。

実務では、最初の1案を完成品として扱うより、比較用の方向性を短時間で出し、人間が選ぶ前提で使う方が安定します。

claude.ai/design にアクセスし、作りたい制作物を選ぶ。
目的、対象読者、入れたい要素、避けたい要素、参考素材をまとめて渡す。
Claudeが作った初稿を見て、情報順、訴求、余白、色、CTAの位置を確認する。
会話、インラインコメント、直接編集、調整用スライダーで必要な修正を行う。
用途に応じてCanva、PDF、PPTX、HTML、Claude Codeへ出力し、公開前レビューを行う。

プロンプトは成果物ではなく判断条件を書く

Claude Designへの指示では、色や雰囲気だけを伝えるより、誰が何を判断するための制作物なのかを書く方が有効です。たとえば、LPならファーストビューの訴求、CTA、信頼材料、フォームまでの導線を指定します。

営業資料なら、商談のどの段階で使うのか、提案先が何を不安に感じているのか、最後に何を決めてもらいたいのかを書きます。Claude Designは視覚化の入口なので、成果物の目的を先に固定することが重要です。

LP案を作る場合

LP案では、商品説明よりも読者の課題、得られる成果、証拠、CTAの順番を指定します。AIでLPワイヤーフレームを作る手順と同じく、まず情報設計を固定してから見た目を調整します。

営業資料を作る場合

営業資料では、相手の業界、課題、提案のゴール、使ってよい実績情報を明確にします。PPTXへ出すなら、後で人間が編集しやすいように、1スライド1メッセージの構成を指定すると扱いやすくなります。

プロトタイプを作る場合

プロトタイプでは、見た目の好みよりも、ユーザーがどの順番で操作し、どこで迷いやすいかを伝えます。Claude Codeへ渡す予定があるなら、既存コンポーネントや実装制約も早い段階で添えるべきです。

出力先ごとの使い分け

Claude Designは、Canva、PDF、PPTX、HTML、Claude Codeへの引き継ぎが想定されています。どれが正解かは、作ったあとに誰が何をするかで決まります。

共同編集や軽い調整を優先するならCanva、提案書として配るならPDFやPPTX、実装へ進めるならHTMLやClaude Code連携を選びます。

出力先	向いている場面	公開前に見ること
Canva	社内外で編集しながら仕上げたい資料や簡易クリエイティブ	ブランドキット、権限、共同編集範囲
PDF	固定した提案書や配布資料	誤字、数値、リンク、法務表現
PPTX	営業資料や社内説明資料	スライド構成、図表の再編集性、テンプレート適合
HTML	Web案やプロトタイプ共有	レスポンシブ、アクセシビリティ、計測、セキュリティ
Claude Code	既存サイトやアプリへ実装したいUI案	コンポーネント整合、テスト、レビュー、デプロイ手順

仕事で使うときのレビュー項目

Claude Designで作った初稿は、見た目が整っていても、そのまま公開物にするべきではありません。人間が見るべきなのは、表現の正確性、ブランド適合、権利関係、アクセシビリティ、実装可能性です。

特に、社外公開するLPや営業資料では、数字、顧客名、事例、比較表現、商標、画像素材の権利を必ず確認します。Claude Codeへ渡す場合も、既存コードベースに合わせた実装とテストが必要です。

数値、引用、事例、料金などが根拠と一致しているか
ブランドカラー、ロゴ、文体、余白、CTAの優先順位が自社ルールと合っているか
第三者の商標、画像、人物、著作物を不適切に使っていないか
モバイル表示、コントラスト、フォーム導線、計測タグに問題がないか
Claude Codeへ渡す場合、既存コンポーネント、テスト、レビューの手順があるか

よくある質問

Claude Designはどこから使えますか？

2026年4月時点では、Claude Pro、Max、Team、Enterprise向けのresearch previewとして案内されています。開始URLは claude.ai/design です。Enterpriseでは管理者設定が必要になる場合があります。

Claude Designで最初に入力するべきことは何ですか？

作りたいもの、対象読者、使える素材、必須要素、避けたい表現、出力先を先に書くのが基本です。見た目の好みだけでなく、読者に何を判断してほしいかを指定すると実務に使いやすくなります。

Claude Designは日本語資料にも使えますか？

日本語の指示や構成案には使えますが、公開前には表記、改行、文字量、固有名詞、数字を人間が確認してください。画像内の文字や細かいタイポグラフィは特にレビューが必要です。

Claude Designで作ったものをそのまま公開してよいですか？

そのまま公開するより、初稿や比較案として扱うのが安全です。社外公開する前に、事実確認、権利確認、ブランド確認、アクセシビリティ確認、実装確認を行うべきです。

Claude Designを制作フローに組み込みたい場合

Claude Designは、初稿作成だけでなく、LP改善、資料生成、Claude Code実装までの流れを設計して初めて成果につながります。ファネルAiでは、AIを使った制作プロセスと公開前レビューの設計を支援しています。

制作フローの相談をする

メディア一覧へ戻る