Revision 721: Designsysteme, Headless CMS und KI-gestützte Content Operations. Mit Jonas Ulrich
Wir sprechen mit Jonas Ulrich von der Ruhmesmeile in Bonn über Designsysteme, Headless-CMS-Workflows und darüber, warum kickstartDS nicht nur als Komponentenfundament, sondern auch als strukturierte Wissensbasis für KI-gestützte Redaktionsarbeit interessant ist.
Nachdem Jonas bereits in Revision 538 und Revision 607 bei uns zu Gast war, schauen wir diesmal darauf, wie sich Designsysteme, JSON Schema, Model Context Protocol und Headless-Systeme wie Storyblok zu einem Workflow verbinden lassen, der Frontend, CMS und Redaktion enger zusammenbringt.
Shownotes
- [00:00:00] Designsysteme, Headless CMS und KI-gestützte Content Operations
Jonas stellt zunächst Ruhmesmeile und den Weg von der klassischen Webagentur hin zu einer Boutique-Entwicklungsagentur vor, die sich auf nachhaltige Frontend-Architekturen und Designsysteme konzentriert. Ein zentrales Thema ist, dass nicht jedes Projekt ein eigenes Designsystem braucht. Dort, wo Projekte groß genug sind oder über längere Zeit konsistent wachsen sollen, kann ein Designsystem aber helfen, Qualität, Barrierefreiheit, Performance und Wiederverwendbarkeit skalierbar zu machen.
Wir sprechen darüber, wie kickstartDS aus der eigenen Agenturpraxis heraus entstanden ist: als wiederverwendbares Fundament für Marketing-Websites, Landingpages und ähnliche Oberflächen, bei denen sich Informationsarchitektur und Komponentenbedarf oft stärker ähneln, als man zunächst denkt. Wichtig ist Jonas dabei, dass kickstartDS nicht das nächste Bootstrap sein will, sondern eine systematische Anschubhilfe, auf deren Basis Teams weiterhin eigene Komponenten und spezifische Lösungen bauen können.
Ein großer Teil des Gesprächs dreht sich um die Verbindung von Designsystemen mit Headless-CMS-Systemen. Jonas erklärt, wie Ruhmesmeile Komponenten, Templates und Seitenstrukturen über JSON Schema beschreibt und daraus CMS-Konfigurationen ableitet. Die Schema-Beschreibungen dienen dabei als Contract zwischen Frontend, Redaktion und Backend. So kann ein Converter Strukturen wie Page-Templates, Blog-Templates, Sections und Komponenten ins CMS übertragen und später auch Änderungen kontrolliert nachziehen. Dadurch wird Drift zwischen Frontend-Code und CMS-Modell reduziert.
Daraus ergibt sich auch der KI-Teil des Gesprächs: Weil die Frontend-Struktur bereits maschinenlesbar beschrieben ist, lässt sie sich gut mit LLMs verwenden. Jonas beschreibt, wie Structured Outputs und JSON Schema genutzt werden können, um Inhalte direkt im erwarteten Format generieren zu lassen, statt lose Texte zu erzeugen und anschließend per Copy and Paste ins CMS zu übertragen. Das Ergebnis kann als Preview gerendert, über denselben Konverter in ein CMS-spezifisches Format gebracht und anschließend redaktionell weiterbearbeitet werden.
Damit die Ergebnisse nicht beliebig wirken, analysiert Ruhmesmeile bestehende Inhalte im CMS. Daraus lassen sich Muster ableiten: Welche Komponenten stehen typischerweise an welcher Position? Wie viele Features werden normalerweise gezeigt? Welche Breiten oder Layout-Optionen sind in bestimmten Kontexten üblich? Diese Informationen werden wiederum in die JSON-Schema-Beschreibungen injiziert und damit Teil des Prompts. So entsteht ein KI-gestützter Workflow, der sich stärker am bestehenden System, am Tonfall und an den gewachsenen Inhaltsmustern orientiert.
Wir sprechen außerdem über das Model Context Protocol als eine Art API-Verschalung für LLMs. Ein MCP-Server kann bestehende APIs so zugänglich machen, dass ein LLM die passenden Tools, Prozesse und Kontextinformationen bekommt. Jonas vergleicht das mit einem Backend-for-Frontend, nur mit einem LLM als Adressaten. Ruhmesmeile nutzt diesen Ansatz, um Storyblok, Designsystem-Wissen und Content-Workflows miteinander zu verbinden.
Ein praktischer Aspekt ist die Bedienung durch Redakteurinnen und Redakteure. Jonas beschreibt eine Prompt-Komponente im CMS, die wie ein Inhaltsblock eingesetzt werden kann: entweder auf einer leeren Seite, um mehrere Sektionen vorzuschlagen, oder an einer bestimmten Position, um gezielt ein Element zu erzeugen. Zusätzlich können externe Chat-Interfaces oder Automatisierungstools angebunden werden, etwa um Blogpost-Entwürfe aus RSS-Feeds zu generieren oder Varianten für unterschiedliche Zielgruppen vorzubereiten. Veröffentlicht wird dabei aber nicht automatisch. Der Mensch bleibt bewusst im Loop.
Zum Schluss sprechen wir über Grenzen und Nebenwirkungen von KI. Jonas betont, dass LLMs beim Schreiben helfen können, aber weiterhin halluzinieren und besonders bei Bildern nicht automatisch gute redaktionelle Entscheidungen treffen. Als pragmatische Lösung nutzt Ruhmesmeile Platzhalterbilder, deren Text vom LLM beschreibt, welches Bild an dieser Stelle sinnvoll wäre. Außerdem diskutieren wir, wie KI Coding, Dokumentation und Lernen verändert, warum Review und Verständnis weiterhin wichtig bleiben und warum Junior-Entwicklung nicht einfach durch Prompting ersetzt werden kann.
Links
- Jonas Ulrich auf LinkedIn
Jonas’ LinkedIn-Profil und der beste Social-Kanal, um ihn zu finden.
- Ruhmesmeile
Die Agentur aus Bonn, die kickstartDS entwickelt und mit Designsystemen, Headless CMS und Content-Workflows arbeitet.
- kickstartDS
Das von Ruhmesmeile entwickelte Designsystem-Fundament für strukturierte und wiederverwendbare Frontend-Entwicklung.
- Working Draft Revision 538
Jonas’ erster Besuch bei Working Draft zum Thema Designsysteme.
- Working Draft Revision 607
Jonas’ zweiter Besuch bei Working Draft mit weiteren Einblicken in kickstartDS.
- JSON Schema
Der Standard, über den Ruhmesmeile Komponenten, Templates und Inhaltsstrukturen maschinenlesbar beschreibt.
- Model Context Protocol
Der Standard, über den externe Systeme ihre Werkzeuge und Kontexte für LLMs zugänglich machen können.
- MCP Elicitation
Ein MCP-Mechanismus, mit dem ein System strukturierte Rückfragen an Nutzerinnen und Nutzer stellen kann.
- Storyblok JoyConf
Die Storyblok-Konferenz, auf der man Jonas und Mitstreitende antreffen kann.
- Dein CMS kann jetzt denken
Ein Ruhmesmeile-Artikel zu KI-gestützten Content Operations im CMS-Kontext.
- Unlocking the Frontend
Ein kickstartDS-Artikel, der einige der im Gespräch erwähnten technischen Ideen rund um Designsysteme vertieft.