デザイン未経験者でも簡単!Claude Design で提案用 Slides を自動生成する 3 つのステップ

@mmmsumo
日本語2 日前 · 2026年6月30日
281K
401
24
1
1.2K

TL;DR

本書では、デザイン未経験者が Claude Design を活用して Slides を生成するための 3 ステップを解説します。デザインシステムの構築からコンテンツの洗練、AI を活用した最終編集までを網羅しています。

個人事業主として、法人向けの求人支援をしています。提案スライドを作る機会が多いのですが、僕はデザイナーでもエンジニアでもありません。それでも「いい感じのスライドを、できるだけラクに作りたい」とずっと思っていました。

いくつかの生成AIを試したなかで、一番しっくりきたのが Anthropic の Claude Design 。実際に作ったスライドもお見せしながら、非デザイナー・非の僕でも再現できた3ステップを紹介します。

そもそもClaude Designって何?

前田まさき - inline image

Claude Design は、Anthropic の Claude を使ったデザイン専用ツールです。2026年4月に公開され、今のところベータ版という位置づけ。Claude Pro / Max / Team / Enterprise の有料ユーザーが使えます(無料プランでは使えません)。

ざっくり、できることはこんな感じです。

  • 題材を渡すと、スライド一式をまるごと生成する
  • 自分のブランド(色・フォント)に合わせた見た目で作れる
  • 画面を見ながら、対話や直接編集で修正する
  • パワポ(PPTX)・PDF・HTML などに書き出す

ChatでもCodeでもなく、なぜDesign?

前田まさき - inline image

Claude にはいくつか入口があります。ざっくり言えば、何でも相談はChat、コードはCode、資料の見た目はDesign。普通のチャットでもスライドは作れますが、Designの違いは整った見た目が安定して出てくることです。裏側がすべてコードで作られているため、配色や文字揃えが崩れにくく、変な仕上がりになりません。

スライド作成の3ステップ

  1. デザインシステムを作る:自分好みの見た目(形式)を1つ用意する
  2. 構成を練って生成する:伝える内容を詰めてから、一式を作らせる
  3. 仕上げて書き出す:画面を見ながら指示で整え、必要な形式で書き出す

ステップ1:デザインシステムを作る

前田まさき - inline image

Claude Designでの実施のやりとり画面

「デザインシステム」とは、色・フォント・余白の取り方といった見た目のルールを1つにまとめたものです。一度登録しておけば、資料を作るたびにこれを読み込んでくれるので、毎回こまかく見た目を説明しなくて済みます。

まずは claude.ai/design を開きます(はじめてなら、自動翻訳が使えるブラウザ版=Chromeがおすすめ)。

作り方の手順

  1. 上部タブの「Design Systems」→「Create」→「Create Here」
  2. 「Company name」に名前をつける(個人なら自分の名前でOK)
  3. 「Add fonts, logos and assets(フォント・ロゴ・素材)」と「Any other notes(メモ欄)」だけ触ればOK。あとは Claude の質問に答えていけば完成します。

素材の入れ方は2パターン

① お気に入りの資料が手元にある場合

いちばんラクです。過去のスライドや提案資料を「Add fonts, logos and assets」に入れ、メモ欄に目的を書くだけ。画像のほか DOCX・PPTX・XLSX に対応しているので、他ツールで作った資料も PDF や PPTX に書き出せば参考に使えます。

② 手元に何もない/今のが気に入っていない場合

前田まさき - inline image

getdesign.mdの画面

便利なのが getdesign.md。Apple や Stripe など有名企業の見た目を分析した design system が、コピー可能なテキストで公開されています。好きなブランドを選んでコピーし、メモ欄に“使う目的”と一緒に貼るだけ。デザイナーに参考イメージを渡す感覚です。

仕上げと公開

最初はざっくりで大丈夫。「見出しをもっと大きく」「この色は使わない」「余白を広く」とチャット欄でフィードバックを重ねて、好みに寄せていきます。

ちなみに今回スライド生成にあたり、以下を「図解の型」としてClaude Designに読み込ませ、活用しました。

前田まさき - inline image

出来上がったら左の目次でタイポグラフィや配色をチェックし、ロゴは自社のものがあればチャットに送って差し替え。最後に「Publish」で完成です。

ステップ2:構成を練って、生成する

前田まさき - inline image

題材を作るまでのブラッシュアップ過程

ステップ1が「形式(見た目)」を決める工程なら、ステップ2は「内容」を決める工程です。そして、いきなり題材を貼り付けて生成しないのがコツだと思っています。

僕はまず、通常のClaude(チャット)で構成案を壁打ちしました。「この資料で一番伝えたいことは何か」「どの順番なら相手に伝わるか」「このスライドは要るか」——そうやって内容を詰めてから、Claude Designに持ち込みます。

ここを飛ばして雑な題材をそのまま渡すと、見た目はキレイでも中身の伝わらない資料になりがちです。形式はステップ1、内容はこのステップ2で決まる、という感覚です。

構成が固まったら、Claude Designのトップで「Slides」を選択し、左下でさっき作ったデザインシステムにチェック。「発表資料を作りたい」と伝えてから、練り上げた構成を貼り付けます。

このとき、見た目はデザインシステムが担当してくれるので、自分は構成を添えれば十分。僕はいつも「1スライド1メッセージで」「結論は各ページの上に1行で」と書いています。しばらく待てば一式ができあがるので、まずは画面に映してざっと眺めてみましょう。

ステップ3:仕上げて、書き出す

仕上げは基本チャットへの指示だけ。気になる箇所を見つけて「ここをこう直して」を繰り返せば、たいてい完結します。直し方は3通り。

  • コメント:直したい部分をクリックして、その箇所にピンポイントで指示する
  • Tweak(つまみ):Claude が作る「調整つまみ」で、レイアウトや色の切り替えを自分でスライダーのように動かせる。一度付けば、何度動かしても生成し直し不要
  • Edit(手動編集):文字・サイズ・色の変更や要素の削除を自分で。2026年6月のアップデートで、ドラッグでの移動・リサイズもできるようになりました

形が整ったら、右上の Export から書き出します。

実際に、こんなスライドができました

前田まさき - inline image

配色・フォント・余白のトーンがページをまたいで揃っているのが、自分でも気に入っています。

**▼今回作成したスライドは、公式LINEから後日配布予定です

[公式LINEはこちら**](https://t.co/nvVcBEyjnz

おわりに

デザイナーでもエンジニアでもない僕でも、Claude Design だけでこの品質の資料が作れました。

この効果がは2社目、3社目と作るときで、最初に見た目を固めておけば、あとは題材を貼るだけでトーンの揃った資料が出てきます。クライアントごとに似た資料を繰り返し作る人ほど、最初のひと手間が活きます。

なお、ここで固めた「見た目」は、Claude Codeと組み合わせるとルールとして持ち運べるようになります。この一歩進んだ使い方は、また別の記事で書こうと思います。

もっと洗練されたやり方はきっとあると思いますが、これが今の僕なりの暫定的な最適解。気づきや学びがあれば、これからも X で発信していきますので、ぜひフォローいただければ幸いです。最後までお読みくださり、ありがとうございました。@mmmsumo

【関連記事】

https://x.com/mmmsumo/status/2071187115556122908

Turn one viral article into a full content workflow

Collect the source, decode the pattern, create assets, draft the story, and distribute from one AI workspace.

Explore YouMind

解読すべきパターンをもっと

最近のバイラル記事

バイラル記事をもっと見る