Claude Design erstellt editierbare visuelle Arbeit: Prototypen, Slides, One-Pager, Mockups und Landing-Page-Konzepte. Du beschreibst dein Ziel, prüfst die erste Version und verfeinerst sie im Gespräch oder direkt auf der Fläche. Seit September ist Design zusätzlich in bezahlten Claude-Gesprächen, Artifacts und Claude Code als Beta integriert. Die eigenständige Design-Oberfläche bleibt verfügbar; Exportwege unterscheiden sich nach Oberfläche und Format.
Wir führen ein Webdesign- und KI-Studio auf Mallorca. Nach Design-Updates fragen Kunden regelmäßig, ob sie das nutzen sollten. Unsere Antwort bleibt: für bestimmte Aufgaben ja, als pauschaler Ersatz bestehender Werkzeuge nein. Dieser Leitfaden ordnet die Wege nach tatsächlicher Aufgabe und überprüfbarem Ergebnis.
Drei Dinge, die man "Claude Design" nennt#
Die meiste Verwirrung im Netz kommt daher, dass ein Wort drei verschiedene Dinge meint. Sie hängen zusammen, aber das richtige für die jeweilige Aufgabe zu nehmen ist das ganze Spiel.
Das erste ist Claude Design: eine visuelle Arbeitsfläche, die es eigenständig und inzwischen auch in weiteren Claude-Oberflächen gibt. Sie kann interaktive HTML-Prototypen und andere visuelle Ergebnisse erzeugen. Die Bearbeitung und Weitergabe richten sich nach dem Format; ein Design ist nicht automatisch fertig geprüfte Produktivsoftware.
Das zweite sind Creative Connectors. Sie verbinden Claude mit Kreativdiensten und deren freigegebenen Werkzeugen. Welche Aktionen verfügbar sind, hängt vom Connector, deinem Konto und dessen Berechtigungen ab. Prüfe die aktuelle Werkzeugliste vor einem Auftrag; die Anmeldung bei Adobe, Canva oder Figma macht nicht automatisch jede Funktion dieser Programme in Claude verfügbar.
Das dritte ist Claude Code, das Terminal- und Editor-Werkzeug, das echten Produktionscode schreibt und ausliefert. Hier wird aus einem Design eine echte Website. Das ist eine andere Aufgabe als die ersten beiden, und die Grenze zwischen ihnen ist wichtiger, als man denkt.
Wenn dir jemand sagt "Claude hat mein Design-Tool ersetzt", frag, welches der drei er meint. Meistens ist es das erste.
Was Claude Design wirklich erstellen kann#
Die beste Eignung ist alles, was überwiegend visuell und in sich geschlossen ist: Pitch-Decks und Präsentationen, exportiert nach PowerPoint oder geschickt zu Canva, One-Pager und Leave-Behinds, Produkt-Mockups und Wireframes, Landing-Page-Konzepte, die du sehen willst, bevor jemand Code schreibt, E-Mail-Vorlagen als sauberes HTML, und Dashboards. Weil es darunter echten Code rendert, kann es auch Dinge, die ein Slide-Tool nicht kann, etwa Prototypen mit Bewegung, Video oder 3D. Das ist nützlich, um eine Idee zu zeigen, weniger nützlich, wenn du eine fertige, druckbare Datei brauchst.
Wie es in der Praxis funktioniert#
Die Schleife heißt beschreiben, verfeinern, exportieren.
Du startest aus einem Text-Prompt, oder du lädst Dokumente hoch (Word, PowerPoint, Excel), oder du zeigst Claude deine Live-Website mit einem Capture-Werkzeug, damit das Mockup wie dein echtes Produkt aussieht. Claude erzeugt einen ersten Wurf. Dann verfeinerst du ihn im normalen Gespräch, per Inline-Kommentar am Design, per Ziehen und Skalieren von Elementen auf der Fläche, oder mit Reglern, die Claude für Dinge wie Abstand und Farbe erzeugt.
Ein Design-System gibt Claude deine Farben, Schriften und Komponenten als Arbeitsgrundlage. Du kannst dafür vorhandene Dateien oder geeignete Repository-Inhalte bereitstellen. Die Ausgabe muss trotzdem auf Markenregeln geprüft werden: Import und automatische Kontrolle garantieren nicht, dass jede Komponente, Schrift oder Formulierung passt. Halte die Quelle aktuell und teste mit einem kleinen Entwurf.
Prüfe vor dem Start das benötigte Zielformat. Die eigenständige Design-Oberfläche bietet unter anderem PDF, PPTX, HTML, ZIP und Google Slides; angebundene Dienste können weitere Übergaben anbieten. Einige Exportoptionen gibt es nur dort und nicht in jeder integrierten Oberfläche. Öffne den Export im Zielprogramm und prüfe Seiten, Schriften, Bearbeitbarkeit und Interaktionen.
Wo du es einsetzt, und wo nicht#
Das ist der Abschnitt, der wirklich Geld spart. Die Falle ist, Claude Design als Werkzeug zu behandeln, das alles ersetzt. Tut es nicht. Es ist ein Werkzeug im Stapel, und die Kunst ist zu wissen, welche Aufgabe wohin gehört.
| Aufgabe | Womit | Warum |
|---|---|---|
| Internes Pitch-Deck oder One-Pager | Claude Design | Markengerechter Entwurf in Minuten, Export nach PPTX oder Canva |
| Landing-Page-Konzept vor dem Bau | Claude Design, dann Claude Code | Sehen, sich einigen, dann echt bauen |
| Ein Flyer oder Menü, das ein Kunde später editiert | Claude Design zu Canva | Der Kunde besitzt und bearbeitet die Datei danach |
| Tägliche Social Posts und Carousels | Dein bestehendes Tool | Was schon funktioniert, reißt du nicht raus |
| Neue Hero- oder generierte Bilder | Geeignetes Bildmodell oder freigegebenes Connector-Werkzeug | Aktuelle Bildgenerierung und Rechte prüfen |
| Foto-Bearbeitung oder Hintergrund entfernen | Dafür freigegebenes Kreativ-Werkzeug | Verfügbare Aktion, Lizenz und Ergebnis prüfen |
| Die echte Produktiv-Website | Claude Code | Echtes Repo, echter Build, echtes Deploy |
| Marken-Quelle der Wahrheit, komplexe App-UI | Figma | Bleibt das System of Record für ernstes Produktdesign |
Das Muster: nutze Claude Design, um Dinge zu starten und zu erkunden, nutze deine Spezial-Werkzeuge für die Arbeit, in der sie schon gut sind, und nutze Code für alles, was als echtes Produkt ausgeliefert werden muss.
Was es besser kann als ein normaler Claude-Chat, und wann du es weglässt#
Wenn du schon mit Claude im Chat oder in Claude Code arbeitest, lohnt sich hier Klarheit.
Die visuelle Design-Fläche ist nützlich, wenn du auf Elemente zeigen, sie ziehen und direkt verändern willst. Sie ist inzwischen auch innerhalb weiterer Claude-Oberflächen verfügbar. Die Entscheidung lautet daher nicht mehr schlicht „Chat oder Design“, sondern: Welche Fläche und welches Format brauchst du für diese Aufgabe? Für einen Entwurf, den jemand bearbeiten soll, prüfst du früh den tatsächlichen Export. Für einen interaktiven Prototyp prüfst du die Funktionen im Browser.
Du solltest es weglassen und direkt zu Claude Code gehen, wenn das Ziel Produktion ist. Wenn das, was du baust, eine Website oder App ist, die in einer echten Codebase lebt, ist eine Design-Datei ein Umweg. Wir bauen Kundenseiten direkt im Code mit Claude, fahren die Tests und deployen. Es gibt keinen Umweg über ein Design-Tool, weil der Code das Produkt ist.
Der interessante Fall ist die Übergabe zwischen beiden, die Anthropic im Juni ausgeliefert hat. Du kannst eine Seite in Claude Design erkunden und dann das Ganze an Claude Code übergeben, das genau dort weitermacht, wo du aufgehört hast, ohne Screenshot und ohne Neuaufbau von null. Für alle, die Design und Entwicklung machen, ist diese Nahtstelle die eigentliche Schlagzeile. Sie sorgt dafür, dass "lass es mich erst sehen" und "jetzt bau es echt" keine zwei getrennten Welten mehr sind.
Eine ehrliche Anmerkung für Einzelkämpfer und sehr kleine Teams. Viel von der veröffentlichten Kosten-Nutzen-Rechnung nimmt ein Acht-Personen-Team an, das Design- und Entwicklerstunden spart. Wenn du eine Person bist, überträgt sich diese Rechnung nicht. Was sich überträgt, ist die Routing-Logik. Zu wissen, welche Aufgabe in welches Werkzeug gehört, ist mehr wert als jedes Abo, das du dazunimmst.
Die Connectors, kurz#
Selbst wenn du das Claude Design Produkt nie öffnest, lohnt es sich, die Connectors zu kennen, denn sie funktionieren innerhalb eines normalen Claude-Gesprächs.
Für Adobe-Aufträge prüfst du zuerst die tatsächlich verfügbaren Connector-Werkzeuge. Bildbearbeitung, Dokumenterstellung und Videofunktionen haben je nach Dienst unterschiedliche Voraussetzungen und Grenzen. Ein Auftrag wie „Hintergrund entfernen“ muss mit dem passenden Werkzeug ausgeführt und am Ergebnis geprüft werden; eine allgemeine Connector-Verbindung reicht als Nachweis nicht.
Für Canva oder Figma gilt dieselbe Prüfung: Kann der gewählte Weg nur lesen, ein neues Dokument erzeugen oder vorhandene Inhalte bearbeiten? Entscheidend sind Konto, Berechtigungen und die aktuell angebotene Funktion. Prüfe eine kleine Übergabe, bevor du den gesamten Workflow darauf baust.
Ehrliche Grenzen#
Design wird als Beta angeboten. Oberflächen und Exportoptionen ändern sich, und die Nutzung teilt sich dein Plan-Kontingent mit anderer Claude-Arbeit. Statische Exporte bewahren interaktive Abläufe oder Animationen nicht wie ein HTML-Prototyp. Eine PDF ist deshalb aber weder zwingend ein einzelnes Bild noch immer uneditierbar. Prüfe jedes Zielformat. Ein importiertes Design-System hilft bei der Markenführung, ersetzt jedoch keine Kontrolle von Farben, Typografie, Komponenten und Inhalten.
Nichts davon ist ein Ausschlusskriterium. Es sind die normalen Kosten dafür, etwas Neues und schnell Bewegtes zu nutzen, und es lohnt sich, sie zu kennen, bevor du einen Workflow darauf baust.
Das größere Bild#
Tritt einen Schritt zurück, und die Strategie ist klar. Anthropic versucht nicht, durch die beste Fläche zu gewinnen. Es positioniert Claude Design als den Ort, wo visuelle Arbeit beginnt, und verbindet es dann mit überall, wohin diese Arbeit muss: Canva, Adobe, Figma, deine Codebase, dein Content-System. Das Design-System, das du importierst, ist dieselbe Komponenten-Bibliothek, mit der Claude Code baut. Ein Modell, das du in einem Claude-Werkzeug skizzierst, kann in ein Deck in einem anderen fließen und raus nach PowerPoint. Für ein kleines Unternehmen ist die praktische Version einfach. Die Markenassets, die du machst, können dorthin wandern, wo dein Team schon arbeitet, und das Konzept, das du visuell erkundest, kann eine echte Website werden, ohne von vorn anzufangen. Wenn du das größere Claude-Bild willst, haben wir das ganze Ökosystem in unserem Claude-Leitfaden 2026 kartiert.
Das ist der Teil, den ich wirklich nützlich finde. Nicht "KI ersetzt Designer", sondern dass der Abstand zwischen einer Idee und einer ausgelieferten Sache deutlich kleiner wird.
FAQ#
Was ist Claude Design? Eine visuelle Arbeitsfläche für editierbare Prototypen, Slides, One-Pager und Mockups. Sie ist eigenständig und als Beta in weiteren bezahlten Claude-Oberflächen verfügbar. Bearbeitung und Export unterscheiden sich je nach Oberfläche.
Ist Claude Design kostenlos? Es ist in den bezahlten Claude-Plänen enthalten (Pro, Max, Team und Enterprise) und nutzt dein bestehendes Plan-Kontingent, mit der Option, Extra-Nutzung freizuschalten. Bei Enterprise ist es standardmäßig aus, bis ein Admin es anschaltet.
Kann Claude Design eine echte Website bauen? Es kann HTML-Prototypen und exportierbare Dateien erzeugen. Für eine produktive Website brauchst du zusätzlich Prüfung, Integration in die Codebase, Hosting und Betrieb. Ein Handoff zu Claude Code kann dabei helfen, ersetzt diese Arbeit aber nicht.
Claude Design vs Figma vs Canva: was soll ich nehmen? Nutze Claude Design zum Starten und Erkunden (Decks, One-Pager, Landing-Page-Konzepte, E-Mail-Vorlagen). Behalte Figma als Marken-Quelle der Wahrheit und für komplexe App-UI. Nutze Canva für schnelle tägliche Social-Grafiken und Video. Sie überschneiden sich, aber jedes hat eine Aufgabe, die es am besten kann.
Kann Claude Bilder generieren? Ein HTML-Prototyp oder SVG ist etwas anderes als ein neu generiertes Rasterbild. Für Bildgenerierung brauchst du ein dafür geeignetes Modell oder Connector-Werkzeug. Prüfe die aktuelle Funktion, statt von einer Adobe-Anmeldung auf alle Bildfähigkeiten zu schließen.
Brauche ich ein Adobe- oder Canva-Abo? Das hängt von Dienst, Connector, Funktion und deinem Konto ab. Prüfe beim Zielanbieter, ob der benötigte Export oder Bearbeitungsschritt freigeschaltet ist. Ein Claude-Abo enthält nicht automatisch alle Lizenzen verbundener Kreativdienste.
Quellen und Produktstand#
Claude Design: Oberflächen und Exporte / Claude-Artifacts und direkte Bearbeitung
