KI im DesignClaudeAI-ToolsUX DesignProduct Design

Claude Design im UX-Workflow: Was die neue Funktion wirklich kann — und was nicht

Jannik Noe · 23. April 2026· 9 Min. Lesezeit

Ein nüchterner Praxis-Blick auf Anthropics neues Design-Feature zwischen Hype, Handwerk und Hausaufgaben

Claude Design im UX-Workflow: Was die neue Funktion wirklich kann — und was nicht

Claude macht jetzt Design — was heißt das wirklich?

Mit Claude Design hat Anthropic eine Funktion veröffentlicht, die in den letzten Wochen durch viele Design-Timelines gespült wurde. Wer kurz darüber schaut, bekommt das Gefühl, der Beruf des UI/UX Designers hätte sich über Nacht erledigt: Screens in Sekunden, Komponenten per Prompt, klickbare Prototypen ohne Figma. Wer länger hinschaut, sieht ein deutlich differenzierteres Bild.

Ich habe Claude Design in den letzten Wochen in verschiedenen Projekten eingesetzt — von schnellen Konzept-Mockups bis zu Komponenten-Entwürfen für bestehende Design-Systeme. Das Ergebnis ist weder „Designer sind überflüssig" noch „alles nur Hype". Es ist komplizierter. Und genau deshalb lohnt sich der nüchterne Blick.

Jedes neue KI-Tool erzeugt denselben Reflex: Erst die Heilsversprechen, dann die Schreckensszenarien, schließlich die differenzierte Praxis. Claude Design ist keine Ausnahme — nur dass die Praxis-Phase oft am leisesten stattfindet.

1. Was Claude Design eigentlich tut

Claude Design ist kein klassisches Design-Tool im Sinne von Figma oder Sketch. Es ist eine Erweiterung von Claude, die aus einer Beschreibung heraus funktionsfähige Interfaces erzeugt — direkt im Chat, als interaktives Artifact, das man anschauen, anklicken und weiterentwickeln kann. Unter der Haube wird React, Tailwind und standardmäßig semantisches HTML erzeugt, also echter Code statt rein visueller Entwurf.

