KOMO · Expert Review

UX Feedback & UI-Politur

Handoff UX-Analyse Analyse aller 123 Threads nach Schweregrad und Nielsen-Heuristiken — Fehlerbehandlung, Konsistenz, Fachjargon und Barrierefreiheit als Kernrisiken. Öffnen Handoff Konsistente Patterns Wiederverwendbare Muster für die Entwicklung — u. a. Leerzustand, Layout-Hülle, Formular-Fehlermeldungen, Links vs. Buttons und Beschriftung vor Icon. Öffnen

UI Polish

Konsistentes Layout mit definierter Maximalbreite, lesbare Schriftgrößen, dunkle Textfarben und Grün ausschließlich für interaktive Elemente. Umgesetzt als reines HTML5 + CSS-Variablen (APEX-tauglich).

Handoff Design-Tokens Farben, Typografie, Abstände (8-pt), Radius und Layout-Maße — als CSS-Variablen in css/komo.css. Grundlage aller Ansichten. Öffnen

Seiten und UI Beispiele

Ansicht 00 Startseite Portal-Landingpage — Schnellzugriffs-Kacheln, KOMO News und Kurzlinks zu Verwaltungsbereichen. Öffnen Ansicht 01 Übersicht einer Einrichtung Landing nach Auswahl der Einrichtung — Stammdaten-Kopf, Periode, Warnhinweis, Antragsstatistik und Verwaltungskacheln. Öffnen Ansicht 02 Stammdaten bearbeiten Formular mit Reiter-Navigation — Basisdaten, Status/Zeitangaben, Förderdaten und Adresse. Öffnen Ansicht 03 Personal verwalten Personallisten nach Kategorie — Tabellen mit Suchleiste, Statusicons, Leerzustand und Paginierung. Öffnen Ansicht 04 Förderungsantrag Antragsformular — Validierungshinweise, Förderdaten-Checkliste, Leitungsfragen, Upload und Personalübersicht. Öffnen Ansicht 05 Gruppe bearbeiten Gruppen-Detail mit Reiter-Navigation — Grunddaten, Betriebsdaten, Personal, Kinder, Ferien, Personaleinsatz, Stilllegungen und zwei Dialogen (Modals). Öffnen Ansicht 06 Person erfassen Mehrschritt-Assistent (Wizard) — Person hinzufügen, Befähigung bzw. Ausnahmebewilligung wählen und Tätigkeit festlegen, mit Fortschrittsanzeige und Pflichtfeldprüfung. Öffnen Ansicht 07 Kinder verwalten Übersichtsliste — Kinder-Tabelle mit rechtsbündigem Alter, Warnhinweis zur Altersspanne direkt in der Zeile, Suche und Leerzustand. Öffnen Ansicht 08 Kinderdaten bearbeiten Detailansicht mit Reiter-Navigation — persönliche Daten, Betreuungszeiten und Förderdaten, Warnbanner sowie Bearbeiten-Dialog (Modal). Öffnen Ansicht 09 Kind erfassen Mehrschritt-Assistent (Wizard) — persönliche Daten, Betreuungszeiten und Förderdaten in drei Schritten, mit Fortschrittsanzeige und Pflichtfeldprüfung. Öffnen

Architektur & APEX-Machbarkeit

Kann das Frontend von APEX entkoppelt und APEX nur als Headless-API-Backend genutzt werden? Entscheidungsvorlage für Stakeholder — inkl. Alternative „Custom-Theme in APEX".

Prototyp

KOMO POC — funktionale Anwendung

Die Ansichten oben zeigen das UI-Redesign. Hier geht es zur interaktiven POC-Anwendung (Next.js) mit Login, Navigation und durchklickbaren Abläufen.

POC-Anwendung öffnen

Interaktiver Klick-Prototyp der funktionalen Anwendung.