chore: suppress markdownlint warnings in spec docs
Build & Deploy Tippspiel / build (push) Successful in 40s
Build & Deploy Tippspiel / build (push) Successful in 40s
This commit is contained in:
@@ -0,0 +1 @@
|
|||||||
|
docs/superpowers/**
|
||||||
@@ -1,3 +1,4 @@
|
|||||||
|
<!-- markdownlint-disable -->
|
||||||
# Phase 1: Engagement & UX-Polish — Design Spec
|
# Phase 1: Engagement & UX-Polish — Design Spec
|
||||||
|
|
||||||
**Datum:** 2026-04-11
|
**Datum:** 2026-04-11
|
||||||
@@ -15,22 +16,29 @@ Die aktuelle Startseite zeigt 104 Spiele als endlose Liste. Die neue Startseite
|
|||||||
### Layout: "Hero + Stats + Nudges"
|
### Layout: "Hero + Stats + Nudges"
|
||||||
|
|
||||||
**Hero-Bereich (oberes Drittel):**
|
**Hero-Bereich (oberes Drittel):**
|
||||||
|
|
||||||
- Nächstes tippbares Spiel prominent angezeigt mit Team-Flaggen und Countdown-Timer
|
- Nächstes tippbares Spiel prominent angezeigt mit Team-Flaggen und Countdown-Timer
|
||||||
|
|
||||||
- Wenn bereits getippt: Tipp anzeigen mit Häkchen ("Dein Tipp: 2:1 ✓")
|
- Wenn bereits getippt: Tipp anzeigen mit Häkchen ("Dein Tipp: 2:1 ✓")
|
||||||
|
|
||||||
- Wenn noch nicht getippt: "Jetzt tippen"-Button
|
- Wenn noch nicht getippt: "Jetzt tippen"-Button
|
||||||
|
|
||||||
- Wenn kein Spiel ansteht: Nächstes Spiel mit Datum ("Nächstes Spiel: Morgen 21:00")
|
- Wenn kein Spiel ansteht: Nächstes Spiel mit Datum ("Nächstes Spiel: Morgen 21:00")
|
||||||
|
|
||||||
**Stats-Kacheln (mittleres Drittel):**
|
**Stats-Kacheln (mittleres Drittel):**
|
||||||
|
|
||||||
- Drei kompakte Kacheln nebeneinander:
|
- Drei kompakte Kacheln nebeneinander:
|
||||||
- **Dein Rang** (Platzierung mit Pfeil hoch/runter seit letzter Änderung)
|
- **Dein Rang** (Platzierung mit Pfeil hoch/runter seit letzter Änderung)
|
||||||
- **Punkte** (Gesamtpunktzahl)
|
- **Punkte** (Gesamtpunktzahl)
|
||||||
- **Streak** (🔥-Counter, aktuelle Serie an abgegebenen Tipps)
|
- **Streak** (🔥-Counter, aktuelle Serie an abgegebenen Tipps)
|
||||||
|
|
||||||
**Nudge-Bereich (unteres Drittel):**
|
**Nudge-Bereich (unteres Drittel):**
|
||||||
|
|
||||||
- Kontextabhängige Handlungsaufforderungen:
|
- Kontextabhängige Handlungsaufforderungen:
|
||||||
- "📅 Heute noch 2 Spiele ohne Tipp" → Link zum Spielplan
|
- "📅 Heute noch 2 Spiele ohne Tipp" → Link zum Spielplan
|
||||||
- "🏆 Max führt mit 15 Punkten" → Link zur Rangliste
|
- "🏆 Max führt mit 15 Punkten" → Link zur Rangliste
|
||||||
- "🎯 Letzte Auswertung: 3 Punkte für Brazil vs Serbia!" → Link zum Ergebnis
|
- "🎯 Letzte Auswertung: 3 Punkte für Brazil vs Serbia!" → Link zum Ergebnis
|
||||||
|
|
||||||
- Maximal 2-3 Nudges, priorisiert nach Relevanz
|
- Maximal 2-3 Nudges, priorisiert nach Relevanz
|
||||||
|
|
||||||
**Navigationsänderung:** Der volle Spielplan wird zur eigenen Seite "Spiele" in der Navigation. Dashboard ist die neue Startseite.
|
**Navigationsänderung:** Der volle Spielplan wird zur eigenen Seite "Spiele" in der Navigation. Dashboard ist die neue Startseite.
|
||||||
@@ -42,9 +50,13 @@ Die aktuelle Startseite zeigt 104 Spiele als endlose Liste. Die neue Startseite
|
|||||||
Die Header-Navigation wird durch eine feste Bottom Navigation ersetzt (Mobile-First-Standard).
|
Die Header-Navigation wird durch eine feste Bottom Navigation ersetzt (Mobile-First-Standard).
|
||||||
|
|
||||||
**4 Haupttabs:**
|
**4 Haupttabs:**
|
||||||
|
|
||||||
- 🏠 **Home** — Dashboard (neue Startseite)
|
- 🏠 **Home** — Dashboard (neue Startseite)
|
||||||
|
|
||||||
- ⚽ **Spiele** — Spielplan mit Smart Sections
|
- ⚽ **Spiele** — Spielplan mit Smart Sections
|
||||||
|
|
||||||
- 🏆 **Rangliste** — Leaderboard
|
- 🏆 **Rangliste** — Leaderboard
|
||||||
|
|
||||||
- 👤 **Profil** — Persönliche Statistiken
|
- 👤 **Profil** — Persönliche Statistiken
|
||||||
|
|
||||||
**Header:** Wird schlank — nur Logo ("WM 2026 Tippspiel"), optional Notification-Badge, Theme-Toggle.
|
**Header:** Wird schlank — nur Logo ("WM 2026 Tippspiel"), optional Notification-Badge, Theme-Toggle.
|
||||||
@@ -70,9 +82,13 @@ Die 104-Spiele-Liste wird intelligent in Zeitabschnitte gruppiert.
|
|||||||
| **Vergangene Spiele** | Kollapsiert | Letzte Ergebnisse + eigene Punkte |
|
| **Vergangene Spiele** | Kollapsiert | Letzte Ergebnisse + eigene Punkte |
|
||||||
|
|
||||||
**Verhalten:**
|
**Verhalten:**
|
||||||
|
|
||||||
- Abschnitte sind auf-/zuklappbar (Accordion)
|
- Abschnitte sind auf-/zuklappbar (Accordion)
|
||||||
|
|
||||||
- "Heute" scrollt automatisch in den Viewport beim Öffnen
|
- "Heute" scrollt automatisch in den Viewport beim Öffnen
|
||||||
|
|
||||||
- Leerer Abschnitt wird ausgeblendet (z.B. "Heute" wenn kein Spiel)
|
- Leerer Abschnitt wird ausgeblendet (z.B. "Heute" wenn kein Spiel)
|
||||||
|
|
||||||
- Stage-Filter (Gruppenphase, Achtelfinale...) wird zum optionalen Dropdown statt Button-Leiste
|
- Stage-Filter (Gruppenphase, Achtelfinale...) wird zum optionalen Dropdown statt Button-Leiste
|
||||||
|
|
||||||
---
|
---
|
||||||
@@ -84,33 +100,50 @@ Jede Match-Card sieht visuell anders aus je nach Spielstatus. Die aktuellen Card
|
|||||||
**5 visuelle Zustände:**
|
**5 visuelle Zustände:**
|
||||||
|
|
||||||
### ⏳ Offen (tippbar)
|
### ⏳ Offen (tippbar)
|
||||||
|
|
||||||
- Standard-Design mit Team-Flaggen und Kick-off-Zeit
|
- Standard-Design mit Team-Flaggen und Kick-off-Zeit
|
||||||
|
|
||||||
- "Tipp abgeben"-Button prominent
|
- "Tipp abgeben"-Button prominent
|
||||||
|
|
||||||
- Countdown wenn <24h bis Anpfiff
|
- Countdown wenn <24h bis Anpfiff
|
||||||
|
|
||||||
- Pulsierender roter Countdown wenn <1h
|
- Pulsierender roter Countdown wenn <1h
|
||||||
|
|
||||||
### ✅ Getippt
|
### ✅ Getippt
|
||||||
|
|
||||||
- Grüner linker Rand / Akzent
|
- Grüner linker Rand / Akzent
|
||||||
|
|
||||||
- Tipp prominent angezeigt ("Dein Tipp: 2:1")
|
- Tipp prominent angezeigt ("Dein Tipp: 2:1")
|
||||||
|
|
||||||
- "Ändern"-Link statt "Tipp abgeben"
|
- "Ändern"-Link statt "Tipp abgeben"
|
||||||
|
|
||||||
- Häkchen-Icon
|
- Häkchen-Icon
|
||||||
|
|
||||||
### 🔴 Live (in Spielgang)
|
### 🔴 Live (in Spielgang)
|
||||||
|
|
||||||
- Pulsierender roter Punkt neben "LIVE"
|
- Pulsierender roter Punkt neben "LIVE"
|
||||||
|
|
||||||
- Aktueller Spielstand (wenn über Sync verfügbar)
|
- Aktueller Spielstand (wenn über Sync verfügbar)
|
||||||
|
|
||||||
- Tipp daneben zum Vergleich
|
- Tipp daneben zum Vergleich
|
||||||
|
|
||||||
- Tippfenster geschlossen — Schloss-Icon
|
- Tippfenster geschlossen — Schloss-Icon
|
||||||
|
|
||||||
### 🏁 Beendet (ausgewertet)
|
### 🏁 Beendet (ausgewertet)
|
||||||
|
|
||||||
- Endergebnis prominent
|
- Endergebnis prominent
|
||||||
|
|
||||||
- Dein Tipp + Punkte-Badge:
|
- Dein Tipp + Punkte-Badge:
|
||||||
- 🥇 **Gold-Badge (3 Pkt):** Exakter Treffer, goldener Schimmer-Effekt
|
- 🥇 **Gold-Badge (3 Pkt):** Exakter Treffer, goldener Schimmer-Effekt
|
||||||
- ✅ **Grüner Badge (1 Pkt):** Richtige Tendenz
|
- ✅ **Grüner Badge (1 Pkt):** Richtige Tendenz
|
||||||
- ❌ **Grauer Badge (0 Pkt):** Falsch getippt
|
- ❌ **Grauer Badge (0 Pkt):** Falsch getippt
|
||||||
|
|
||||||
### 🔒 Verpasst (nicht getippt, Spiel vorbei)
|
### 🔒 Verpasst (nicht getippt, Spiel vorbei)
|
||||||
|
|
||||||
- Ausgegraut / reduzierte Opacity
|
- Ausgegraut / reduzierte Opacity
|
||||||
|
|
||||||
- "Nicht getippt" Label
|
- "Nicht getippt" Label
|
||||||
|
|
||||||
- Leichter visueller "Shame-Effekt" als Motivation fürs nächste Mal
|
- Leichter visueller "Shame-Effekt" als Motivation fürs nächste Mal
|
||||||
|
|
||||||
---
|
---
|
||||||
@@ -120,49 +153,70 @@ Jede Match-Card sieht visuell anders aus je nach Spielstatus. Die aktuellen Card
|
|||||||
5 Schlüsselmomente, die die App lebendig machen.
|
5 Schlüsselmomente, die die App lebendig machen.
|
||||||
|
|
||||||
### 5.1 Tipp-Bestätigung
|
### 5.1 Tipp-Bestätigung
|
||||||
|
|
||||||
- **Trigger:** User klickt "Tipp bestätigen"
|
- **Trigger:** User klickt "Tipp bestätigen"
|
||||||
|
|
||||||
- **Animation:** Card pulsiert kurz grün, animiertes Häkchen fliegt rein
|
- **Animation:** Card pulsiert kurz grün, animiertes Häkchen fliegt rein
|
||||||
|
|
||||||
- **Text:** "Dein Tipp ist drin! 🎯" als kurze Success-Message
|
- **Text:** "Dein Tipp ist drin! 🎯" als kurze Success-Message
|
||||||
|
|
||||||
- **Mobile:** Subtiles Haptic-Feedback (Vibration via `navigator.vibrate`)
|
- **Mobile:** Subtiles Haptic-Feedback (Vibration via `navigator.vibrate`)
|
||||||
|
|
||||||
- **Dauer:** ~1 Sekunde, dann Modal schließt
|
- **Dauer:** ~1 Sekunde, dann Modal schließt
|
||||||
|
|
||||||
### 5.2 Live-Countdown vor Anpfiff
|
### 5.2 Live-Countdown vor Anpfiff
|
||||||
|
|
||||||
- **Trigger:** Spiel startet in <1 Stunde
|
- **Trigger:** Spiel startet in <1 Stunde
|
||||||
|
|
||||||
- **Anzeige:** Pulsierender roter Countdown-Timer auf der Match-Card ("Noch 12 Min!")
|
- **Anzeige:** Pulsierender roter Countdown-Timer auf der Match-Card ("Noch 12 Min!")
|
||||||
|
|
||||||
- **Urgency-Stufen:**
|
- **Urgency-Stufen:**
|
||||||
- <24h: Countdown in Stunden ("in 5h")
|
- <24h: Countdown in Stunden ("in 5h")
|
||||||
- <1h: Pulsierender roter Countdown in Minuten
|
- <1h: Pulsierender roter Countdown in Minuten
|
||||||
- <5min: Schnelleres Pulsieren
|
- <5min: Schnelleres Pulsieren
|
||||||
|
|
||||||
- **Nach Anpfiff:** "Tippfenster geschlossen" mit Schloss-Icon, sanfte Transition
|
- **Nach Anpfiff:** "Tippfenster geschlossen" mit Schloss-Icon, sanfte Transition
|
||||||
|
|
||||||
### 5.3 Punkte-Reveal nach Spielende
|
### 5.3 Punkte-Reveal nach Spielende
|
||||||
|
|
||||||
- **Trigger:** User öffnet App / navigiert zu einem ausgewerteten Spiel, das noch nicht "gesehen" wurde
|
- **Trigger:** User öffnet App / navigiert zu einem ausgewerteten Spiel, das noch nicht "gesehen" wurde
|
||||||
|
|
||||||
- **Sequenz (gestaffelt, ~2-3 Sekunden):**
|
- **Sequenz (gestaffelt, ~2-3 Sekunden):**
|
||||||
1. Endergebnis einblenden (z.B. "Brazil 3:1 Serbia")
|
1. Endergebnis einblenden (z.B. "Brazil 3:1 Serbia")
|
||||||
2. "Dein Tipp war: 3:1" einblenden
|
2. "Dein Tipp war: 3:1" einblenden
|
||||||
3. Punkte-Counter animiert hochzählen
|
3. Punkte-Counter animiert hochzählen
|
||||||
|
|
||||||
- **Varianten nach Ergebnis:**
|
- **Varianten nach Ergebnis:**
|
||||||
- **Exakt (3 Pkt):** 🎉 Konfetti-Explosion, goldener "EXAKT!"-Badge, Celebratory-Puls
|
- **Exakt (3 Pkt):** 🎉 Konfetti-Explosion, goldener "EXAKT!"-Badge, Celebratory-Puls
|
||||||
- **Tendenz (1 Pkt):** 👏 Grüner Puls-Effekt, "Richtige Tendenz!"
|
- **Tendenz (1 Pkt):** 👏 Grüner Puls-Effekt, "Richtige Tendenz!"
|
||||||
- **Falsch (0 Pkt):** 😅 Kurzes Kopfschütteln-Emoji, "Knapp daneben..."
|
- **Falsch (0 Pkt):** 😅 Kurzes Kopfschütteln-Emoji, "Knapp daneben..."
|
||||||
|
|
||||||
- **"Gesehen"-Flag:** Jeder Reveal wird nur einmal gezeigt (localStorage-basiert)
|
- **"Gesehen"-Flag:** Jeder Reveal wird nur einmal gezeigt (localStorage-basiert)
|
||||||
|
|
||||||
### 5.4 Ranglistenveränderung
|
### 5.4 Ranglistenveränderung
|
||||||
|
|
||||||
- **Trigger:** Rang hat sich seit letztem Besuch geändert
|
- **Trigger:** Rang hat sich seit letztem Besuch geändert
|
||||||
|
|
||||||
- **Anzeige:** Toast-Notification beim App-Öffnen:
|
- **Anzeige:** Toast-Notification beim App-Öffnen:
|
||||||
- Aufstieg: "⬆️ Du bist auf Platz 3 aufgestiegen!"
|
- Aufstieg: "⬆️ Du bist auf Platz 3 aufgestiegen!"
|
||||||
- Abstieg: "⬇️ Du bist auf Platz 7 gerutscht — hol dir die Punkte zurück!"
|
- Abstieg: "⬇️ Du bist auf Platz 7 gerutscht — hol dir die Punkte zurück!"
|
||||||
- Knapper Verfolger: "⚠️ Anna ist nur noch 1 Punkt hinter dir!"
|
- Knapper Verfolger: "⚠️ Anna ist nur noch 1 Punkt hinter dir!"
|
||||||
|
|
||||||
- **Speicherung:** Letzter bekannter Rang in localStorage, Vergleich bei jedem Laden
|
- **Speicherung:** Letzter bekannter Rang in localStorage, Vergleich bei jedem Laden
|
||||||
|
|
||||||
### 5.5 Streak-Tracker
|
### 5.5 Streak-Tracker
|
||||||
|
|
||||||
- **Definition:** Anzahl aufeinanderfolgender Spiele, für die ein Tipp abgegeben wurde (nicht Korrektheit, nur Teilnahme)
|
- **Definition:** Anzahl aufeinanderfolgender Spiele, für die ein Tipp abgegeben wurde (nicht Korrektheit, nur Teilnahme)
|
||||||
|
|
||||||
- **Anzeige:** 🔥-Counter auf dem Dashboard und im Profil
|
- **Anzeige:** 🔥-Counter auf dem Dashboard und im Profil
|
||||||
|
|
||||||
- **Meilensteine:**
|
- **Meilensteine:**
|
||||||
- 3er-Streak: 🔥 Feuer-Icon erscheint
|
- 3er-Streak: 🔥 Feuer-Icon erscheint
|
||||||
- 10er-Streak: 🔥🔥 Doppel-Feuer
|
- 10er-Streak: 🔥🔥 Doppel-Feuer
|
||||||
- 20er-Streak: ⚡ Blitz-Icon
|
- 20er-Streak: ⚡ Blitz-Icon
|
||||||
|
|
||||||
- **Streak-Bruch:** "Deine 7er-Serie ist gerissen! Starte eine neue." als Nudge auf dem Dashboard
|
- **Streak-Bruch:** "Deine 7er-Serie ist gerissen! Starte eine neue." als Nudge auf dem Dashboard
|
||||||
|
|
||||||
- **Backend:** Streak wird bei Tipp-Abgabe berechnet (aufeinanderfolgende Spiele nach Kick-off-Datum)
|
- **Backend:** Streak wird bei Tipp-Abgabe berechnet (aufeinanderfolgende Spiele nach Kick-off-Datum)
|
||||||
|
|
||||||
---
|
---
|
||||||
@@ -174,29 +228,45 @@ Die aktuelle Profil-Seite zeigt Name, Rang und 4 Stat-Boxen. Das Redesign macht
|
|||||||
### Layout (von oben nach unten):
|
### Layout (von oben nach unten):
|
||||||
|
|
||||||
**Header-Card:**
|
**Header-Card:**
|
||||||
|
|
||||||
- Initialen-Avatar (bestehendes Design)
|
- Initialen-Avatar (bestehendes Design)
|
||||||
|
|
||||||
- Name + Rang-Badge ("🏆 Platz 5")
|
- Name + Rang-Badge ("🏆 Platz 5")
|
||||||
|
|
||||||
- Lieblingsteam mit Flagge (bestehende "Team hinzufügen"-Funktion, prominenter platziert)
|
- Lieblingsteam mit Flagge (bestehende "Team hinzufügen"-Funktion, prominenter platziert)
|
||||||
|
|
||||||
**Stats-Ring:**
|
**Stats-Ring:**
|
||||||
|
|
||||||
- Kreisdiagramm (Donut-Chart) mit Verteilung: Exakt / Tendenz / Falsch
|
- Kreisdiagramm (Donut-Chart) mit Verteilung: Exakt / Tendenz / Falsch
|
||||||
|
|
||||||
- Gesamtpunktzahl in der Mitte des Rings
|
- Gesamtpunktzahl in der Mitte des Rings
|
||||||
|
|
||||||
- Legende darunter
|
- Legende darunter
|
||||||
|
|
||||||
**Tipp-Historie:**
|
**Tipp-Historie:**
|
||||||
|
|
||||||
- Scrollbare Liste: "Deine letzten 10 Tipps"
|
- Scrollbare Liste: "Deine letzten 10 Tipps"
|
||||||
|
|
||||||
- Jeder Eintrag: Teams, dein Tipp, Ergebnis, Punkte-Badge
|
- Jeder Eintrag: Teams, dein Tipp, Ergebnis, Punkte-Badge
|
||||||
|
|
||||||
- Expandierbar auf alle Tipps
|
- Expandierbar auf alle Tipps
|
||||||
|
|
||||||
**Fun-Stats:**
|
**Fun-Stats:**
|
||||||
|
|
||||||
- "Dein Lieblings-Tipp: 1:0 (5x getippt)"
|
- "Dein Lieblings-Tipp: 1:0 (5x getippt)"
|
||||||
|
|
||||||
- "Du tippst 70% Heimsiege"
|
- "Du tippst 70% Heimsiege"
|
||||||
|
|
||||||
- "Längste Streak: 🔥12"
|
- "Längste Streak: 🔥12"
|
||||||
|
|
||||||
- Rotiert oder zeigt 2-3 gleichzeitig
|
- Rotiert oder zeigt 2-3 gleichzeitig
|
||||||
|
|
||||||
**Achievement-Platzhalter (Vorgriff Phase 2):**
|
**Achievement-Platzhalter (Vorgriff Phase 2):**
|
||||||
|
|
||||||
- Badge-Leiste am unteren Rand
|
- Badge-Leiste am unteren Rand
|
||||||
|
|
||||||
- Grau/locked wenn noch nicht erreicht, farbig wenn freigeschaltet
|
- Grau/locked wenn noch nicht erreicht, farbig wenn freigeschaltet
|
||||||
|
|
||||||
- Phase 1: Platzhalter-UI, Logik kommt in Phase 2
|
- Phase 1: Platzhalter-UI, Logik kommt in Phase 2
|
||||||
|
|
||||||
---
|
---
|
||||||
@@ -204,24 +274,37 @@ Die aktuelle Profil-Seite zeigt Name, Rang und 4 Stat-Boxen. Das Redesign macht
|
|||||||
## 7. Entfernte / Vereinfachte Features
|
## 7. Entfernte / Vereinfachte Features
|
||||||
|
|
||||||
### KI-Agent / Expertenblick — ENTFERNT
|
### KI-Agent / Expertenblick — ENTFERNT
|
||||||
|
|
||||||
- Chat-Widget (Fußball-Icon unten rechts) wird entfernt
|
- Chat-Widget (Fußball-Icon unten rechts) wird entfernt
|
||||||
|
|
||||||
- "Expertenblick"-Accordion im Tipp-Modal wird entfernt
|
- "Expertenblick"-Accordion im Tipp-Modal wird entfernt
|
||||||
|
|
||||||
- Dateien: `AgentChat.tsx`, Agent-Route im Backend (`/api/agent`) können entfernt oder deaktiviert werden
|
- Dateien: `AgentChat.tsx`, Agent-Route im Backend (`/api/agent`) können entfernt oder deaktiviert werden
|
||||||
|
|
||||||
- Begründung: Nice-to-have, lenkt vom Kernflow ab, spart Platz auf Mobile
|
- Begründung: Nice-to-have, lenkt vom Kernflow ab, spart Platz auf Mobile
|
||||||
|
|
||||||
### Tipp-Modal — VERSCHLANKT
|
### Tipp-Modal — VERSCHLANKT
|
||||||
|
|
||||||
- **Entfernt:** Gruppeninfo-Header, Kick-off-Datum (steht schon auf der Card), Expertenblick-Accordion
|
- **Entfernt:** Gruppeninfo-Header, Kick-off-Datum (steht schon auf der Card), Expertenblick-Accordion
|
||||||
|
|
||||||
- **Bleibt:** Team-Flaggen + Namen, Score-Picker (+/-), Tendenz-Anzeige, "Tipp bestätigen"-Button
|
- **Bleibt:** Team-Flaggen + Namen, Score-Picker (+/-), Tendenz-Anzeige, "Tipp bestätigen"-Button
|
||||||
|
|
||||||
- **Neu:** Erfolgsanimation nach Bestätigung (siehe 5.1)
|
- **Neu:** Erfolgsanimation nach Bestätigung (siehe 5.1)
|
||||||
|
|
||||||
### Stage-Filter — VEREINFACHT
|
### Stage-Filter — VEREINFACHT
|
||||||
|
|
||||||
- Aktuell: 8 horizontale Filter-Buttons
|
- Aktuell: 8 horizontale Filter-Buttons
|
||||||
|
|
||||||
- Neu: Dropdown/Select im Spielplan-Header
|
- Neu: Dropdown/Select im Spielplan-Header
|
||||||
|
|
||||||
- Smart Sections übernehmen die Hauptnavigation im Spielplan
|
- Smart Sections übernehmen die Hauptnavigation im Spielplan
|
||||||
|
|
||||||
### Admin-Navigation — VERSTECKT
|
### Admin-Navigation — VERSTECKT
|
||||||
|
|
||||||
- Nicht mehr als Haupttab sichtbar
|
- Nicht mehr als Haupttab sichtbar
|
||||||
|
|
||||||
- Nur für User mit Editor-Rolle: Zahnrad-Icon im Header
|
- Nur für User mit Editor-Rolle: Zahnrad-Icon im Header
|
||||||
|
|
||||||
- Viewer sehen keine Admin-UI
|
- Viewer sehen keine Admin-UI
|
||||||
|
|
||||||
---
|
---
|
||||||
@@ -229,21 +312,33 @@ Die aktuelle Profil-Seite zeigt Name, Rang und 4 Stat-Boxen. Das Redesign macht
|
|||||||
## 8. Technische Hinweise
|
## 8. Technische Hinweise
|
||||||
|
|
||||||
### Frontend
|
### Frontend
|
||||||
|
|
||||||
- **Framework:** React + Vite + TypeScript (bestehend)
|
- **Framework:** React + Vite + TypeScript (bestehend)
|
||||||
|
|
||||||
- **Animationen:** CSS-Animationen + `framer-motion` für komplexere Sequenzen (Konfetti, Punkte-Reveal)
|
- **Animationen:** CSS-Animationen + `framer-motion` für komplexere Sequenzen (Konfetti, Punkte-Reveal)
|
||||||
|
|
||||||
- **Konfetti:** Lightweight-Library wie `canvas-confetti` (~3KB)
|
- **Konfetti:** Lightweight-Library wie `canvas-confetti` (~3KB)
|
||||||
|
|
||||||
- **Charts:** Donut-Chart für Profil — entweder SVG-basiert selbst gebaut oder leichtgewichtige Library
|
- **Charts:** Donut-Chart für Profil — entweder SVG-basiert selbst gebaut oder leichtgewichtige Library
|
||||||
|
|
||||||
- **Haptic:** `navigator.vibrate(50)` für Mobile (Progressive Enhancement, kein Fallback nötig)
|
- **Haptic:** `navigator.vibrate(50)` für Mobile (Progressive Enhancement, kein Fallback nötig)
|
||||||
|
|
||||||
- **State:** localStorage für Streak, gesehene Reveals, letzter Rang
|
- **State:** localStorage für Streak, gesehene Reveals, letzter Rang
|
||||||
|
|
||||||
### Backend
|
### Backend
|
||||||
|
|
||||||
- **Streak-Berechnung:** Neue Query oder Service-Funktion, die aufeinanderfolgende Tipps zählt
|
- **Streak-Berechnung:** Neue Query oder Service-Funktion, die aufeinanderfolgende Tipps zählt
|
||||||
|
|
||||||
- **Dashboard-Daten:** Neuer Endpoint `/api/dashboard` der Hero-Spiel, Stats und Nudges gebündelt liefert
|
- **Dashboard-Daten:** Neuer Endpoint `/api/dashboard` der Hero-Spiel, Stats und Nudges gebündelt liefert
|
||||||
|
|
||||||
- **Cleanup:** Agent-Route kann deaktiviert werden (Feature-Flag oder entfernen)
|
- **Cleanup:** Agent-Route kann deaktiviert werden (Feature-Flag oder entfernen)
|
||||||
|
|
||||||
### Kein Breaking Change
|
### Kein Breaking Change
|
||||||
|
|
||||||
- Bestehende API-Endpoints bleiben kompatibel
|
- Bestehende API-Endpoints bleiben kompatibel
|
||||||
|
|
||||||
- Datenbank-Schema braucht keine Migration (Streak wird berechnet, nicht gespeichert)
|
- Datenbank-Schema braucht keine Migration (Streak wird berechnet, nicht gespeichert)
|
||||||
|
|
||||||
- Bestehende Tipps und Punkte bleiben erhalten
|
- Bestehende Tipps und Punkte bleiben erhalten
|
||||||
|
|
||||||
---
|
---
|
||||||
|
|||||||
Reference in New Issue
Block a user