Heute kann jeder im Unternehmen die Website mit KI ändern. Wie BILL sie einheitlich hält

Code, der nur aussieht wie das Produkt

Im August 2026 beschrieb David Cai, UI Software Architect beim US-Fintech BILL, im Engineering-Blog des Unternehmens ein Problem, das jeder kennt, der mit KI-Agenten arbeitet. Bittet man einen Agenten um eine Einstellungsseite, bekommt man eine Einstellungsseite, die plausibel aussieht. Erst beim genaueren Hinsehen fallen fest eingetragene Farben auf, wo Design-Tokens hingehört hätten, und ein selbst gebauter Button, der dem aus der Komponentenbibliothek fast gleicht.

Einzeln betrachtet wirkten diese Entscheidungen nicht wie Fehler. Zusammen zogen sie das Produkt vom Designsystem weg, und jede Abweichung kostete einen Kommentar im Code-Review und eine weitere Korrekturrunde. Laut dem Beitrag hatten all diese Fehlgriffe eine gemeinsame Ursache: Der Agent arbeitete blind. Das Wissen, wie es richtig geht, war vorhanden, nur nicht in einer Form, die der Agent nutzen konnte.

Ein Designsystem, das auch Agenten lesen können

Das Designsystem von BILL heißt Trinity, als einzige verbindliche Quelle (Single Source of Truth) dient Storybook. Neu gebaut hat das Team nichts. Es setzte auf das bestehende System eine Schicht für Agenten: ein Kommandozeilen-Tool, einen MCP-Server und eine Reihe von Anweisungen (sogenannte Skills), über die ein Agent Komponenten und Regeln abfragen kann.

Was das bringt, zeigen die A/B-Tests aus dem Beitrag. Mit Zugriff auf das Designsystem lieferte der Agent gleich beim ersten Durchlauf die richtigen Komponenten, und der Tokenverbrauch pro Aufgabe sank um 31 bis 63 Prozent. Ohne diesen Zugriff sollte der Agent in einem Test eine Gruppe von Auswahlkacheln bauen und lieferte stattdessen gewöhnliche Radiobuttons mit fest eingetragenen Farben und Abständen.

Luke Wroblewski sieht dasselbe

Luke Wroblewski arbeitet seit mehr als 20 Jahren mit Designsystemen und beschreibt auf LukeW.com ein Muster, das jedes Designteam kennt. Ein Unternehmen investiert in ein System, kommt mit der Pflege nicht hinterher, und irgendwann beschreibt die Dokumentation ein Produkt, das es so nicht mehr gibt. Mit KI-Agenten kommt ein zweites Problem hinzu. Marketing, Entwicklung und Produktmanagement ändern die Website über ihre eigenen Agenten, und jeder Agent bringt seinen eigenen Ton, eigene Farben und Abstände mit, solange ihn nichts lenkt.

In den Projekten, die der Beitrag zeigt (die Websites Intent, Sol und Aria), funktioniert das so: Farben, Schriften, Schriftgrößen und das Raster liegen als Design-Tokens im Code. Eine Datei AGENTS.md weist die Agenten an, vorhandene Klassen und Variablen zu verwenden, statt Werte zu kopieren. Die Seite des Designsystems entsteht aus demselben Code wie die Website und ist deshalb immer aktuell. Bittet jemand einen Agenten um einen neuen Button, greift dieser auf die vorhandene Komponente zurück, die sich auch an den Dark Mode anpasst, und niemand muss etwas von Hand prüfen.

“Agents read it every single time.”

„Agenten lesen sie jedes einzelne Mal“ (Übers. CAASUAL).

Mit diesem Satz endet der Beitrag. Designer haben jahrelang versucht, Menschen zum Lesen der Designsystem-Dokumentation zu bewegen, mit wechselndem Erfolg. Agenten lesen sie von allein, vorausgesetzt, die Dokumentation liegt in einer für sie lesbaren Form vor.

Wie verbreitet das ist

Eine Umfrage von zeroheight unter 123 Menschen, die mit Designsystemen arbeiten, ergab: 59 % sehen Oberflächen, die am Designsystem vorbei entstehen. Die Hälfte sagt, dass andere Bereiche des Unternehmens KI nutzen, ohne das Designsystem einzubeziehen, und ebenso viele berichten, dass der KI-Einsatz anderer Teams Probleme verursacht. In 44 % der Organisationen wird das schlicht hingenommen. Nur 17 % halten ihre Dokumentation für sehr gut auf KI vorbereitet, obwohl 48 % bereits einen MCP-Server betreiben.

Womit Sie anfangen

Einen MCP-Server brauchen Sie am Anfang nicht. Sinnvoll ist der Start mit Tokens, also Farben, Typografie und Abständen, die als benannte Werte im Code stehen und von der ganzen Website genutzt werden. Sind sie angelegt, kommen eine kurze Anleitung für Agenten und automatische Prüfungen hinzu, ob neue Ansichten und Codeänderungen zum Designsystem passen, bevor sie bei Kunden ankommen. Hat Ihr Unternehmen noch kein Designsystem, entsteht es am besten zusammen mit der Oberfläche, wie wir auf unserer Seite zum UX/UI-Design beschreiben.

In unserem Angebot gehört das zum Bereich Konsistenz ohne Kontrollaufwand. Unstimmigkeiten fallen sofort auf und nicht erst nach dem Launch, egal wer die Änderung vorgenommen hat und mit welchem Tool. Wie ein gut dokumentiertes Designsystem die Übergabe an die Entwicklung verkürzt, lesen Sie in unserem Beitrag über die Design-Übergabe im KI-Zeitalter.