Was die Funktion konkret anbietet:

  • Screens aus Text: Eine Beschreibung wie „Dashboard für ein Fitness-Studio mit Kursplan, Mitgliederzahl und Reviews" erzeugt einen responsiven Prototyp
  • Varianten auf Abruf: „Gib mir eine minimalistische und eine verspielte Variante" liefert beide sofort
  • Iteratives Refinement: Änderungen werden im Chat beschrieben („Der Header wirkt zu voll, reduziere ihn auf Logo und CTA")
  • Code-Output: Am Ende steht ein echtes React-File, nicht nur ein Bild-Export

Das ist der wichtigste Unterschied zu älteren KI-Design-Tools: Claude Design bewegt sich im Medium Code, nicht im Medium Pixel. Das ist Stärke und Schwäche zugleich.

2. Wo Claude Design wirklich überzeugt

Rapid Prototyping für Konzeptgespräche

Wenn es darum geht, im Kundengespräch eine grobe Richtung zu zeigen, ist Claude Design ernsthaft schnell. Statt im Workshop über abstrakte Begriffe zu streiten („Was meinst du mit ‚verspielt'?"), zeige ich drei Varianten, die in drei Minuten entstanden sind, und die Diskussion wird sofort konkret. Das ist kein Marketing-Versprechen, das ist Alltag.

Komponenten-Skizzen vor dem Figma-Feinschliff

Für einzelne UI-Komponenten — eine Pricing-Tabelle, ein Onboarding-Screen, ein Empty State — liefert Claude Design ordentliche Ausgangspunkte. Keine finalen Designs, aber Startpunkte, die einem das leere Figma-Artboard ersparen. Der Effekt ist psychologisch größer, als man denkt: Weniger Start-Reibung bedeutet schnellere Entscheidungen.

Content- und Layout-Experimente

Besonders stark ist die Funktion, wenn es um strukturelle Varianten geht. „Zeig mir den gleichen Content in drei Layout-Systemen: Bento, Column-Grid und asymmetrisch" — das würde in Figma schnell zwei Stunden dauern. In Claude Design dauert es drei Minuten, inklusive klickbarer Vergleichsansicht.

Boilerplate-Abbau

Wer schon mal einen Landing-Page-Aufbau von Grund auf in Figma gemalt hat — Header, Hero, Feature-Section, Testimonial-Grid, CTA, Footer — kennt den Frust der immer gleichen Rechtecke. Claude Design nimmt dir diesen Teil ab und lässt dich an den spannenden Stellen anfangen: der Markenidentität, der Microcopy, den Details.

Praxis-Tipp: Behandle Claude Design wie einen sehr schnellen Junior-Designer, der nicht müde wird. Er liefert solide Ausgangspunkte, aber keine fertigen Lösungen — und er braucht klare Anweisungen.

3. Die ehrlichen Schwächen

Ästhetische Mittelmäßigkeit ist der Default

Hier wird es unbequem: Claude Design produziert zuverlässig gutes Mittelmaß. Saubere Buttons, brauchbare Abstände, funktionale Layouts. Aber fast nie etwas, das memorabel ist. Die Outputs haben einen erkennbaren „LLM-Design-Look" — generische Teal-Töne, gleichförmige Rundungen, SaaS-Ästhetik aus der Stock-Photo-Hölle. Wer das nicht bewusst bricht, produziert austauschbare Produkte.

Markenidentität bleibt eine Aufgabe

Ein Design lebt davon, dass es sich anfühlt wie die Marke, für die es entsteht. Claude Design kann Farben übernehmen, Fonts setzen und Designtokens respektieren — aber es versteht nicht, warum eine nordische Bank anders aussieht als eine Berliner Lifestyle-Marke. Das ästhetische Urteilsvermögen bleibt komplett beim Menschen.

Accessibility ist nicht automatisch

Claude Design produziert semantisches HTML, das ist gut. Aber automatisch barrierefrei wird der Output dadurch nicht: Farbkontraste sind oft zu knapp, Fokus-Styles fehlen teilweise, Screenreader-Labels müssen von Hand ergänzt werden. Wer auf Compliance achtet — Stichwort BFSG — muss jede Ausgabe prüfen.

Design-System-Integration ist schwach

Das größte Defizit im professionellen Einsatz: Claude Design arbeitet im luftleeren Raum. Es kennt dein Design-System nicht, deine Tokens nicht, deine Spacing-Regeln nicht. Du kannst sie per Prompt beschreiben, aber das Ergebnis bleibt eine Annäherung. Für Teams mit gepflegtem Design-System ist die Integration in Figma-Variables oft schneller und präziser.

Die „Prompt-Debt"

Ein unterschätztes Problem: Wer viel mit Claude Design arbeitet, produziert Prompt-Debt — Prototypen, die niemand mehr nachvollziehen kann, weil der entscheidende Kontext im Chat-Verlauf steckt. Ohne Dokumentation, Naming und Versionierung entsteht ein schwer wartbarer Wildwuchs. Das ist nicht Claudes Schuld, aber es ist der Fallstrick der Technologie.

claude design generisch markenkonform

4. „Jetzt ist jeder Designer" — warum das Unsinn ist

Mit jedem neuen KI-Tool kommt der Satz: „Jetzt braucht man ja keine Designer mehr." Bei Claude Design ist er besonders laut zu hören — weil das Ergebnis beim ersten Hingucken wirklich beeindruckend aussieht. Aber wer länger arbeitet, merkt: Design ist nicht das Produzieren von Screens. Design ist das Entscheiden darüber.

Der Unterschied zwischen Output und Urteil

Einen Screen generieren kann mittlerweile jeder. Beurteilen, ob dieser Screen in diesem spezifischen Produktkontext, für diese Zielgruppe, mit diesen Business-Zielen die richtige Antwort ist — das bleibt eine Fähigkeit, die Erfahrung, Research und Urteilsvermögen voraussetzt. Die schnelle Produktion verschiebt den Engpass nur: Vom Bauen zum Bewerten.

Prompts sind kein Ersatz für Design-Denken

Wer Claude Design ohne Designprozess einsetzt, bekommt, was Laien bestellen: hübsch aussehende Screens, die aber an der falschen Stelle ansetzen. Ein Onboarding, das visuell schick ist und trotzdem die Dropout-Rate erhöht. Eine Landing-Page, die alle Best Practices erfüllt und trotzdem nicht konvertiert. Das ist keine Designfrage — das ist eine Denkfrage.

Was Designer wirklich tun

Gutes Design besteht zu etwa einem Viertel aus der Visualisierung und zu drei Vierteln aus allem davor und danach: Problemverständnis, User Research, Informationsarchitektur, Content-Strategie, Prozessbegleitung mit Stakeholdern, QA, Handoff, Review-Schleifen. Claude Design beschleunigt einen Teil dieser Kette drastisch — aber es ersetzt keinen einzigen der anderen Schritte.

  • Problemverständnis: Warum bauen wir das? Wer nutzt es? Welches Verhalten wollen wir erzeugen?
  • Research-Integration: Welche Nutzerinterviews fließen in welche Design-Entscheidung ein?
  • Kontext-Fit: Wie passt dieser Screen ins bestehende Produkt, in die Marke, in die Plattform?
  • Edge-Cases: Was passiert bei Fehlern, bei leeren Zuständen, bei schlechter Verbindung?
  • Strategische Abwägung: Welcher Trade-off zwischen Geschwindigkeit und Gründlichkeit ist für dieses Projekt richtig?

Die eigentliche Frage ist nicht „Kann KI designen?", sondern: „Was war Design eigentlich schon immer?" Wer meint, Design sei das Pushen von Rechtecken, wird bald arbeitslos. Wer versteht, dass Design das Treffen durchdachter Entscheidungen unter Unsicherheit ist, wird eher gesucht als je zuvor.

5. So integrierst du Claude Design sinnvoll

Als Sparringspartner, nicht als Produktionsmaschine

Der nützlichste Einsatz ist nicht „KI liefert das fertige Design", sondern „KI liefert Diskussionsmaterial". Generiere fünf Varianten, suche drei davon aus, verfeinere sie bewusst von Hand und nutze den Prozess, um Design-Entscheidungen explizit zu machen. Das ist schneller als reines Handmalen und trotzdem durchdacht.

Für Exploration in frühen Phasen

In der Discovery-Phase ist Claude Design Gold wert. Viele Ideen schnell durchspielen, mit Stakeholdern über konkrete Entwürfe reden statt über Wireframes, Richtungsentscheidungen visuell unterstützen — das alles geht um ein Vielfaches schneller.

Für Komponenten-Audits

Ein unterschätzter Use-Case: Lade die bestehende Komponente in Claude und frage „Wie würdest du dieselbe Komponente für mobile First, für Dark Mode und für Accessibility AA umbauen?" Die Vorschläge sind selten komplett übernehmbar — aber sie sind hervorragende Checklisten, was du übersehen haben könntest.

Als Content-Prototyping-Werkzeug

Prototypen mit realistischem Content statt Lorem Ipsum testen sich deutlich besser. Claude Design macht es leicht, Texte, Produktbeschreibungen oder Chat-Dialoge direkt in den Entwurf einzufügen — und mehrere Content-Längen durchzuspielen, was in Figma mühsam ist.

6. Werkzeug-Hierarchie: Wann was?

Keine Werkzeugfrage hat nur eine Antwort. Eine pragmatische Einordnung aus meiner Praxis:

  • Claude Design ist ideal für: erste Explorationen, Landing-Pages, Content-Varianten, Konzept-Mockups in Kundengesprächen, reine React-Prototypen
  • Figma bleibt unverzichtbar für: Design-System-Pflege, detailliertes Feinlayout, Team-Collaboration mit Kommentaren, Handoff an Entwicklung, Auto-Layout mit Design-Tokens
  • Code-first ist besser, wenn: die finale Plattform das Produktionsziel ist, Design-Iteration direkt auf echter Infrastruktur sinnvoll ist, oder ein erfahrenes Entwicklerteam mitentwirft
  • Handskizze schlägt weiterhin alles, wenn: es ums frühe Durchdenken geht, bevor ein einziger Pixel gesetzt wird

Eine praktische Werkzeugkette

Ein Workflow, der sich für mich bewährt hat: Erst Skizze auf Papier oder Whiteboard, dann Claude Design für die erste digitale Annäherung, dann Figma für die seriöse Ausarbeitung mit Design-System und Token-Anbindung, dann Implementierung. Jedes Werkzeug an der Stelle, an der es am meisten liefert — und keines davon allein.

claude design werkzeugkette

7. Was das für Designer in den nächsten Jahren bedeutet

Neue Skill-Prioritäten

Die Rangordnung der wertvollen Design-Skills verschiebt sich. Das rein handwerkliche Zeichnen von Rechtecken in Figma wird günstiger, nicht wertvoller. Im Gegenzug steigt der Wert aller Fähigkeiten, die einen Designer vom „besseren Prompt-Engineer" unterscheiden:

  • Strategisches Denken: Warum ist das hier das richtige Problem?
  • Research-Fähigkeit: Echte Nutzer zu verstehen, nicht Personas zu beschreiben
  • Kritikfähigkeit: Output beurteilen und präzise benennen, was fehlt
  • Prozess-Führung: Stakeholder durch Unsicherheit navigieren
  • Ästhetisches Urteilsvermögen: Was unterscheidet generisch von markenstark?

Prompt-Craft als neue Disziplin

Gute Prompts für Claude Design zu formulieren ist eine eigene Fähigkeit — und eine, die Designer besser lernen sollten als Nicht-Designer. Wer die Sprache des Designs kennt (Hierarchie, Spacing-System, Grid-Logik, Tone-of-Voice), bekommt aus Claude dramatisch bessere Ergebnisse. Das ist kein Gegenargument zu menschlichem Können, das ist seine Fortsetzung mit neuen Werkzeugen.

Mehr Verantwortung, nicht weniger

Je schneller wir produzieren können, desto wichtiger wird die Frage, was wir produzieren. KI-Tools wie Claude Design erhöhen den ethischen Druck: Wenn in einer Stunde drei Prototypen entstehen, muss der Designer dreimal so schnell beurteilen, welcher davon den Nutzern wirklich dient — und welcher nur hübsch aussieht.

Die optimistische Lesart: KI-Tools machen uns schneller bei dem, was uns ohnehin langweilt, und lassen mehr Zeit für das, was uns ausmacht. Die realistische Lesart: Das gilt nur, wenn wir bewusst genau das tun — sonst beschleunigen wir uns selbst ins Mittelmaß.

Fazit

Claude Design ist ein ernst zu nehmendes Werkzeug, aber kein Ersatz für Designer. Es beschleunigt genau den Teil der Design-Arbeit, der sich gut automatisieren lässt — und lässt den Teil unberührt, der wirklich den Unterschied macht. Wer das versteht, bekommt ein starkes neues Werkzeug. Wer es missversteht, baut schneller schlechte Produkte.

Die zentralen Takeaways:

  • Tool statt Allheilmittel: Claude Design ist schnell, aber nicht smart — das Urteil bleibt beim Menschen
  • Gutes Mittelmaß als Default: Erwarte solide Outputs, keine Magie — und brich den Generic-Look bewusst
  • Integrationsschwäche: Design-Systeme, Markenidentität und Accessibility musst du selbst sichern
  • Prompts sind keine Strategie: Wer nicht designen gelernt hat, bekommt hübsche, aber falsche Screens
  • Neue Skill-Gewichtung: Strategisches Denken, Research und Urteilsvermögen werden wertvoller, nicht weniger wichtig
  • Bewusster Einsatz: In der Exploration ein Gewinn, im finalen Feinschliff selten überzeugend

Die spannendste Konsequenz ist nicht, dass Designer überflüssig werden. Sondern dass der Unterschied zwischen guten und austauschbaren Designern sichtbarer wird. Wer nur Rechtecke geschoben hat, wird es schwer haben. Wer durchdacht entschieden hat, wird genau deshalb gebraucht — nur mit einem schnelleren Werkzeug in der Hand.

Transparenzhinweis: Die Bilder in diesem Artikel wurden mit Unterstützung von KI-Tools erstellt.

Weiterlesen
Alle Artikel →

Let's Work Together

Du planst ein digitales Produkt, ein Redesign — oder möchtest euer Team mit einem AI-UX Workshop voranbringen?

Ich unterstütze Unternehmen dabei, komplexe Anforderungen in klare, nutzerfreundliche Lösungen zu übersetzen.

Schritt 01 / 04

Wie kann ich helfen?

Dauert ca. 1 Minute. Bitte wähle eine Option