Claude Design ist da:
Der Tag, an dem die Figma-Aktie 7% fiel
Claude Design 登場:
Figma株が7%下落した日
Claude Design Arrives:
The Day Figma Stock Dropped 7%
„Professionelle Visuals auch ohne Designer" — wir erklären, was Claude Design kann und wie es sich von Figma, Canva und Lovable unterscheidet.
「デザイナーがいなくてもプロ品質のビジュアルを作れる」——Anthropicが本日リリースしたClaude Designの全貌と、Figma・Canva・Lovableとの違いを徹底解説。
"Professional-quality visuals without a designer" — a complete look at Anthropic's new Claude Design and how it compares to Figma, Canva, and Lovable.
„3 Tage nach dem Rücktritt aus dem Figma-Vorstand"
「競合の取締役を辞任してから3日後」のリリース
"3 Days After Resigning from Figma's Board"
Am Freitag, dem 17. April 2026, gab Anthropic Claude Design offiziell bekannt. Das Timing ist bezeichnend: Anthropics Chief Product Officer Mike Krieger trat am 14. April aus dem Figma-Vorstand zurück — und nur zwei Tage später erschien ein Tool, das direkt in Figmas Kerngeschäft, UI-Design und Prototyping, eingreift.
2026年4月17日(金)、AnthropicがClaude Designを正式発表した。タイミングが示唆的だ。Anthropicの最高製品責任者Mike Krieger氏がFigmaの取締役を辞任したのが4月14日——その翌々日に、Figmaの核心事業であるUIデザイン・プロトタイピングを直撃するツールが登場した。
On Friday, April 17, 2026, Anthropic officially announced Claude Design. The timing is telling: Anthropic's Chief Product Officer Mike Krieger resigned from Figma's board on April 14 — and just two days later, a tool arrived that directly targets Figma's core business of UI design and prototyping.
Claude Design wird von Anthropic Labs (Anthropics Research-Preview-Abteilung) bereitgestellt und nutzt Claude Opus 4.7. Es wird ab heute schrittweise für Pro-, Max-, Team- und Enterprise-Abonnenten eingeführt.
Claude DesignはAnthropic Labs(Anthropicの研究プレビュー部門)から提供され、Claude Opus 4.7を搭載。Pro・Max・Team・Enterpriseサブスクライバーに本日より順次展開されている。
Claude Design is provided by Anthropic Labs (Anthropic's research preview division) and is powered by Claude Opus 4.7. It is rolling out today to Pro, Max, Team, and Enterprise subscribers.
Was Claude Design kann
Claude Designでできること
What Claude Design Can Do
Claude Design ist ein „Design-Tool per KI-Chat". Aber es unterscheidet sich grundlegend von bildgenerierenden KI-Tools. Anders als DALL-E oder Midjourney, die Pixel generieren, nutzt Claude seine Reasoning-Fähigkeiten, um Layout, Hierarchie und Komponenten „strukturell" aufzubauen.
Claude Designは「AIチャットでデザインを作るツール」だ。ただし画像生成AIとは根本的に異なる。DALL-EやMidjourneyのようなピクセル生成ではなく、Claudeの推論能力を活かしてレイアウト・階層・コンポーネントを「構造的に」構築する。
Claude Design is a "design tool through AI chat." However, it is fundamentally different from image-generating AI tools. Unlike DALL-E or Midjourney, which generate pixels, Claude uses its reasoning capabilities to structurally construct layouts, hierarchies, and components.
Claude Design ist kein bildgenerierendes KI-Tool. Es ist kein Werkzeug für fotorealistische Bilder, sondern für „Visuals zum Kommunizieren" — UI-Mockups, Slides, Prototypen, One-Pager.
Claude Designは画像生成AIではない。フォトリアルな画像を作るツールではなく、UIモックアップ・スライド・プロトタイプ・ワンページャーなど「伝えるためのビジュアル」を作るツールだ。
Claude Design is not an image-generating AI. It's not a tool for photorealistic images, but for "visuals that communicate" — UI mockups, slides, prototypes, one-pagers.
Was Sie erstellen können
作れるもの
What You Can Create
- Interaktive Prototypen (anklickbare UI-Mockups)
- Wireframes und UI-Mockups
- Pitch Decks und Präsentationsfolien
- Marketing-One-Pager
- Social-Media-Visuals
- Landing Pages
- Banner-Anzeigen (automatisch aus PDF-Produktbeschreibungen generiert)
- 3D-interaktive Elemente (im Demo: ein Globus)
- インタラクティブプロトタイプ(クリッカブルなUIモックアップ)
- ワイヤーフレーム・UIモックアップ
- ピッチデック・プレゼンスライド
- マーケティング用ワンページャー
- ソーシャルメディア用ビジュアル
- ランディングページ
- バナー広告(PDFから商品説明を読み込んで自動生成)
- 3Dインタラクティブ要素(デモでは地球儀が紹介された)
- Interactive prototypes (clickable UI mockups)
- Wireframes and UI mockups
- Pitch decks and presentation slides
- Marketing one-pagers
- Social media visuals
- Landing pages
- Banner ads (auto-generated from PDF product descriptions)
- 3D interactive elements (globe demonstrated in demo)
Workflow
使い方の流れ
How It Works
Der Nutzer beschreibt zunächst in natürlicher Sprache, was er erstellen möchte. Alternativ können Skizzenbilder oder Word/PowerPoint/Excel-Dateien hochgeladen werden. Mit dem Web-Capture-Tool lassen sich Elemente direkt von der eigenen Website einlesen, um Prototypen zu erstellen, die wie das echte Produkt aussehen.
ユーザーはまず自然言語で「こんなものを作りたい」と伝える。あるいは既存のスケッチ画像、Word/PowerPoint/ExcelファイルをアップロードしてもOK。ウェブキャプチャツールを使えば自社のウェブサイトから要素を直接取り込んで、実際のプロダクトそっくりのプロトタイプも作れる。
Users start by describing in natural language what they want to create. Alternatively, sketch images or Word/PowerPoint/Excel files can be uploaded. The web capture tool lets you pull elements directly from your own website to create prototypes that look just like the real product.
Sobald die erste Version generiert wurde, kann sie per Gespräch, Inline-Kommentaren, Direktbearbeitung und benutzerdefinierten Schiebereglern (von Claude generierte UI) feinabgestimmt werden. Anschließend kann das Ergebnis mit dem Team geteilt werden.
初版が生成されたら、会話・インラインコメント・直接編集・カスタムスライダー(Claudeが生成するUI)で細かく調整。完成したらチームと共有してコラボレーションもできる。
Once the initial version is generated, it can be refined through conversation, inline comments, direct editing, and custom sliders (UI generated by Claude). The result can then be shared with the team for collaboration.
Mit der „Tweaks"-Funktion lässt sich ein ausgewählter Teil des generierten Visuals anpassen — z. B. „Ändere Größe und Farbe dieses Buttons". Außerdem kann Claude benutzerdefinierte Steuerelemente für bestimmte Parameter (Textgröße, Abstände etc.) generieren.
生成されたビジュアルの一部を選択して「このボタンのサイズと色を変えて」と指示できる「Tweaks」機能がある。また特定のパラメータ(テキストサイズ・余白など)を手動で調整するカスタムコントロールをClaudeに生成させることもできる。
The "Tweaks" feature lets you select part of the generated visual and give direct instructions — e.g., "Change the size and color of this button." Claude can also generate custom controls for manually adjusting specific parameters (text size, spacing, etc.).
Das größte Alleinstellungsmerkmal: Automatisches Design-System
最大の差別化:デザインシステムの自動読み込み
The Biggest Differentiator: Automatic Design System Loading
Claude Design hebt sich von anderen „KI-Visual-Tools" durch eine Funktion ab: Es liest den Code und die Design-Dateien des Unternehmens und erstellt automatisch ein teamspezifisches Design-System.
Claude Designが他の「AIでビジュアルを作るツール」と一線を画す機能がある。会社のコードベースとデザインファイルを読んで、チーム専用のデザインシステムを自動構築することだ。
What sets Claude Design apart from other "AI visual tools" is this: it reads a company's codebase and design files, then automatically builds a team-specific design system.
Beim Onboarding liest Claude den Codebase und die Designdateien und erstellt das Design-System. Für alle folgenden Projekte werden die Farben, Schriften und Komponenten des Teams automatisch angewendet. Es können mehrere Design-Systeme gespeichert werden, was Unternehmen mit verschiedenen Marken für einzelne Geschäftsbereiche entgegenkommt.
オンボーディング時にClaudeがコードベースやデザインファイルを読んでデザインシステムを構築。以降のすべてのプロジェクトで、そのチームの色・フォント・コンポーネントが自動的に適用される。複数のデザインシステムを保持することもでき、事業ごとに異なるブランドを持つ会社にも対応している。
During onboarding, Claude reads the codebase and design files to build the design system. From then on, all projects automatically apply the team's colors, fonts, and components. Multiple design systems can be maintained, accommodating companies with different brands for different business units.
Vergleich: Figma, Canva, Lovable, v0
Figma・Canva・Lovable・v0 との比較
Comparison: Figma, Canva, Lovable, and v0
Im Designtool-Markt gibt es starke etablierte Player. Wo unterscheidet sich Claude Design?
デザインツール市場には強力な先行者がいる。Claude Designはどこが違うのか。
The design tool market has strong incumbents. Where does Claude Design differ?
| Funktion / Merkmal機能・特徴Feature | Claude Design | Figma / Make | Canva | Lovable | v0 (Vercel) |
|---|---|---|---|---|---|
| Hauptzielgruppe主な対象ユーザーPrimary target | PM · Gründer · Entwickler · AllePM・創業者・ エンジニア・全員PMs · Founders · Engineers · Everyone |
Profi-DesignerプロデザイナーPro designers | Marketer · Nicht-Designerマーケター・ 非デザイナーMarketers · Non-designers |
Entwickler · Startups開発者・ スタートアップDevelopers · Startups |
Frontend- Entwicklerフロントエンド 開発者Frontend developers |
| Bedienung操作方式Interaction | ● Chat (KI-gesteuert)会話(AI主導)Chat (AI-driven) | ▲ GUI + KI-HilfeGUI+AI補助GUI + AI assist | ▲ Vorlagen + Dragテンプレート+ドラッグTemplates + Drag | ● Prompt | ● Prompt |
| Interaktive Prototypenインタラクティブ プロトタイプInteractive prototypes |
● JaありYes | ● Ja (stark)あり(強力)Yes (powerful) | ✕ Begrenzt限定的Limited | ● JaありYes | ● JaありYes |
| Design-System autoデザインシステム 自動読み込みDesign system auto-load |
● Auto aus Codebaseコードベース から自動構築Auto-built from codebase |
▲ Manuell手動管理Manual | ✕ NeinなしNo | ✕ NeinなしNo | ✕ NeinなしNo |
| Claude Code HandoffClaude Codeへの コードハンドオフClaude Code handoff |
● Ein KlickワンクリックOne click | ▲ Manueller Export手動エクスポートManual export | ✕ NeinなしNo | ● Bis Codegenコード生成までCode gen | ● Bis Codegenコード生成までCode gen |
| Canva-ExportCanvaエクスポートCanva export | ● Native Integrationネイティブ統合Native integration | ✕ NeinなしNo | — | ✕ NeinなしNo | ✕ NeinなしNo |
| Exportformateエクスポート形式Export formats | Canva / PDF / PPTX / HTML / URL / ZIP |
PNG / SVG / PDF / Codeコードcode |
PNG / PDF / PPTX / MP4 |
URL / Codeコードcode | CodeコードCode / URL |
| Team-KollaborationチームコラボTeam collaboration | ● JaありYes | ● Beste in Branche業界最強Industry best | ● JaありYes | ▲ Begrenzt限定的Limited | ✕ Einzelnutzer個人向けIndividual only |
| Lernaufwand学習コストLearning curve | ● Minimal (nur Chat)最小(会話のみ)Minimal (chat only) | ✕ Hoch高いHigh | ● Niedrig低いLow | ● Niedrig低いLow | ▲ Mittel中程度Medium |
| Zusatzkosten ab ProPro以上の追加費用Extra cost from Pro | Keine (im Abo) Wöchentl. Limitなし(サブスク内) 週次上限ありNone (in subscription) Weekly limit |
$12〜/Person/Monat人/月user/mo | $10〜/Person/Monat人/月user/mo | $20〜/Monat月mo | $20〜/Monat月mo |
Figma: Professionelles Tool für präzises UI/UX-Design. Für intensive Designarbeit bleibt Figma die erste Wahl.
Figma:プロデザイナーがUI/UXを精密に作り込む「デザインのプロ用ツール」。今後も本格的な作り込みにはFigmaが必要。
Figma: Professional tool for precision UI/UX design. For serious design work, Figma remains essential.
Canva: Template-basiertes Tool für SNS-Posts und Flyer. Arbeitet mit Claude zusammen, nicht gegen es.
Canva:テンプレートベースでSNS投稿やチラシを素早く作る「ノンデザイナーの作業加速ツール」。Claudeとは協調関係。
Canva: Template-based tool for social posts and flyers. Collaborates with Claude rather than competing.
Lovable / v0: Tools zur Code-Generierung aus Prompts heraus. Stärke liegt in vollständigen Web-Apps.
Lovable・v0:プロンプトからフル機能のWebアプリを生成するツール。コード生成に強みがある。
Lovable / v0: Tools for generating full web apps from prompts. Strong on code generation.
Claude Design: Die „Mittelschicht" — PMs, Gründer, Entwickler, die schnell „zeigbare Visuals" erstellen wollen. Stärke: durchgängig von der Idee über Prototyp bis zur Implementierung.
Claude Design:「デザイナーでも非デザイナーでもない中間層」—— PMや創業者、エンジニアが「まず見せられるビジュアル」をすぐ作れるツール。会話でデザイン→コードへの一気通貫が強み。
Claude Design: The "middle layer" — PMs, founders, engineers who want to quickly create "showable visuals." Strength: end-to-end from idea to prototype to implementation.
Aufbau der Oberfläche: Was wo ist
インターフェースの仕組み:何がどこにあるか
Interface Overview: What's Where
Claude Design ist über das Palette-Icon in der linken Navigation von Claude.ai zugänglich. Laut SiliconAngle besteht die Oberfläche aus drei Hauptbereichen.
Claude DesignはClaude.aiの左側ナビゲーションのパレットアイコンからアクセスする。SiliconAngleのレポートによると、インターフェースは大きく3つの領域で構成されている。
Claude Design is accessed via the palette icon in Claude.ai's left navigation. According to SiliconAngle, the interface consists of three main areas.
Externe Tool-Anbindung: „Interoperabilitäts"-Strategie
外部ツールとの連携:「インターオペラビリティ」戦略
External Tool Integrations: The "Interoperability" Strategy
Anthropic positioniert Claude Design nicht als „Ersatz für bestehende Tools", sondern als „Ergänzung". Das zeigt sich in der nativen Canva-Integration.
AnthropicはClaude Designを「既存ツールの置き換え」ではなく「補完」として位置づけている。その証拠がCanvaとのネイティブ統合だ。
Anthropic positions Claude Design not as a "replacement for existing tools" but as a "complement." The evidence is the native Canva integration.
Nutzung & Kosten: Separates Kontingent
使用量・料金:別枠でカウント
Usage & Pricing: Separate Quota
Laut The Register wird das Claude Design-Nutzungskontingent getrennt von normalem Chat und Claude Code gezählt. Es gibt ein eigenes „wöchentliches Limit", unabhängig vom bestehenden Chat-Limit. Enterprise-Kunden erhalten beim ersten Einstieg etwa 20 kostenlose Prompt-Credits (gültig bis 17. Juli 2026).
The Registerの報告によると、Claude Designの使用量は通常のチャットやClaude Codeとは別枠でカウントされる。既存のチャット上限とは独立した「週次上限」が設けられており、Enterpriseには初回のみ「約20プロンプト分」の無料クレジットが付与される(2026年7月17日まで)。
According to The Register, Claude Design usage is counted in a separate quota from normal chat and Claude Code. There is an independent "weekly limit" separate from the existing chat limit. Enterprise customers receive ~20 free prompt credits for initial access (valid through July 17, 2026).
Standardmäßig für Enterprise deaktiviert. Der Administrator muss die Richtlinie in den Copilot-Einstellungen aktivieren. Für GitHub Copilot Pro+ ist die Nutzung mit einem 7,5× Premium-Request-Multiplikator verfügbar (bis 30. April).
Enterpriseプランではデフォルトで無効。管理者がCopilotの設定でポリシーを有効化する必要がある。GitHubのChangelog情報ではGitHub Copilot Pro+でも7.5×プレミアムリクエスト乗数(4月30日まで)で利用可能。
Disabled by default for Enterprise. Admins must enable the policy in Copilot settings. For GitHub Copilot Pro+, usage is available with a 7.5× premium request multiplier (through April 30).
Fazit: Was sich für wen ändert
まとめ:誰にとって何が変わるか
Summary: What Changes for Whom
Claude Design verändert am stärksten das Leben derjenigen, die bisher wegen fehlender Design-Ressourcen keine „zeigbaren" Ergebnisse liefern konnten.
Claude Designの登場で最も変わるのは、これまでデザインリソースの不足で「見せられるもの」を作れなかった人たちだ。
Claude Design changes things most for those who previously couldn't produce "showable" results due to a lack of design resources.
- PM / Product Manager: Prototypen für User-Tests innerhalb eines Tages ohne Designer. Wie bei Datadog: von einer Woche auf ein Gespräch.
- Startup-Gründer: Pitch Decks regelkonform mit Brand Guidelines — auch vor der ersten Designer-Einstellung.
- Entwickler: UI-Entwurf selbst erstellen und an Claude Code übergeben — der „Design → Implementierung"-Loop ist geschlossen.
- Marketer: Kampagnen-Banner und Landing Pages per Prompt erstellen und in Canva finalisieren.
- Profi-Designer: Design-Exploration parallel und schneller. Die „langweiligen Teile" delegieren, Fokus auf kreative Arbeit.
- PM・プロダクトマネージャー:デザイナーを待たずに1日のサイクルでプロトタイプを用意してユーザーテストへ。Datadog社のように1週間→1会話に短縮。
- スタートアップ創業者:デザイナー採用前でも、投資家向けピッチデックをブランドガイドライン準拠で即生成。
- エンジニア:UIの叩き台を自分で作ってClaude Codeに渡す「設計→実装」のループが完結。
- マーケター:キャンペーン用バナー・ランディングページをPromptだけで作りCanvaに持ち込んで仕上げ。
- プロデザイナー:方向性探索(デザインエクスプロレーション)を複数並行して高速化。「退屈な部分」を任せて創造的作業に集中。
- PMs / Product Managers: Prototype for user testing within a day cycle without waiting for a designer. Like Datadog: from one week to one conversation.
- Startup founders: Investor pitch decks in brand-guideline compliance even before hiring a designer.
- Engineers: Create UI drafts yourself and hand off to Claude Code — the "design → implementation" loop is closed.
- Marketers: Create campaign banners and landing pages from prompts, then finalize in Canva.
- Professional designers: Parallelize design exploration at higher speed. Delegate "boring parts" and focus on creative work.
Claude Designs größter Vorteil ist nicht eine Einzelfunktion, sondern dass der gesamte Prozess — Idee → Prototyp per Chat → Implementierung mit Claude Code → Fertigstellung & Sharing mit Canva — im Anthropic-Ökosystem abgeschlossen werden kann. Den meisten Wettbewerbern fehlt diese vollständige Loop-Abdeckung.
Claude Designの最大の優位性は単体の機能ではなく、「アイデア→会話でプロトタイプ→Claude Codeで実装→Canvaで仕上げ・共有」という全工程をAnthropicエコシステム内で完結できる点だ。競合の多くはこのループの一部しか担えない。
Claude Design's greatest advantage is not a single feature but that the entire workflow — idea → prototype via chat → implementation with Claude Code → finishing and sharing with Canva — can be completed within the Anthropic ecosystem. Most competitors can only cover part of this loop.
Derzeit noch Research Preview (Forschungsvorschau). Funktionen können sich ändern. LLM-basierte Visualgenerierung hat laut Gizmodo bekannte Präzisionsprobleme. Für produktive Designarbeit empfehlen wir: selbst ausprobieren und urteilen.
現時点ではResearch Preview(研究プレビュー)段階。機能は今後変わる可能性が高く、LLMのビジュアル生成は元来精度に課題があるとGizmodoも指摘している。本番デザインワークへの適用は実際に試して判断することを勧める。
Currently still in Research Preview status. Features are subject to change. As Gizmodo notes, LLM-based visual generation has known accuracy limitations. For production design work, we recommend trying it yourself before committing.