Du kennst das: Du bittest eine KI um eine Präsentation, und sie sieht aus wie jede andere. Also schreibst du dazu, welche Farben, welche Schrift, wie viel Weißraum. Beim nächsten Dokument wieder. Und beim übernächsten wieder. Deine Marke lebt in deinem Kopf, und du tippst sie jedes Mal neu ab.
Claude Design dreht das um. Du erklärst deine Marke genau einmal, als Designsystem, und ab dann sieht alles danach aus: Folien, Landingpages, Flyer, Speisekarten. Du sagst nur noch, was drinstehen soll.
Genau das haben wir im Umsetzungsworkshop mit Lukas Salchner gemacht, Co-Founder und CTO bei thirdmind. Über fünfzig Teilnehmende, fast alle ohne jede Erfahrung mit dem Tool. Drei Stunden später hatte eine fiktive Pizzeria ein eigenes Erscheinungsbild, eine Landingpage, eine druckfähige Speisekarte und einen Mauszeiger in Pizzaform.
Was ist Claude Design?
Claude Design ist ein Werkzeug von Anthropic, mit dem du im Chat visuelle Ergebnisse baust: Prototypen, Präsentationen, Landingpages und One-Pager. Es ist seit April 2026 als Research Preview für die Bezahlpläne von Claude verfügbar und läuft auf Claude Opus 4.7, dem bislang stärksten Bildverständnis-Modell von Anthropic.
Der Kern ist das Designsystem. Darunter versteht man alles, was Claude über deine Marke nicht mehr raten muss: Farbrollen, Schriftgrößen, Abstände, Eckradien und fertige Bausteine wie Buttons, Karten oder Tabellen. Technisch steckt dahinter eine Stylesheet-Datei, die jedes Ergebnis automatisch verwendet.
Zwei Wege im Vergleich
Ohne Designsystem
1/5 vorn
Erster Entwurf
sauber, aber generisch
Was du jedes Mal erklärst
Farben, Schriften, Stil, Inhalt
Einrichtung
keine
Deck, Flyer und Website
sehen verschieden aus
Übergabe an Claude Code
Stil muss neu beschrieben werden
Passt für: eine schnelle Einzelgrafik
Mit Designsystem
4/5 vorn
Erster Entwurf
sofort in deiner Marke
Was du jedes Mal erklärst
nur noch den Inhalt
Einrichtung
einmal etwa 20 Minuten
Deck, Flyer und Website
sehen aus wie aus einem Guss
Übergabe an Claude Code
das System geht einfach mit
Passt für: alles, was nach dir aussehen soll
Warum Designsysteme gerade jetzt wichtig werden
Bessere Prompts skalieren nicht, besserer Kontext schon. Das war der Satz, um den Lukas den ganzen Abend gebaut hat. Anthropic beschreibt dasselbe Prinzip in eigenen Kundenbeispielen:
Prompts reichten bei Brilliant für die komplexesten Seiten, für die andere Tools mehr als 20 brauchten
Anthropic
Wege, ein Ergebnis weiterzugeben: PDF, PowerPoint, HTML, Canva und Claude Code
Anthropic
dauert es, bis ein Designsystem aus deinem Material generiert ist. Einmal.
AITI Umsetzungsworkshop
Bei Datadog ist laut Anthropic aus einer Woche Hin und Her zwischen Briefing, Mockup und Feedbackrunde ein einziges Gespräch geworden. Wie ernst die Branche das nimmt, zeigte sich schon vor dem Start: Anthropics Produktchef Mike Krieger trat wenige Tage vorher aus dem Aufsichtsgremium von Figma zurück.
Live-Demo: eine Pizzeria in drei Stunden
Lukas hat für die Demo eine Pizzeria erfunden, das „Tonda". Die erste Landingpage ohne Designsystem war ordentlich und völlig austauschbar. Dann hat er aus einem einzigen Pinterest-Screenshot ein Designsystem erzeugen lassen und dieselbe Seite noch einmal gebaut. So sieht das nachgestellt aus:
Im Chat kam prompt die Reaktion: „Der Pizza-Cursor ist Bombe." Spannender als der Gag ist aber, was dahinter passiert. Die Speisekarte hat Claude nicht noch einmal erklärt bekommen. Sie entstand im selben Projekt, mit demselben System und denselben Regeln.
So baust du dein eigenes Designsystem in sechs Schritten
Der Weg vom leeren Account zum ersten fertigen Asset ist in Claude Design immer gleich. Klick dich durch:
Der Ablauf an einem Abend
- Material hochladen
- Generieren lassen
- Prüfen und korrigieren
- Template anlegen
- Projekt starten
- Exportieren
Schritt 1 von 6
Drei Ebenen solltest du dabei auseinanderhalten, weil sie im Workshop am häufigsten verwechselt wurden: Das Designsystem gilt überall, das Template liegt im Designsystem, und das Projekt ist das konkrete Ergebnis. Was du im Projekt festlegst, gewinnt gegen das Template.
Was wir nicht wollen, ist, dass wir von Prompts abhängig sind.
Edit, Kommentar oder Chat?
Claude Design bietet drei Arten, etwas zu ändern, und jede hat ihren Platz. Lukas' Faustregel:
| Situation | Werkzeug | Beispiel aus dem Workshop |
|---|---|---|
| Du weißt genau, wie es aussehen soll | Edit | Schriftgröße auf 60 px, „0,5 l" statt „0,4 l" |
| Du weißt nur, dass etwas nicht passt | Kommentar am Element | „Diese Spalte so breit wie die andere" |
| Es betrifft mehr als eine Stelle | Chat | „Alle Inhalte auf Deutsch, Icons für vegan und scharf" |
Der Kommentar ist dabei unterschätzt. Schreibst du in den Chat „die soll 10 € kosten", muss Claude raten, welche Pizza gemeint ist. Als Kommentar direkt an der Pizza ist die Sache eindeutig.
Tweaks: das Bedienfeld, das Claude dir selbst baut
Der größte Aha-Moment des Abends hatte einen unscheinbaren Namen. Tweaks sind Schalter und Regler, die Claude passend zu deinem Projekt selbst erzeugt. Du bittest darum, und dein Dokument bekommt ein eigenes kleines Bedienfeld. Eine Teilnehmerin schrieb dazu: „Tweaks kannte ich noch gar nicht. Genial."
Sprache umschalten
Dark Mode
Hoch- oder Querformat
Entwurfslabel
Logo ein und aus
Speaker Notes
8 Tipps aus dem Workshop
Die Grundlagen lernst du in einer halben Stunde. Was den Unterschied macht, sind die Kleinigkeiten, die erst nach ein paar Projekten auffallen. Hak ab, was du schon umsetzt:
8 Tipps zum Abhaken
Was den Unterschied macht
Wann Claude Design und wann Claude Code?
Claude Design ist das richtige Werkzeug für alles Visuelle, das eher statisch bleibt: Präsentationen, Dokumente, Social-Media-Grafiken, One-Pager und Prototypen. Claude Code ist das richtige Werkzeug, wenn das Design nur ein Teil eines Softwareprojekts ist, etwa einer echten Website mit Formularen und Blog.
Das Schöne ist, dass du dich nicht entscheiden musst. Über „Send to Claude Code" wandert dein Designsystem mit, und dort entwirfst du mit dem Befehl /design weiter. Wie aus so einem Entwurf eine echte, eigene Website wird, zeigt unser Artikel zum Thema Website mit KI erstellen.
Die Werkzeuge im Überblick
Claude Design: Das Herzstück. Hier entstehen Designsystem, Templates und alle Projekte, gesteuert per Chat, Kommentar und Edit.
💡 Ehrlich gesagt: Claude Design ist noch eine Research Preview. Im Workshop gab es überlastete Server, Umlaute, die falsch dargestellt wurden, und SVG-Logos, die sich nicht hochladen ließen. Nimm dein Logo im Zweifel als PNG und plane etwas Geduld ein. Lukas' Rat dazu: „Wenn man im KI-Space ist, dann muss man leider sehr flexibel sein."
Fazit
Claude Design ist kein Ersatz für Designerinnen und Designer. Es ist ein Weg, deine Marke aus deinem Kopf in ein System zu holen, das jede KI-Ausgabe automatisch einhält. Der Unterschied zwischen generisch und gebrandet ist dabei kein besserer Prompt, sondern zwanzig Minuten, die du einmal investierst.
Fang mit dem an, was du schon hast. Lad dein Logo und deine Website hoch, lass das System generieren und bau als Erstes die Präsentation, die du ohnehin nächste Woche brauchst.
Wie kannst auch du diesen Use-Case konkret umsetzen?
We Present·Umsetzungsworkshop
Claude Design
mit Lukas Salchner
Aus deiner Marke wird ein System, das überall gilt. Du legst einmal dein Designsystem an und baust damit Folien, Landingpages und Dokumente, ohne deinen Stil je wieder erklären zu müssen.
inkl. 50+ Std. Workshop-Archiv
Mehr in unserer KI-Tool-Übersicht
Die vollständige AITI-Tool-Übersicht zeigt alle Tools, die wir aktuell empfehlen, mit Bewertung, Use-Case-Logik und Lernpfad. Zur Vertiefung: KI-Tools für Coding & No-Code.
