Design kann so einfach sein. Dieses Motto verfolgt das KI-Unternehmen Anthropic derzeit ganz bewusst. Kürzlich lieferte das Team ein großes Redesign für Claude Code, das die Session-Bearbeitung – auch parallel in einem Fenster – übersichtlicher gestalten soll. Auch die Bearbeitung einzelner Projekt kann damit vereinfacht werden. Jetzt folgt der Start der neuen Funktion Claude Design, die ebenfalls zur einfacheren Kreation von Projekten beitragen soll. In diesem Fall geht es konkret um die Erstellung von Design-Features, die so vielfältig und bunt sein können wie die Einsatzoptionen des Claude Tools.
Claude Design soll als Konkurrenzoption zu Lovable, Figma, Googles Stitch und Co. mit einfachen Prompt-Vorgaben bereits umfassende Designs für ganze Websites, Präsentationen oder Infoseiten kreieren können. User können die Produkte dann in der Konversation mit Claude verfeinern und auf Slider zur Bearbeitung, Inline-Kommentare oder unmittelbare Bearbeitungsoptionen zugreifen. Dabei bietet Anthropic nützliche Exportmöglichkeiten und die Option, jegliche neue Projekte im eigenen Branding durchzuführen – unterstützt durch die visuellen Fähigkeiten des brandneuen Modells Claude Opus 4.7.
Doch wie setzt du Claude Design zielführend in der Praxis ein? Wir zeigen es dir anhand von sieben Tipps, die Anthropics Designer Ryan Mather im Rahmen der Feature-Vorstellung offenbart.
Bestes Opus-Modell für Claude bisher gelauncht:
Opus 4.7 ist da
Claude Design: Mehr Ideen und Output in kurzer Zeit – on-brand
Claude Design von Anthropic Labs basiert auf dem neuen KI-Modell Claude Opus 4.7. Dieses ist das bisher stärkste KI-Modell aus dem Hause Anthropic, wenn es um visuelle Verarbeitung geht. Das neue Design-Tool wird aktuell als Research Preview für Pro, Max, Team und Enterprise User ausgerollt; im Enterprise-Abonnement ist es per Default ausgestellt. Diese können damit ohne Designvorkenntnisse, mit wenig Zeit oder eingeschränkten Ressourcen schnell Designvorlagen erstellen und durch die Feinjustierung zu gangbaren Produkten entwickeln.
Die Arbeit mit Claude Design ist ganz einfach: User geben der KI per Prompt eine Idee vor und lassen sich Design-Prototypen erstellen – ähnlich wie bei Googles Vibe-Design auf Stitch oder bei Lovable. Bei Claude Design können die User die Kreationen, ob Websites, One-Pager für ihre Produkte oder Präsentations-Slides für die Arbeit, dann auf vielfältige Weise überarbeiten. Dazu stehen die Inline-Kommentare im Claude Tool bereit, Slider zur Personalisierung der Ergebnisse, zum Beispiel für Schriftgrößen oder Elementgrößen, und im Gespräch mit Claude können Veränderungen ebenfalls angegeben werden.
Besonders hilfreich ist für die Nutzer:innen im Business-Kontext zudem, dass sie sämtliche Designvorlagen in ihrem eigenen Brand-Design erstellen lassen können. Dafür müssen sie Claude Zugriff auf ihre Designvorgaben geben und Claude kann die Code-Basis des Brand-Designs auslesen, analysieren und auf Basis dessen künftige Kreationen on-brand gestalten. Dieser Aspekt zählt bereits zu den zentralen Tipps, die Anthropics Design-Team-Mitglied Ryan Mather Usern mit auf den Weg gibt. Er zeigt, wie man Claude Design praxisnah einsetzen kann.
Exportoptionen und Markenfokus als Vorteil
Wer schließlich Designvorlagen kreiert hat, die zur Weiterverarbeitung gedacht sind, kann auf hilfreiche Exportoptionen zugreifen. Desings lassen sich als PDF oder PPTX exportieren, aber auch an Canva als Design-Tool und Claude Code weitergeben. Canva kooperiert mit Anthropic und CEO sowie Mitgründerin Melanie Perkins von Canva meint:
[…] We’re excited to build on our collaboration with Claude, making it seamless for people to bring ideas and drafts from Claude Design into Canva, where they instantly become fully editable and collaborative designs ready to define, share, and publish.
Die Überführung zu Claude Code wiederum zeigt, dass die Claude Tools in Kooperation bei der Projektarbeit unterstützen können. Auf LinkedIn schreibt Ryan Mather über Claude Design:
[…] My #1 tip for getting the most out of it is to embrace it as a new kind of design tool. It’s more like Claude Code optimized for design than a canvas editor with an agent added to it. It felt awkward for me at first to use it, since I’m used to canvas-based design tools, but once I realized I could ‘Just Ask Claude‘ to build any features I wanted _on the fly_ it was a big unlock!
7 Tipps für im Überblick: Claude Design
In einem X Post führt Ryan Mather aus dem Anthropic Team weiter aus, welche Schritte bei der Arbeit mit Claude Design helfen können, um das Tool schnell für die Designkreation einsetzen zu können. Der erste Schritt ist bei ihm das Setup des Designsystems. Damit nimmt er Bezug auf die Option, Claude über Brand-Vorgaben oder eigene Rahmenbedingungen für die Designs zu informieren. Im Onboarding-Prozess des Tools wird ein Designsystem aufgesetzt. Laut Mather lohnt es sich, eine Stunde Zeit einzuplanen, um die Feinheiten einzustellen. Denn dann können in Folgeprojekten die Vorgaben für Schriftart, Schriftgröße, Farben, Komponenten und dergleichen mehr übernommen werden. Zur Informationsvermittlung diesbezüglich können die User einfach Bilder und Dokumente, etwa auch Präsentationen der Marke, hochladen. Aber auch der Hinweis auf eine Code-Basis ist möglich. Mit dem Web Capture Tool kannst du ebenso Elemente von deiner Website heranziehen.
My tips for getting the best results out of Claude Design! I’m on the verticals team at Anthropic which means I serve 7 different products. Claude Design makes it possible!
1. Set up your design system and your core screens. An hour of setup and refinement here is worth it https://t.co/uDA5tOjJmf
— Ryan Mather (@Flomerboy) April 17, 2026
Des Weiteren rät Ryan Mather dazu, Designvorschläge mit Entwickler:innen live erarbeiten und bearbeiten. Die Iteration in einer Live Session mit den beteiligten Personen des Teams kann dazu führen, dass unmittelbar nach so einer Session ein neues Feature zum Leben erweckt wird. Die Bearbeitungen, die die Teams nach den ersten Drafts vornehmen, lassen sich zwar in der Konversation angeben. Doch Mather verweist auf das Kommentar-Tool. Denn wenn User einfach auf eine zu verändernde Stelle im Design weisen und einen Kommentar zur Änderung einfügen, kann das Zeit und Aufwand beim Prompting sparen. Er schreibt:
[…] It’s tricky to describe all the changes you want verbally – so don’t! Point and crit.
3. Use the Comment tool to make rapid fire surgical edits
After a rough first draft, there might be dozens of details you want to tweak. It’s tricky to describe all the changes you want verbally – so don’t! Point and crit.
— Ryan Mather (@Flomerboy) April 17, 2026
AI-Fähigkeiten machen Claude Design eher zum Coding Tool: So profitierst du
Da Claude Design eher wie ein Coding Tool arbeitet, weniger wie ein canvas-basiertes Design-Tool, kann es auch für sehr variable Zwecke eingesetzt werden. Du kannst deine Ideen nicht nur beschreiben und bearbeiten, sondern ebenso Demos in Videoform davon anfertigen lassen, was die Übersichtlichkeit nochmals steigern mag. Dazu rät Mather genauso wie zum Einsatz von Connectors. Wer zum Beispiel Slack oder Docs verknüpft, kann einfach Prompts einsetzen wie den folgenden:
Please read the meeting notes from the product roast and create a deck exploring different design solutions for everything that came up[.]
User können sich also durch die Verknüpfung verschiedener KI-Ressourcen viel Arbeit sparen und Kraft in die Feinjustierung der Vorschläge stecken.
5. Use connectors (esp. docs/slack)
Once set up, you can send prompts like “Please read the meeting notes from the product roast and create a deck exploring different design solutions for everything that came up”. Go for a walk and touch some grass and come back with fresh eyes!
— Ryan Mather (@Flomerboy) April 17, 2026
Schließlich verweist Ryan Mather noch auf die Möglichkeit, quasi nebenbei neue Tools zu erstellen und sich am Ende nicht zu sehr in den Details zu verlieren. Schritt für Schritt können Einzelheiten angepasst und für den gewünschten Effekt erstellt werden. Trotz der Fähigkeiten agentischer Kreation kann es von Vorteil sein, Feinheiten per Hand einzusetzen, um das Design passgenau abzurunden.
7. Know when to slow down and do things by hand
New icons, spot illustrations, naming. Some details will always make an outsized impact. It can be easy to get sucked into the hyper speed of agentic designing. Knowing when to slow down is an art form of its own.
— Ryan Mather (@Flomerboy) April 17, 2026
Auf X gibt Mather in einem weiteren Post noch ein konkretes Beispiel für ein Design vor. Dabei hat er seine Hobbys verbunden und Bilder von Pflanzen in Sashiko-Stickmuster übertragen lassen. Das funktioniert auf Basis von HTML-Artefakten und dem Zugriff auf die Claude API. So können User mit HTML-Inhalten und Canvas Designs zusammenstellen.
Made this lil prototype of two of my latest obsessions: flowers x sashiko! Since Claude design makes HTML artifacts, and has access to the Claude API you can do fun HTML X canvas stuff and generate content in your interactive prototypes! https://t.co/CTkx6IwhTJ pic.twitter.com/OBNag7QiKL
— Ryan Mather (@Flomerboy) April 17, 2026
Du kannst Claude Design selbst testen und dir einen Einblick darüber verschaffen, welche Designoptionen sich dir eröffnen.