_KI UND DESIGN_

# Gestalten mit KI: Der Prozess hat sich verändert, die Leinwand noch nicht

Vor zwei Jahren half KI beim Formulieren eines Textes. Heute ist sie an jedem Schritt des Designs beteiligt, von der Recherche bis zur Übergabe. Was nicht verschwunden ist, ist die Leinwand: Figma verliert an Gewicht, bleibt aber der Ort, an dem Teams ausprobieren, diskutieren und entscheiden.

Javier González · 11. Nov. 2026 · 6 Min. Lesezeit

## Kein neues Werkzeug, sondern ein Begleiter in jedem Schritt

Wer von KI und Design spricht, denkt an Bildschirme, die aus einem Prompt entstehen. Das ist der sichtbarste und unwichtigste Teil. Verändert hat die Arbeit, dass KI in alle Schritte des Prozesses eingezogen ist, auch in die unscheinbaren: transkribieren, gruppieren, vergleichen, prüfen, einen Entwurf in Code übersetzen.

Das sehe ich in meiner Arbeit und in den Teams, mit denen ich zusammenarbeite, Schritt für Schritt.

### 1. Recherche
- **Früher:** Interviews, Umfragen und handschriftliche Notizen.
- **Jetzt:** Transkripte und eine erste Gruppierung der Themen in Minuten.
- **Bleibt menschlich:** Entscheiden, wen und was man fragt; zwischen den Zeilen lesen.

### 2. Synthese
- **Früher:** Haftnotizen und wochenlange Affinitätsarbeit.
- **Jetzt:** Cluster und Zusammenfassungen, an der Quelle geprüft.
- **Bleibt menschlich:** Sinn stiften und Prioritäten setzen.

### 3. Ideenfindung
- **Früher:** Skizzen und eine Handvoll Optionen.
- **Jetzt:** Dutzende Varianten und Referenzen an einem Nachmittag.
- **Bleibt menschlich:** Mit Urteilsvermögen wählen und verwerfen.

### 4. Gestalten und Prototyping
- **Früher:** Statische Bildschirme in Figma.
- **Jetzt:** Funktionierende Prototypen, mit Agenten erzeugt und verfeinert.
- **Bleibt menschlich:** Stimmigkeit, Hierarchie und Detail.

### 5. Validierung
- **Früher:** Tests nach wochenlangem Aufbau.
- **Jetzt:** Früher testbar, mit automatischen Prüfungen zu Barrierefreiheit und Konsistenz.
- **Bleibt menschlich:** Mit echten Nutzern sprechen und entscheiden.

### 6. Übergabe
- **Früher:** Spezifikationen und Übergabetermine.
- **Jetzt:** Komponenten und Struktur, die der Code bereits versteht.
- **Bleibt menschlich:** Regeln vereinbaren und das Ergebnis prüfen.

Drei Verschiebungen wiederholen sich in allen Schritten.

- **Die erste Version kostet fast nichts mehr.** Zehn Optionen zu erkunden kostet, was früher eine einzige zu zeichnen kostete.
- **Der Engpass ist nicht mehr das Herstellen, sondern das Bewerten.** Bei mehr Optionen und mehr Material ist das Schwierige zu wissen, welche gut ist und warum.
- **Die Übergabe ist keine Übergabe mehr.** Ist ein Prototyp echter Code und liegen die Regeln im Repository, reichen Design und Frontend keine Dateien mehr hin und her, sondern arbeiten am selben Gegenstand.

Nichts davon nimmt das Urteilsvermögen weg. Es konzentriert es: weniger Mechanisches, mehr von dem, was Kriterien verlangt.

## Warum Figma vorerst im Zentrum bleibt

Figma verliert an Gewicht. Prototypen entstehen immer öfter im Code, die Regeln des Systems liegen immer öfter in einem Repository, und Agenten lesen Struktur, keine Ebenen. Trotzdem bleibt es das Referenzwerkzeug, und zwar aus einem nicht technischen Grund: Ein Team braucht einen gemeinsamen Ort, um zu sehen, zu diskutieren und zu entscheiden.

Vier Dinge leistet eine Leinwand sehr gut, und keine Alternative hat sie bisher gelöst:

- **Ausprobieren.** Etwas verschieben und sofort sehen, was passiert, ohne Kompilieren oder Deployen.
- **Diskutieren.** Zeigen, kommentieren und vergleichen, gemeinsam mit Menschen, die nicht programmieren: Produkt, Business, Leitung.
- **Überblicken.** Mehrere Optionen und Abläufe gleichzeitig sehen, nicht einen Bildschirm nach dem anderen.
- **Iterieren.** Rückgängig machen, duplizieren und neu machen, ohne Kosten und vor allen.

