StefanMoCoAt
5c7ba28b1e
Some checks are pending
Desktop CI — Headless Tests & Build / Compose Desktop — Tests (headless) & Build (push) Waiting to run
Build and Publish Docker Images / build-and-push (., backend/infrastructure/gateway/Dockerfile, api-gateway, api-gateway) (push) Waiting to run
Build and Publish Docker Images / build-and-push (., backend/services/ping/Dockerfile, ping-service, ping-service) (push) Waiting to run
Build and Publish Docker Images / build-and-push (., config/docker/caddy/web-app/Dockerfile, web-app, web-app) (push) Waiting to run
Build and Publish Docker Images / build-and-push (., config/docker/keycloak/Dockerfile, keycloak, keycloak) (push) Waiting to run
6.0 KiB
6.0 KiB
🖌️ [UI/UX Designer] — Zwischenstand & Roadmap
Stand: 12. April 2026 Rolle: High-Density Design, Wireframes, Usability, Design-System, Empty States
Sprint D — AKTUELL (12. April 2026)
- D-1 | Radikaler UI-Umbau der Desktop-Shell (Best Practices)
- Einführung einer modernen Seiten-Navigation (
NavigationRail) zur besseren Platzausnutzung - Umstellung von Top-Bar auf schlanken Page-Header mit Breadcrumbs im Content-Bereich
- Erweiterung des Design-Systems um
NavigationSurfaceund konsistenteElevatedCards - Refactoring
AdminUebersichtScreen: Klare visuelle Hierarchie, Page-Title und modernisierte Cards - Konsistente Anwendung von Tonal Elevation und Material 3 Standards
- Einführung einer modernen Seiten-Navigation (
Sprint C — Abgeschlossen
- A-1 | Design-Inventur: Bestehende V3-Screens analysiert
- Alle vorhandenen V3-Screens katalogisiert (Screenshots in
docs/06_Frontend/Screenshots/) - Inkonsistenzen in Spacing, Typografie und Farbgebung identifiziert
- Offene UX-Probleme und fehlende Empty States dokumentiert
- Issue-Liste für Sprint B vorbereitet
- Alle vorhandenen V3-Screens katalogisiert (Screenshots in
Sprint B (Teilweise) — Wireframes erstellt
-
B-1 Wireframes | Editier-Formulare (AlertDialog vs. dedizierter Screen)
- Entscheidungsgrundlage erarbeitet: Wann AlertDialog, wann Fullscreen-Edit?
- Wireframes für beide Varianten erstellt (Reiter-Edit, Pferd-Edit als Beispiele)
- Ergebnis:
docs/06_Frontend/Guidelines/Editier-Formulare_Dialog-vs-Fullscreen_v1.md - Finale Entscheidung dokumentiert und als verbindliche Design-Richtlinie festgeschrieben (Status: APPROVED)
- Mapping aller bestehenden Edit-Screens auf AlertDialog / Side Sheet / Fullscreen dokumentiert
-
B-2 Wireframes | Bewerb anlegen mit Abteilungs-Logik
- Dialog-Flow: Bewerb-Grunddaten → Abteilungs-Vorschlag → Bestätigung
- CSN-C-NEU Pflicht-Teilung: Visuelle Darstellung der automatischen Vorschläge
- Abteilungs-Typ-Auswahl:
SEPARATE_SIEGEREHRUNGvs.ORGANISATORISCHverständlich gestaltet - Ergebnis:
docs/06_Frontend/Wireframes/Bewerb_anlegen_Abteilungs-Logik_v1.md
-
B-3 Wireframes | Veranstaltungs-Kassa
- Gesamt-Saldo-Ansicht: Teilnehmer mit offenen Beträgen aus mehreren Turnieren
- Zahlvorgang-Dialog: Eine Zahlung, Aufteilung auf Turniere sichtbar
- Rechnungsvorschau: Zwei separate Rechnungen je Turnier als Tab
- Ergebnis:
docs/06_Frontend/Wireframes/Kassa_Veranstaltung_v1.md
✅ Sprint B — Abgeschlossen (3. April 2026)
-
B-1 Abschluss | Finale Design-Entscheidung Editier-Formulare
- Review durch 🎨 Frontend Expert durchgeführt (bestätigt durch bestehende Implementierungen)
- Entscheidung (AlertDialog / Side Sheet / Fullscreen) als verbindliche Richtlinie dokumentiert
- Ergebnis:
docs/06_Frontend/Guidelines/Editier-Formulare_Dialog-vs-Fullscreen_v1.md(Status: APPROVED)
-
B-4 | Empty States für alle Listenansichten
- Liste aller Screens mit möglichen leeren Zuständen erstellt (10 Screens, 3 Typen)
- Icon-Konzept: Material Symbols Outlined — kein Custom-Illustration-Set für MVP
- Texte (Titel, Beschreibung, CTA) für alle Screens und alle Typen definiert
- Composable-API
MsEmptyStatespezifiziert (Ablageort, Parameter, Verhalten, Beispiel) - Ergebnis:
docs/06_Frontend/Guidelines/Empty-States_Spezifikation_v1.md(Status: APPROVED)
🟠 Sprint C — Priorität 2 (nächste Woche)
-
C-1 | Wireframes aus Sprint B in Compose umsetzen
- Editier-Dialog / Fullscreen-Edit gemäß finaler Entscheidung (B-1) — Richtlinie: APPROVED ✅
- Bewerb-Anlegen-Dialog mit Abteilungs-Logik (B-2)
- Kassa-Screen (B-3)
MsEmptyState-Composable implementieren (Spezifikation:docs/06_Frontend/Guidelines/Empty-States_Spezifikation_v1.md)- Empty States in alle 10 Listenansichten integrieren (Prioritätsreihenfolge laut Spezifikation)
PferdProfilEditDialogzu Fullscreen-Edit migrieren (> 8 Felder, Async-Lookups — laut B-1 Mapping)
-
C-2 | Design-System konsolidieren ✅ 12. April 2026
- Farb-Palette in
MaterialTheme/Theme.ktvereinheitlichen (Tonal Elevation) - Typografie-Skala und Spacings in
Dimens.kt/Typography.ktdefiniert - Eingabefelder (MsTextField) auf Enterprise-Standard (44.dp) optimiert
- Farb-Palette in
-
C-3 | Abteilungs-Ansicht: Startliste und Ergebnisliste
- Wireframe: Startliste einer Abteilung (Startnummer, Reiter, Pferd, Verein)
- Wireframe: Ergebnisliste einer Abteilung (Platz, Reiter, Pferd, Ergebnis)
- Wireframe: Ranglisten-Zusammenführung bei
ORGANISATORISCH
⏸️ Web-App / PWA Design — Nach Desktop-MVP; Anforderungen noch nicht definiert
📌 Abhängigkeiten
| Warte auf | Von wem | Betrifft |
|---|---|---|
| Domänen-Modell (Kassa, Abteilung) ✅ | 🏗️ Architect | B-3 Kassa-Wireframes ✅ |
| ViewModel-Struktur ✅ | 🎨 Frontend | B-1 Finale Entscheidung ✅ |
| Meine Richtlinie B-1 ✅ | 🎨 Frontend | C-1 Edit-Dialoge implementieren |
| Meine Spezifikation B-4 ✅ | 🎨 Frontend | C-1 MsEmptyState implementieren |
| Meine Wireframes (B-2, B-3) | 🎨 Frontend | C-1 Bewerb-Dialog, Kassa-Screen |
💡 Empfehlungen (nach Priorität)
- C-1
MsEmptyStateimplementieren — Spezifikation liegt vor (APPROVED); Frontend kann sofort mit der Composable-Implementierung beginnen. Alle 10 Listenansichten laut Prioritätsliste abarbeiten. - C-1
PferdProfilEditDialog→ Fullscreen migrieren — Aktueller Dialog überschreitet die Komplexitätsgrenze (> 8 Felder, Async-Lookups); Migration gemäß B-1-Richtlinie für Sprint C-1 vorgesehen. - C-2 Design-System — Frühzeitige Konsolidierung verhindert kostspielige Nacharbeit; am besten parallel zu C-1 erledigen.