Zum Inhalt springen

KI · Web & Software

KI-Webentwicklung: 12 Agenten-Workflow

Wie spezialisierte KI-Agenten Webprojekte beschleunigen – und warum ein Mensch jeden Stand prüft und freigibt. Ein Blick in unseren Workflow.

8 Min. LesezeitOnur CirakogluAktualisiert

Titelgrafik im headon-Stil: KI-Webentwicklung: 12 Agenten-Workflow

Wir bauen Software mit KI-Agenten – nicht mit einem Chatfenster, sondern mit einem Workflow aus zwölf spezialisierten Rollen, einem koordinierenden Modell und einem Menschen, der jeden Stand prüft und freigibt. Dieser Beitrag zeigt, wie das funktioniert, wo der Zeitgewinn tatsächlich entsteht und wo die Grenzen liegen. Interaktiv sehen Sie den Ablauf auf der Seite KI-Workflow.

Warum ein Workflow und kein Chat

Ein Sprachmodell, dem man „bau mir eine Website“ zuruft, liefert etwas Generisches und vergisst nach dem dritten Prompt, was im ersten stand. Ein Workflow löst das anders: Jede Aufgabe bekommt eine Rolle mit klarem Auftrag, jede Rolle liefert ein prüfbares Ergebnis – Code, Tests, Texte, Konfiguration –, und Rollen und Regeln liegen in versionierten Textdateien. So lässt sich jeder Lauf wiederholen und nachträglich kontrollieren.

Die klassische Agenturarbeit ist dagegen linear: Briefing, Konzept, Design, Entwicklung, Test, Launch. Jede Phase wartet auf die vorherige, und jede Rückfrage geht über mehrere Schreibtische.

Unser KI-Workflow

7 Phasen · 12 Agenten

  1. 01Start
  2. 02Plan
  3. 03UI/UX
  4. 04Code
  5. 05Test
  6. 06Deploy
  7. 07Live

Jeden Schritt anklicken und die Agenten dahinter ansehen.

Workflow ansehen

Die zwölf Agenten

Jeder Agent hat einen engen Auftrag. Das ist die wichtigste Entscheidung im Aufbau: Ein Agent, der alles kann, ist in nichts gut.

Design

UI/UX-Agent – Wireframes, Nutzerführung, Design-System auf Basis der Vorgaben aus dem Erstgespräch. Content-Agent – Textentwürfe, Überschriftenstruktur, Bildbeschreibungen. Fachliche Aussagen kommen von Ihnen; der Agent bringt sie in Form. Branchen-Agent – bringt typische Anforderungen der Branche ein: Was braucht ein Prüfbetrieb, was ein Weingut, was eine Praxis.

Entwicklung

Frontend-Agent – setzt das Design in React und Next.js um, responsiv und barrierefrei. Backend-Agent – Serverlogik, Formulare, Datenverarbeitung. Datenbank-Agent – Datenmodell, Zugriffsrechte, Migrationen. API-Agent – Anbindung an bestehende Systeme: CRM, ERP, Zahlungsanbieter, Buchungstools.

Qualität

Security-Agent – prüft Zugriffsrechte, Eingabevalidierung, Umgang mit personenbezogenen Daten. Testing-Agent – schreibt und führt Tests aus: Einheiten, Integration, Ende-zu-Ende. Performance-Agent – Ladezeit-Budget, Core Web Vitals, Bildoptimierung.

Betrieb

DevOps-Agent – Build-Pipeline, Deployment auf Server in Deutschland, Monitoring. SEO-Agent – Seitentitel, strukturierte Daten, Sitemap, saubere Sprachversionen.

Der Ablauf in fünf Schritten

  1. Anfrage und Architektur. Wir klären Ziel, Daten und Rahmen. Der Architekt legt Aufbau und Prüfkriterien fest.
  2. Orchestrierung. Ein koordinierendes Modell – wir nennen es KI-Dirigent – zerlegt das Projekt in Aufgaben und verteilt sie.
  3. Design und Entwicklung. Die Agenten für Gestaltung, Inhalte, Frontend, Backend, Datenbank und Schnittstellen arbeiten parallel.
  4. Prüfung und Freigabe. Tests, Sicherheits- und Performance-Prüfungen laufen automatisch; der Architekt gibt jeden Stand frei.
  5. Auslieferung und Betrieb. Die Pipeline prüft Lint, Typen und Build, liefert auf Server in Deutschland aus und überwacht den Betrieb.

Wie lange das dauert, hängt vom Umfang ab. Feste Tagesangaben je Phase gibt es nicht – sie wären erfunden.

Ein belegtes Beispiel: fünf Tage bis zur App

