Larry AI übernimmt hier die Rolle des UX/UI Agents: Er versteht dein Design System, findet Inkonsistenzen und baut neue Layouts aus einem Satz, statt aus einem Figma-File. Ob im Chat gegenüber der Landingpage oder direkt an der Section, dem Block oder dem Design-Token in Studio: Du beschreibst das Ziel, der Agent schlägt das Layout vor, du entscheidest, was live geht.
Responsive Anpassungen, WCAG-Konformität, Component-Auswahl, Design-Token-Konsistenz: alles läuft über dieselbe Rolle, mit denselben Freigabe-Regeln.
AGENTIC UI
Ein Agent, der dein Design System kennt.
Der UX/UI Agent ist kein generischer Layout-Generator. Er kennt deine definierten Sections, Blocks und Design-Tokens, und schlägt nur Layouts vor, die zu deinem System passen. Statt einzelner Stilvorschläge baut er ganze Abschnitte, geprüft gegen Barrierefreiheits- und Konsistenz-Regeln, bevor irgendetwas live geht.
Barrierefreiheit von Anfang an
Jeder Vorschlag wird gegen WCAG 2.1 AA geprüft, Kontraste, Fokus-Zustände, Touch-Targets, bevor du ihn siehst.
Responsive über alle Breakpoints
Der Agent denkt Layouts direkt für Desktop, Tablet und Mobile mit, nicht als nachträgliche Anpassung.
Nur Design-Tokens, keine Hardcodes
Farben, Abstände und Typografie kommen aus deiner Variablen-Library, nie als fester Wert im Code.
MULTI-BRAND & MULTI-THEME
Ein Token. Jedes Theme.
Ändere eine Farbe einmal, aktualisiere überall
Passe einen Design-Token an, und der UX/UI Agent schlägt die passenden Anpassungen für jedes konfigurierte Theme und jede Marke vor, unter Berücksichtigung von Kontrast-Anforderungen pro Variante. Du prüfst nebeneinander, gibst pro Theme frei, und nichts geht inkonsistent live.
Konsistente Komponenten über jede Storefront.
Eine Component-Library, die der Agent tatsächlich einhält
Component-Namen, Varianten und Pflichtfelder bleiben über alle Storefronts fix. Du definierst die Library einmal, der Agent wendet sie auf jeden Vorschlag an und markiert Components, bei denen er unsicher ist, statt zu raten.
FREIGABE-WORKFLOW
Jeder Layout-Vorschlag hat einen Status. Nichts passiert im Stillen.
Entwurf, geändert, live
Ob der Agent autonom arbeitet oder du ihm eine direkte Anweisung gibst, jede Änderung läuft durch dasselbe drei-stufige Status-Modell. Du siehst immer, was vorgeschlagen, was bereits angefasst und was tatsächlich live ist, und jeder Schritt bleibt in der Versionshistorie vollständig nachvollziehbar.
Entwurf
Der Agent hat ein Layout vorgeschlagen. Am Live-Auftritt wurde nichts verändert. Du siehst den Vorschlag Section für Section und entscheidest, ob er passt.
Geändert
Du hast den Vorschlag freigegeben oder selbst angepasst. Die Änderung ist bereit, wartet aber noch auf die Veröffentlichung, allein oder als Teil eines Batches.
Live
Veröffentlicht und auf dem Storefront sichtbar. Jede Live-Version bleibt mit der Version verknüpft, aus der sie entstanden ist, ein Rollback dauert Sekunden.
EINSATZBEREICHE
Jede Art von Layout, eine Rolle.
Der UX/UI Agent arbeitet überall dort, wo Layout in deinem Schema entsteht: Landingpages, Produktseiten, Kategorieseiten, wiederverwendbare Sections. Dieselbe Rolle, dasselbe Freigabe-Modell, überall.
Landingpages & Kampagnen
Baue eine komplette Kampagnenseite im Chat, Section für Section, und feinjustiere sie danach direkt im Abschnitt.
Produkt- & Kategorieseiten
Passe Layout-Varianten für PDP oder PLP an, ohne bestehende Query-Bindungen oder Daten-Anbindungen zu verlieren.
Wiederverwendbare Sections
Der Agent findet inkonsistent verwendete Sections über die gesamte Plattform und schlägt eine vereinheitlichte Variante vor.
AGENTIC UI MANAGEMENT
Was der UX/UI Agent konkret kann.
Sechs Fähigkeiten, eine durchgängige Rolle über dein gesamtes Design System.
Layout-Generierung
Beschreibe eine Section in natürlicher Sprache, der Agent baut sie aus definierten Blocks und Komponenten deines Systems.
Design-Token-Anpassungen
Ändere Farben, Abstände oder Typografie zentral, der Agent wendet die Anpassung konsistent auf jede betroffene Component an.
Accessibility-Audits
Der Agent prüft bestehende Seiten gegen WCAG 2.1 AA und schlägt konkrete Korrekturen vor, Kontrast, Fokus-Reihenfolge, Touch-Targets.
Responsive-Anpassungen
Layouts werden für jeden Breakpoint mitgedacht, keine nachträgliche Mobile-Korrektur nötig.
Component-Konsistenz-Checks
Der Agent findet abweichend genutzte oder veraltete Components über die gesamte Plattform und schlägt die Vereinheitlichung vor.
Layout-Varianten-Tests
Erzeuge alternative Layout-Varianten für dieselbe Section, um sie gegeneinander zu testen, ohne den Code-Pfad zu verändern.
KOSTENVERGLEICH
Was Layout-Pflege heute kostet, ohne Agent.
Figma-Handoffs, Entwickler-Tickets, manuelle QA-Runden für Barrierefreiheit: Die Zahlen unten sind illustrativ, aber die Richtung ist real.
Unterschiede vergleichen | Manuelle Layout-Pflege | Laioutr UX/UI Agent |
|---|---|---|
Was sich operativ verändert Drei typische Herausforderungen, die heute Zeit und Konsistenz kosten — und mit dem Laioutr UX/UI Agent zur Selbstverständlichkeit werden. Die Größenordnungen stammen aus echten Kunden-Setups, keine Marketing-Werte. | ||
Neue Layout-Varianten erstellen Section-Design als Unterhaltung statt Figma-Handoff-Runde. | Figma-Design, Entwickler-Handoff, Review-Schleifen, Tage bis Wochen pro Variante. | Layouts in Minuten aus definierten Components bauen, direkt im Schema, geprüft gegen Barrierefreiheit. |
Design-Token-Konsistenz über Storefronts Ein Token-Update als zentrale Anweisung statt Component für Component. | Jede Component einzeln anpassen, hohe Fehleranfälligkeit, Inkonsistenzen zwischen Storefronts. | Änderung einmal beschreiben, geprüft vor der Übernahme, konsistent über alle betroffenen Components. |
Accessibility-Audits ohne manuelle QA WCAG-Prüfung als selbstverständlicher Check statt Sonderprojekt. | Barrierefreiheit fällt erst auf, wenn sie gemeldet wird, oder gar nicht, externe Audits nötig. | Der Agent findet Kontrast- und Fokus-Probleme eigenständig und schlägt die Korrektur vor. |
VISION
Ein Agent. Viele Rollen. Larry AI.
Der UX/UI Agent ist kein separates Produkt, das an Laioutr angeflanscht wurde. Es ist eine Rolle, die Larry AI, die Plattform-KI von Laioutr, innerhalb derselben agentischen Frontend-Management-Ebene übernimmt, die auch Content, Merchandising und Personalisierung steuert. Dasselbe Vertrauensmodell, derselbe Audit-Trail, dieselbe Plattform, eine andere Aufgabe.
Je mehr Rollen Larry AI innerhalb der Plattform übernimmt, desto mehr verschwimmt die Grenze zwischen „Design-Arbeit" und „Plattform-Arbeit".
DESIGN-GUARDRAILS
Der Agent bleibt innerhalb der Grenzen, die du ziehst.
Design-Tokens, erlaubte Components, verbotene Muster, Barrierefreiheits-Mindeststandards: Du legst die Guardrails einmal fest. Der Agent schlägt innerhalb davon vor und markiert alles, bei dem er sich nicht sicher ist, statt zu raten.
Du steuerst
- Design-Tokens, erlaubte Components und Varianten
- Welche Sections und Felder der Agent anfassen darf
- Freigabe-Schritte und wer sie erteilt
- Barrierefreiheits-Mindeststandards
Der UX/UI Agent liefert
- Vorschläge, die bereits zu deinem Design System passen
- Einen vollständigen Diff, den du vor jedem Go-Live prüfst
- Markierungen bei allem Unsicheren statt stiller Annahmen
- Eine vollständige, rückführbare Historie jeder Änderung
ZUSÄTZLICHE FUNKTIONEN
Gebaut für Teams, die täglich Layouts ausliefern.
Fünf weitere Dinge, die der UX/UI Agent leise im Hintergrund erledigt.
Geplante Layout-Updates
Saisonale Kampagnen-Layouts oder wiederkehrende Section-Anpassungen laufen nach einem Zeitplan, den du einmal festlegst.
Vollständige Versionshistorie
Jede Agent-Änderung ist versioniert und rückführbar, gleichwertig zu jeder manuellen Anpassung in Studio.
Rollenbasierte Berechtigungen
Lege fest, welche Teams und Nutzer:innen den Agenten steuern dürfen, und welche Sections er niemals anfassen darf.
Cross-Storefront-Rollout
Spiele ein freigegebenes Layout auf ausgewählte Storefronts oder Themes aus, oder halte es pro Marke zurück.
API-Zugriff
Löse Layout-Operationen aus deinen eigenen Tools und Pipelines aus, nicht nur aus dem Chat oder Studio.
COMPOSABILITY
Ein Agent, drei Zugänge.
Chat, Studio oder API, deine Wahl
Dieselbe UX/UI-Agent-Rolle ist erreichbar, egal wie dein Team arbeitet: im Gespräch gegenüber einer Landingpage, direkt im Studio-Schema Section für Section, oder programmatisch über die API. Dieselben Regeln, dasselbe Freigabe-Modell, unabhängig vom Einstiegspunkt.
Per Chat
Beschreibe das gewünschte Layout gegenüber der Seite, die du dir ansiehst. Der Agent schlägt es Section für Section vor.
Direkt in Studio
Löse den Agenten direkt am Schema, dem Block oder dem Design-Token aus, den du gerade bearbeitest, ohne Kontextwechsel.
Per API
Löse Layout-Operationen aus deinen eigenen Systemen und Pipelines aus, mit demselben Freigabe-Modell dahinter.
„Baut das an unserem Design vorbei?"
Nein, wenn du dein Design System und die Guardrails eingerichtet hast. Der Agent schlägt innerhalb davon vor und markiert alles Unsichere, statt zu raten.
„Kann er ohne Freigabe live gehen?"
Nur, wenn du es zulässt. Freigabe-Schritte sind pro Section, pro Feld oder pro Team konfigurierbar, von voller Autonomie bis strikter manueller Freigabe.
„Was, wenn er etwas zerstört?"
Er kann keine Sections anfassen, auf die er keinen Zugriff hat, und jede Änderung ist versioniert. Ein Rollback dauert Sekunden, wenn etwas nicht passt.
„Brauchen wir dafür Figma?"
Nein. Der Agent arbeitet direkt auf den strukturierten Sections und Blocks in deinem Schema, unabhängig davon, ob Figma parallel genutzt wird.
FAQ
Häufig gefragt.
Strategie-Gespräch
Bereit, Dein Frontend zur Steuerebene zu machen?
Zeig uns Deinen Stack, Deine Roadmap, Dein Replatforming-Szenario, wir zeigen Dir, wie Laioutr passt, was es kostet und wie schnell ihr live geht.
"Nach 30 Minuten wussten wir, dass Laioutr unser Replatforming machbar macht." - Daniel B., CEO, hygibox.de