Ein Stakeholder prüft keinen Pull Request. Er will einen Ort, an dem er die Idee sieht, anfasst und sagt: „So nicht“. Heute ist dieser Ort noch eine Leinwand. Solange Code-Prototypen nicht dieselbe Gesprächsgeschwindigkeit bieten, bleibt Figma nützlich.

Was sich ändert, ist seine Rolle. Von der Quelle der Wahrheit wird es zu einer weiteren Ansicht: ein Ort zum Erkunden und Abstimmen, über Tokens und Variablen mit einem System verbunden, das anderswo lebt. Darüber habe ich im [Artikel über Headless-Designsysteme](https://baguelus.com/de/articulos/sistema-diseno-headless/) geschrieben.

## Der Werkzeug-Stack, gestern und heute

Die Veränderung liegt nicht nur bei den Werkzeugen. Früher hatte jeder Schritt sein eigenes, und die Übergabe von einem zum nächsten war manuell. Heute gibt es eine Kette mit einem Agenten in der Mitte, der in fast allen liest und schreibt.

| | Gestern | Heute |
|---|---|---|
| **Recherche und Synthese** | UserZoom, Tabellen, Miro und Haftnotizen | Transkription und Gruppierung mit ChatGPT oder Claude, automatisiert mit n8n |
| **Ideen und Abläufe** | Papier, Whiteboards, Miro | Varianten mit einem LLM; ein gemeinsames Whiteboard nur zum gemeinsamen Entscheiden |
| **UI und Prototypen** | Sketch, dann Figma; verlinkte Prototypen | Figma als Leinwand; funktionierende Prototypen mit Lovable oder Claude Code |
| **Übergabe** | Spezifikationsdokumente, Zeplin, Übergabetermine | Figma MCP, Tokens und Spezifikationen im Repository, Storybook |
| **Umsetzung** | Frontend von Grund auf gebaut | Cursor, Claude Code oder Codex mit dem Designsystem als Kontext |

Auffällig ist, was bleibt: Figma, Git und Storybook sind noch da. Fast jeden Sinn verloren hat das Werkzeug, das nur zum „Übergeben“ diente: Die Spezifikation als Dokument ist zu Struktur geworden, die der Code liest.

## Was ich für 2027 und 2028 erwarte

All das ändert sich alle paar Monate, deshalb sind die folgenden Punkte Wetten, keine Prognosen. Ich schreibe sie auf, um sie in einem Jahr zu überprüfen.

**Heute · Ende 2026**
- Figma ist weiterhin die Referenz-Leinwand.
- Agenten schreiben Oberflächen-Code aus Entwürfen und aus dem Repository.
- Code-Prototypen dienen zur Validierung.
- Das Designsystem beginnt, außerhalb von Figma zu leben.

**2027 · Wette**
- Leinwände rücken näher an den Code: Diskutiert wird die echte Komponente.
- Gestalten und Bauen sind nicht mehr zwei getrennte Dateien.
- Das Prüfen von KI-Ergebnissen wird tägliche Designarbeit.
- Figma wird von der Quelle zur Ansicht.

**2028 · Unsicherere Wette**
- Ein neuer Werkzeugtyp: eine visuelle Leinwand, verbunden mit echtem Code und den Regeln des Systems.
- Stakeholder kommentieren lebende Versionen statt Frames.
- Die Designrolle verschiebt sich zum Kuratieren von Vorgaben, Bewerten und Entscheiden.
- Designer, die auch bauen, werden üblich.

Worauf ich nicht wetten würde: dass Designer verschwinden oder dass ein Prompt die Leinwand ersetzt. Teams werden weiterhin jemanden brauchen, der Menschen versteht, die Regeln definiert und für das einsteht, was ausgeliefert wird.

> Das Werkzeug, das Figma ablöst, wird kein Bildschirm-Generator sein. Es wird eine Leinwand sein, die mit dem echten Code und den Regeln des Systems verbunden ist.

## Was mir Sorgen macht

- **Gleichförmigkeit.** Wenn wir alle von denselben Vorschlägen ausgehen, sieht alles gleich aus.
- **Übermäßiges Vertrauen.** Ein plausibles Ergebnis ist kein richtiges; es muss mit dem Team geprüft werden.
- **Barrierefreiheit und Regeln.** Was nicht als Regel festgehalten ist, ignorieren Agenten.

## Was ich diese Woche tun würde

1. **Wählen Sie einen Schritt,** in dem Sie am meisten Zeit mit mechanischen Aufgaben verlieren, und probieren Sie KI nur dort.
2. **Schreiben Sie die Regeln vor den Prompts:** Tokens, Komponenten und Abnahmekriterien.
3. **Behalten Sie eine Leinwand zum Entscheiden.** Der Code validiert, die Leinwand dient dem Gespräch.
4. **Messen Sie, was sich ändert:** Zeit bis zur ersten Version, Review-Runden, Fehler bei der Übergabe.