Ein Prüfbetrieb in Baden-Württemberg dokumentierte die regelmäßige Prüfung persönlicher Schutzausrüstung gegen Absturz auf Papier. Wir haben das Formular in eine App übersetzt: QR-Code je Gerät, geführte Prüfung mit Pflichtfeldern, Unterschrift auf dem Gerät, automatisch erzeugtes PDF mit Prüfplakette – ausgeliefert als installierbare Web-App für Tablet und Smartphone.

Vom ersten Commit bis zur einsatzbereiten App vergingen fünf Tage. Die Zahl stammt aus der Versionsgeschichte des Projekts, nicht aus einer Schätzung. Die Fallstudie steht unter Digitales PSA-Prüfprotokoll.

Wo der Zeitgewinn entsteht

Linear vs. parallel

Klassischer Ablauf

  • Eine Phase wartet auf die vorherige
  • Jede Rückfrage geht über mehrere Schreibtische
  • Jedes Projekt beginnt bei null
  • Tests kommen am Ende – wenn Zeit bleibt

Agenten-Workflow

  • Design, Frontend, Backend und Tests laufen parallel
  • Bewährte Muster werden systematisch wiederverwendet
  • Tests und Dokumentation entstehen in jedem Schritt
  • Ein Mensch prüft – weniger Korrekturschleifen nach dem Launch

Was der Workflow nicht kann: fachliche Entscheidungen treffen. Welche Leistungen Ihr Unternehmen anbietet, was ein Prüfprotokoll enthalten muss, welche Preise gelten – das kommt von Ihnen. Die Agenten bringen es in Form und bauen es.

Für wen sich das eignet

Gut geeignet: Unternehmenswebsites, Web-Apps für Abläufe, die heute auf Papier oder in Tabellen stecken (Prüfprotokolle, Anfragen, interne Werkzeuge), Portale mit klarem Umfang.

Weniger geeignet: Systeme mit jahrelanger Legacy-Integration, stark regulierte Umgebungen mit eigenen Abnahmeverfahren, Projekte ohne klaren Auftraggeber.

Häufig gestellte Fragen

Spreche ich mit einer KI oder mit einem Menschen?

Mit einem Menschen. Die Agenten nutzen wir intern. Sie sehen Zwischenstände, geben Feedback und bekommen am Ende getestete Software – kein KI-Werkzeug, das Sie bedienen müssen.

Was passiert mit unseren Daten?

Sie bleiben Ihre Daten. Wir verarbeiten nur, was das Projekt braucht, und wählen das Modell nach Aufgabe, Datenschutz und Kosten – vertrauliche Daten auf Wunsch mit lokalen Modellen auf eigener Hardware. Gehostet wird auf Servern in Deutschland.

Kann KI gutes Design?

Gute Struktur und saubere Umsetzung: ja. Eine Marke, die sich von anderen unterscheidet, entsteht aus Ihren Vorgaben und der Prüfung durch den Architekten – nicht aus dem, was das Modell für typisch hält.

Was kostet ein Projekt?

Unsere Formate mit „ab“-Preisen stehen auf der Preisseite. Den genauen Festpreis nennen wir nach dem Erstgespräch schriftlich – bevor Sie etwas zusagen.

Wie schnell geht es?

Das hängt vom Umfang ab. Das belegte Beispiel: fünf Tage für das Prüfprotokoll. Für Ihr Projekt nennen wir den Zeitplan im Angebot.

Derselbe Workflow, andere Aufgabe

Der Workflow ist nicht auf Websites beschränkt. Mit derselben Bauweise – Rollen, versionierte Regeln, unabhängige Prüfschritte – werten wir offene LiDAR-Daten für die Archäologie aus. Wie das aussieht und wo es an Grenzen stößt, steht im Beitrag zum CAA-Vortrag Context Before Pixels.

Aktualisiert im September 2026: Zeit- und Kostenangaben der ersten Fassung („14 Tage“, „3.500 €“, Branchenstatistiken) entfernt, da nicht belegt. Als Beleg dient das PSA-Prüfprotokoll mit dokumentierten fünf Tagen.

Weiterlesen

Mehr aus dem Blog.

Alle Beiträge
  • 9 Min.

    Context Before Pixels: KI-Workflow für LiDAR

    Vortrag CAA 2026 Münster: Wie ein Multi-Agenten-Workflow offene LiDAR-Daten in geprüfte Kandidatenlisten für Archäologen verwandelt und sich selbst prüft.

    KI · Fernerkundung

  • 9 Min.

    KI-Website-Builder vs. Agentur: Der Vergleich

    Wix AI, Lovable, v0 by Vercel: KI-Website-Builder versprechen Websites in Minuten. Wann sie reichen – und wann eine Agentur die bessere Wahl ist.

    KI · Web & Software

Passt das zu Ihrem Vorhaben?

Erzählen Sie uns, woran Sie arbeiten. Im Erstgespräch sagen wir, wie wir es angehen würden.