設計→実装を1本のAIで
デザイナーがデザイン画像を作り、それを見てエンジニアがコードを書く——ウェブサービスを立ち上げるとき、この2段階は長年「当たり前」だった。2026年4月16日、その工程が1本のAIでつながる可能性が生まれた。
AIを開発する米Anthropicが、2つのサービスを同日に発表した。ひとつは「Claude Design」。デザインのイメージ画像やメモを渡すと、ウェブサイトを動かすコード——ページの設計図にあたるもの——を自動で生成するサービスだ。デザインツール大手「Figma（フィグマ）」のファイルをそのまま読み込み、数分でウェブ公開できる状態のコードを出力する。
もうひとつが「Claude Opus 4.7」。Anthropicが出す最上位のAIモデルで、コードを書く「実装」の能力を大幅に強化し、コーディング性能の業界標準テストで首位に立った。
2つを組み合わせると、「何を作りたいか」のイメージさえ用意すれば、デザインから実装まで1本のパイプラインで進む道ができる。「絵を描く人」と「コードを書く人」が別々に動いていた工程が、AIの中でつながるという構造の変化だ。
ただし現時点で、Claude Designは「研究プレビュー」という試験段階にある。招待制で限られたユーザーにだけ公開されており、料金・提供条件ともに未発表。一般向けの本格展開はこれからだ。
設計書がコードに変わる仕組み
モックアップが即コードに
Claude Designの操作の流れはこうだ。デザインのスクリーンショット（画面を静止画として保存したもの）か、すでに公開されているウェブページのURLを渡す。AIがその画像を読み取り、ボタンや文字の配置・色・余白を解析して、まずインタラクティブなプロトタイプ——実際に操作できる動く見本——を生成する。問題なければ、そのコードをそのまま公開サーバーに転送できる。
このとき自社のデザインに合わせた出力を得るために使うのが「デザインシステム」だ。会社のロゴ・色・フォントなど、ブランドのルールをまとめたもので、Claude Designに事前に登録しておくと、以降に生成されるすべてのページに自動で適用される。デザイナーが毎回「このボタンはうちのブランドカラーで」と指示する手間がなくなる。デザイナーが日常的に使うFigmaのファイルをそのまま読み込める設計になっているため、既存の作業ファイルを持ち込むだけで始められる。
精度を底上げしているのが、今回同時に強化された画像認識能力だ。Opus 4.7では、画像の解像度上限が従来の3倍以上に拡張され、高密度なスクリーンショットや設計図の細部まで正確に読み取れるようになった。AnthropicはClaude DesignがOpus 4.7を内部エンジンとして使用しているかどうかを公式には明らかにしていない。ただ、2つの発表が同日だったこと、Claude Designの精度向上と画像認識強化のタイミングが一致していることは、両者の関係を示唆している。
1指示で実装が始まる
出てきたコードは、デザイナーからエンジニアへの「引き継ぎ」なしにそのまま動かせる状態だ。これまで設計・確認・修正・実装・公開と分かれていた工程が、AIの中で圧縮される。
コーディングで業界首位に
楽天グループが自社の旅行サービス「楽天トラベル」で行った検証が、変化の大きさを示す。日付を選ぶカレンダーや宿泊施設の絞り込みフィルターといった複雑な画面要素——前の世代では再現できなかったものが、Opus 4.7では正確にコードへ変換された。楽天が独自に設けた評価基準「Rakuten-SWE-Bench」では、タスクの解決数が前モデルの3倍に達した。AIを担当するゼネラルマネージャー・加地勇介氏は「コードの品質もテストの品質も、2桁ポイント向上した」と報告している。
この数字を支えているのは、モデル自体の性能向上だ。開発者の世界には「SWE-bench Verified（エスダブリューイーベンチ・ベリファイド）」と呼ばれる業界標準のテストがある。GitHubという開発者向けプラットフォームに実際に報告されたバグを、AIがどれだけ自動で修正できるかを数値化する物差しだ。Opus 4.7のスコアは87.6%で、前世代の80.8%から約7ポイント上がった。Anthropicの発表によれば、OpenAIのGPT-5.4（57.7%）、GoogleのGemini 3.1 Pro（54.2%）をいずれも上回る。ただしこれらの競合スコアはAnthropicが自社発表で引用した数値であり、独立した第三者機関による検証ではない。
実際の開発ツールでも同じ傾向が出ている。AIコードエディタ「Cursor」を開発するAnysphere社の独自評価では、スコアが58%から70%超に改善した。CEOのMichael Truell氏は「難しい作業を安心して任せられる大きな飛躍だ」と評価した。
価格はOpus 4.6から据え置きだ。入力データ100万トークン（AIが文章を処理するときの単位）あたり5ドル、出力が25ドル。ただし今回から文章の数え方が変わったため、同じ作業でも消費するトークン数が最大1.35倍増える。料金単価は変わらないが、実際のコストは使い方次第で増える可能性がある。
一方で、ウェブ上の情報を検索・収集する能力を測る「BrowseComp（ブラウズコンプ）」では、前世代からスコアが下がった。コーディングに特化した代わりに、情報の検索・要約では一歩後退した形だ。
業界に走った波紋
発表が業界に投げかけたのは、性能の話だけではない。
Claude Designが生成するUIが、青緑（ティール）のグラデーションと特定のフォントに偏る傾向がある。異なる会社のサービスがどれも同じ見た目になる問題で、海外のデザイナーコミュニティでは「どのSaaS（インターネット経由で使うサービス）も同じダッシュボードに見える」という批判が広がった。回避策はある——「デザインシステム」を事前に登録すれば自社のルールが適用される。だが設定なしでそのまま使うと画一化するリスクがある。AIに任せるほど、どこかで見たことのある画面になる。ツールが普及するほど、この傾向は強まる可能性がある。
市場も静観しなかった。Claude Design発表直後、デザインツール大手Figmaの株価が約7%下落した。Claude DesignはFigmaのファイルをそのまま読み込める仕様で、デザイン制作の工程をAIが巻き取る形になる。Figmaにとって、自社の領域に踏み込まれると映った可能性がある。
さらに波紋を広げたのがタイミングだ。AnthropicのCPO（最高製品責任者）であるMike Krieger氏が、Claude Design発表の3日前にFigmaの取締役を辞任していたことが判明した。Anthropic、Krieger氏、Figmaのいずれも、辞任の経緯や両者の関係について公式な声明を出していない。辞任→発表という時系列だけが事実として残り、その意味は解釈に委ねられたままだ。
設計と実装を1本でつなぐAIは、既存のツール業界の構造にも影響を及ぼしはじめている。コーディングでは企業が競って採用を進め、デザインの自動化では批判と株価下落が同時に起きた。この技術が広がったとき、デザイナーとエンジニアの役割がどう変わるのか——答えはまだ出ていない。
