デザイン・図解・スライド

《 Claude完全ガイド 目次へ 》

10秒でいうと

Claudeは画像を生成できません。できるのは、図をコードで書くことです。
だから部分だけ直せて、何度でも書き出せます。この違いが実務では効きます。

まず、できないことから

公式ドキュメントがはっきり書いています。

Claudeは画像を理解するモデルであり、画像を生成・作成・編集・加工することはできません。

イラストを描かせる、写真を加工する、雰囲気のあるビジュアルを作らせる。これらはできません。

では何ができるのか

図解と画像生成は別のもの
図1:図解と画像生成は別のもの

図をコードで書けます。SVG、HTML、図表の記述言語。文字と線と四角で構成される図なら、コードとして書き出せます。

これが画像生成より優れている点が3つあります。

部分だけ直せる。「3つ目の箱のラベルだけ変えて」が通ります。画像だと作り直しです。

何度でも書き出せる。1つのSVGから、Web用のPNG、印刷用のPDF、スライド用の1920×1080を出せます。元が同じなので、ずれません。

文字が正確。画像生成でよくある「文字が崩れる」が起きません。テキストとして入っているためです。

本ガイドの作図フロー

このガイドの図は、全部この方法で作られています。

1. スライドを基準に作る。全図面を1920×1080で作り、Web用と書籍用はそこから書き出します。逆にすると失敗します。Web用に作った密度の高い図を16:9に押し込むと、文字が小さく要素が多いスライドになるからです。

2. 型を5つに限る。構造図、フロー図、比較図、階層図、概念図。新しい型を作りたくなったら、既存の型で表現できないか先に考えます。並べたときの一貫性は、型が揃っているかで決まります。

3. 上限を決める。1枚に箱は7つまで、矢印は8本まで、色は3つまで。上限に達したら、要素を小さくするのではなく図を分けます。

4. 機械で検査する。文字が小さすぎないか、安全域からはみ出していないか、指定したフォント以外が使われていないか。落ちたら書き出しません。

5. 目で見る。書き出した画像をClaudeに読み直させて確認します。機械が見落とすのは意味の破綻、目が見落とすのは数値のずれなので、両方要ります。

実際に頼むとき

(説明したい内容)の図を作ってください。

・SVGで、1920×1080
・箱は5つまで、矢印は4本まで
・文字は28px以上
・色は3色まで。色だけで意味を持たせず、ラベルも付けてください
・背景は白で明示的に塗ってください

まず構成だけ言葉で説明してください。SVGはそのあとで。

最後の1行を入れると、方向が違うときに早く気づけます。

色だけで意味を持たせないは、外せない指定です。理由は3つ。印刷がモノクロになる可能性、色の区別がつきにくい読者がいること、動画は圧縮で彩度が落ちること。

スライド

同じ考え方です。1枚1メッセージ。

(テーマ)のスライドを作ってください。

・1枚に言いたいことは1つだけ
・1文で言えないなら、2枚に分けてください
・文字は大きく、量は少なく
・話す内容(ナレーション)は別に書いてください

まず全体の構成を、1枚1行で見せてください。

ナレーションを別に書かせるのが要点です。スライドに全部書くと、読み上げるだけの資料になります。

画像が要るとき

写真やイラストが必要なら、Claude以外の手段を使ってください。そのうえで、Claudeは次に使えます。

  • 素材の選び方の観点を出す
  • できた画像を読んで、意図が伝わるか確認する(No.17)
  • 素材のファイル名と整理(第4章のCowork)

作れないことと、関われないことは違います。

やってみよう:図を1枚作らせる(5分)

説明したい仕組みを1つ選んでください。

プロンプト
“`
(説明したい内容)の図を作ってください。

・SVGで、1920×1080
・箱は5つまで、矢印は4本まで
・文字は28px以上
・色は3色まで。色だけで意味を持たせず、ラベルも付ける
・背景は白で明示的に塗る

まず構成だけ言葉で説明してください。SVGはそのあとで。
“`

できたら、箱を1つだけ直させてください。

期待される結果:指定した箱だけが変わり、他は元のまま。画像生成では起きないことです。

うまくいかないとき:全体が作り直されたら、「他の箱はそのままで」と足してください(No.15)。

つまずきポイント

画像を生成させようとする。できません。

Web用のサイズで図を作る。あとでスライドにできません。大きいほうを基準に。

要素を詰め込む。上限に達したら図を分けてください。

色だけで意味を持たせる。印刷、色覚、圧縮の3つで壊れます。

関連ページ

まとめ

  • 画像は生成できない。図をコードで書ける
  • 利点は部分だけ直せる・何度でも書き出せる・文字が正確
  • 大きいほうを基準に作る。スライドからWebへ
  • 色だけに意味を持たせない

次に読む

写真と動画のワークフロー

→ ガイドの目次に戻る

※本記事の情報は 2026年8月時点のものです。

タイトルとURLをコピーしました