Claude Designが「想像以上」だった — だがFigma解約は待ってほしい

先週、筆者はこの記事で「AnthropicのAIデザインツールが今週来るらしい」と書いた。Figma株が6%下げた日の話だ。

あれから4日。Claude Designは本当に来た。そして正直に言うと、予想していたよりずっと面白い。

ただし「Figmaの代わりになるか」と聞かれたら、答えは明確にNoだ。Claude Designが解決する問題と、Figmaが解決する問題は、重なっているようで実はほとんど重なっていない。この記事では、触ってみてわかったことを整理する。

そもそも何ができるのか

Claude DesignはAnthropic Labsのリサーチプレビューとして4月17日に公開された。claude.com内からアクセスでき、Claude Pro（月$20）以上のプランで使える。

やることは単純だ。チャットで「こういうものが欲しい」と伝えると、デザインが出てくる。プレゼン資料、ランディングページ、UIプロトタイプ、ピッチデック。テキストを書く代わりに、ビジュアルを作る会話をする。

入力はプロンプトだけではない。DOCX、PPTX、画像をアップロードできる。WebキャプチャでURLからデザイン要素を取り込める。GitHubのリポジトリを指定すると、既存のコードベースを読んでデザインに反映する。

出力はPDF、PPTX、スタンドアロンHTML、共有URL。そして驚いたのが「Canvaに送る」ボタンが用意されていることだ。Claude DesignはCanvaをライバルではなくパートナーとして扱っている。

「15分でデザインシステム」は誇張ではなかった

触ってみて最も衝撃を受けたのは、デザインシステムの自動抽出だ。

オンボーディングで、Claude Designは自分のコードベースやFigmaファイル、フォントフォルダ、ロゴアセットを読み込む。そこからカラーパレット、タイポグラフィ、コンポーネント、スペーシングのトークンを自動で生成する。以降のプロジェクトは、すべてこのデザインシステムを継承する。

30年のキャリアを持つデザイナーが「15分でワーキングなデザインシステムが完成した」と報告している。教育テック企業のBrilliantは、競合ツールで20回以上のプロンプトが必要だった複雑なページが、Claude Designでは2回で済んだと語っている。

筆者が試した限りでも、既存のWebサイトのURLを渡して「この雰囲気でランディングページを作って」と指示すると、ブランドカラーやフォントの雰囲気をかなり正確に拾ってくれる。完璧ではないが、ゼロから作るのとは体験がまったく違う。

Claude Code連携が本当の差別化ポイント

他のどのデザインツールにもない機能がある。Claude Codeへのハンドオフだ。

デザインが完成したら、Claude Designは「実装バンドル」を生成する。コンポーネント構造、デザイントークン、コピーテキスト、インタラクションのノートがパッケージされたものだ。これをClaude Codeに渡すと、自分のスタックでそのまま実装が書かれる。

デザイン→コードが一直線に繋がるこの体験は、FigmaのDev Modeとは次元が違う。FigmaのDev Modeはデザインを「開発者が見やすい形で表示する」ツールだ。Claude Designの場合は、AIが「デザインの意図を理解した状態で、コードを書く」。人間の翻訳レイヤーが1枚減る。

スタートアップのファウンダーやインディーハッカーにとって、これは時間の節約以上の意味がある。デザインとコードの間で発生する「なんか違う」問題が、構造的に減る可能性がある。

正直、ここは厳しい

良いことばかり書いたので、ここから本音を書く。

トークン消費が重い。 ある開発者が報告したところでは、2セッションのデザイン作業でProプランの週間制限の58%を消費した。月$20のProプランで本格的にデザインを回すのは現実的ではない。チャットとClaude Codeの利用枠とは別計上だが、結局は「もっと使いたければMaxプランに上げてください」という構造になっている。

リアルタイム共同編集がない。 Figmaの最大の強みは、デザイナーとエンジニアが同じキャンバス上でリアルタイムに作業できることだ。Claude Designは基本的にシングルシート。組織内の共有URLでアクセスは可能だが、Figmaのマルチプレイヤー体験とは比較にならない。

