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
109 lines
6.0 KiB
Markdown
109 lines
6.0 KiB
Markdown
# 🖌️ [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)
|
|
|
|
- [x] **D-1** | Radikaler UI-Umbau der Desktop-Shell (Best Practices)
|
|
- [x] Einführung einer modernen Seiten-Navigation (`NavigationRail`) zur besseren Platzausnutzung
|
|
- [x] Umstellung von Top-Bar auf schlanken Page-Header mit Breadcrumbs im Content-Bereich
|
|
- [x] Erweiterung des Design-Systems um `NavigationSurface` und konsistente `ElevatedCards`
|
|
- [x] Refactoring `AdminUebersichtScreen`: Klare visuelle Hierarchie, Page-Title und modernisierte Cards
|
|
- [x] Konsistente Anwendung von Tonal Elevation und Material 3 Standards
|
|
|
|
### Sprint C — Abgeschlossen
|
|
|
|
- [x] **A-1** | Design-Inventur: Bestehende V3-Screens analysiert
|
|
- [x] Alle vorhandenen V3-Screens katalogisiert (Screenshots in `docs/06_Frontend/Screenshots/`)
|
|
- [x] Inkonsistenzen in Spacing, Typografie und Farbgebung identifiziert
|
|
- [x] Offene UX-Probleme und fehlende Empty States dokumentiert
|
|
- [x] Issue-Liste für Sprint B vorbereitet
|
|
|
|
### Sprint B (Teilweise) — Wireframes erstellt
|
|
|
|
- [x] **B-1 Wireframes** | Editier-Formulare (AlertDialog vs. dedizierter Screen)
|
|
- [x] Entscheidungsgrundlage erarbeitet: Wann AlertDialog, wann Fullscreen-Edit?
|
|
- [x] Wireframes für beide Varianten erstellt (Reiter-Edit, Pferd-Edit als Beispiele)
|
|
- [x] Ergebnis: `docs/06_Frontend/Guidelines/Editier-Formulare_Dialog-vs-Fullscreen_v1.md`
|
|
- [x] **Finale Entscheidung dokumentiert und als verbindliche Design-Richtlinie festgeschrieben** (Status: APPROVED)
|
|
- [x] Mapping aller bestehenden Edit-Screens auf AlertDialog / Side Sheet / Fullscreen dokumentiert
|
|
|
|
- [x] **B-2 Wireframes** | Bewerb anlegen mit Abteilungs-Logik
|
|
- [x] Dialog-Flow: Bewerb-Grunddaten → Abteilungs-Vorschlag → Bestätigung
|
|
- [x] CSN-C-NEU Pflicht-Teilung: Visuelle Darstellung der automatischen Vorschläge
|
|
- [x] Abteilungs-Typ-Auswahl: `SEPARATE_SIEGEREHRUNG` vs. `ORGANISATORISCH` verständlich gestaltet
|
|
- [x] Ergebnis: `docs/06_Frontend/Wireframes/Bewerb_anlegen_Abteilungs-Logik_v1.md`
|
|
|
|
- [x] **B-3 Wireframes** | Veranstaltungs-Kassa
|
|
- [x] Gesamt-Saldo-Ansicht: Teilnehmer mit offenen Beträgen aus mehreren Turnieren
|
|
- [x] Zahlvorgang-Dialog: Eine Zahlung, Aufteilung auf Turniere sichtbar
|
|
- [x] Rechnungsvorschau: Zwei separate Rechnungen je Turnier als Tab
|
|
- [x] Ergebnis: `docs/06_Frontend/Wireframes/Kassa_Veranstaltung_v1.md`
|
|
|
|
---
|
|
|
|
## ✅ Sprint B — Abgeschlossen (3. April 2026)
|
|
|
|
- [x] **B-1 Abschluss** | Finale Design-Entscheidung Editier-Formulare
|
|
- [x] Review durch 🎨 Frontend Expert durchgeführt (bestätigt durch bestehende Implementierungen)
|
|
- [x] Entscheidung (AlertDialog / Side Sheet / Fullscreen) als verbindliche Richtlinie dokumentiert
|
|
- [x] Ergebnis: `docs/06_Frontend/Guidelines/Editier-Formulare_Dialog-vs-Fullscreen_v1.md` (Status: APPROVED)
|
|
|
|
- [x] **B-4** | Empty States für alle Listenansichten
|
|
- [x] Liste aller Screens mit möglichen leeren Zuständen erstellt (10 Screens, 3 Typen)
|
|
- [x] Icon-Konzept: Material Symbols Outlined — kein Custom-Illustration-Set für MVP
|
|
- [x] Texte (Titel, Beschreibung, CTA) für alle Screens und alle Typen definiert
|
|
- [x] Composable-API `MsEmptyState` spezifiziert (Ablageort, Parameter, Verhalten, Beispiel)
|
|
- [x] 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)
|
|
- [ ] `PferdProfilEditDialog` zu Fullscreen-Edit migrieren (> 8 Felder, Async-Lookups — laut B-1 Mapping)
|
|
|
|
- [x] **C-2** | Design-System konsolidieren ✅ *12. April 2026*
|
|
- [x] Farb-Palette in `MaterialTheme` / `Theme.kt` vereinheitlichen (Tonal Elevation)
|
|
- [x] Typografie-Skala und Spacings in `Dimens.kt` / `Typography.kt` definiert
|
|
- [x] Eingabefelder (MsTextField) auf Enterprise-Standard (44.dp) optimiert
|
|
|
|
- [ ] **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)
|
|
|
|
1. **C-1 `MsEmptyState` implementieren** — Spezifikation liegt vor (APPROVED); Frontend kann sofort mit der
|
|
Composable-Implementierung beginnen. Alle 10 Listenansichten laut Prioritätsliste abarbeiten.
|
|
2. **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.
|
|
3. **C-2 Design-System** — Frühzeitige Konsolidierung verhindert kostspielige Nacharbeit; am besten parallel zu C-1
|
|
erledigen.
|