プロのUI/UXワークフローには足りない。 コンポーネントライブラリの管理、バリアント、オートレイアウトの微調整、ピクセルレベルの位置合わせ。Figmaが10年かけて磨いてきたこれらの機能は、Claude Designにはない。プロトタイピングツールとしてはとても速いが、「このボタンの角丸を4pxから6pxに変えたい」といった精密な作業は想定されていない。

監査ログがない。 エンタープライズのコンプライアンス要件を満たせない。チーム開発で「誰がいつ何を変更したか」の追跡ができない。

Redditでの反応が象徴的だった。最も支持されたコメントは「これは、本物のUX/UIデザイナーと仕事したことがない人にだけ刺さるハイプだ」（149 upvote）。辛辣だが、一定の真実を含んでいる。

Figma・Canvaとの住み分け

では、Claude Designは誰のためのツールなのか。

結論から言うと、Figmaの代替ではなく、Figmaの前段階を担うツールだ。

デザインプロセスには段階がある。アイデアをラフに可視化する「探索フェーズ」と、それを精密に仕上げる「制作フェーズ」だ。Claude Designは前者を劇的に高速化する。後者はFigmaの独壇場のままだ。

Canvaとの関係はもう少し微妙だ。プレゼン資料やマーケティングアセットの領域では重なりがある。だがCanvaには2.65億人の月間ユーザーと60万以上のテンプレートがある。Claude Designが「Canvaに送る」エクスポートを用意しているのは、この現実を認めた上での設計だろう。

	Claude Design	Figma	Canva
得意なこと	高速プロトタイプ、デザインシステム抽出、Claude Codeへの受け渡し	プロ向けUI/UX、リアルタイム共同編集、ピクセル精度	テンプレート活用、マーケ素材、チーム共有
想定ユーザー	PM、ファウンダー、開発者	UI/UXデザイナー	マーケター、非デザイナー
料金	Claude Pro $20/月に含まれる	無料〜$75/月/エディタ	無料〜$30/月

使い所を選べば、かなり強い

Claude Designが刺さる場面を具体的に挙げる。

ピッチデックの初稿作成。 スタートアップの資金調達で最初に必要になる10〜15枚のスライド。コンテンツを渡して「こういうトーンで」と指示すれば、構成からビジュアルまで一気に出てくる。ここからデザイナーに渡して磨けばいい。

社内プレゼンの高速化。 週次報告やプロジェクト提案書を、箇条書きの資料からビジュアルに変換する。「見栄えのためにCanvaのテンプレを探す時間」が消える。

プロダクトのモックアップ。 新機能のアイデアを、コードを書く前に可視化する。エンジニアがPMに「こういうイメージ？」と確認するための素材を、チャット一回で作れる。

ランディングページのプロトタイプ。 URLを渡して「この競合サイトのテイストで、うちのサービスのLPを作って」。出てきたものをClaude Codeで実装バンドルにして、そのまま開発に入る。このフローが一番気持ちいい。

「デザイナーが要らなくなる」は正しくない

Claude Designは、デザインの「最初の一歩」を圧倒的に速くするツールだ。アイデアが頭にある段階から、人に見せられるビジュアルまでの距離が、劇的に縮まる。

だがそれは「デザイナーが要らなくなる」という意味ではない。むしろ逆だ。プロトタイプが簡単に作れるようになると、「ここからどう磨くか」というデザイナーの仕事の価値はむしろ上がる。ゼロからの作業が減り、判断とクラフトの時間が増える。

Figma株が下がったのは、市場がまだこの構図を正しく理解していないからだろう。Claude DesignとFigmaは、同じ問題の異なるフェーズを解いている。少なくとも現時点では、両方使うのが正解だ。

リサーチプレビューの段階で、ここまでの体験が出てくること自体が、Anthropicの「モデルだけの会社」からの脱却を示している。Claude Chat、Claude Code、Claude for Word、そしてClaude Design。Anthropicは静かに、Claude をプラットフォームに変えようとしている。