Fwd: Monthy Hall

[tickbot]

Mail Metadata

From: "Alexander Sept | byqurity.dev GmbH" alexander.sept@byqurity.dev To: as@temp.byqurity.dev Date: 2025-10-13T13:40:20.000Z
Message-ID: 209510E3-A913-42B6-BFA8-7E95693C4796@byqurity.dev

Titel: Monthy Hall UI-Polish: Konsistente Icons, Tür-ähnliche Buttons & erweiterte Statistiken

Beschreibung

• Die aktuelle Monthy Hall-App nutzt uneinheitliche Auto-Bilder (JPEG) und reagiert nicht optimal auf visuelle Konsistenz. Vorschläge zielen auf SVG-Icons im einheitlichen Stil, passende Tür-Buttons und erweiterte Chart-Statistiken.

Umsetzungsvorschläge

• UI-Assets
  • Alle Autodarstellungen durch SVG-Icons ersetzen.
  • SVGs in einem konsistenten Stil (Design-System, Farbschema, Breite/Höhe) liefern.
  • Assets unter assets/icons/monthy-hall/ ablegen; Bildquelle in den Assets-Dokumentationen aktualisieren.
• Button-Design
  • Buttons visuell wie Türen gestalten (Drehtüren-/Tür-Form, Türspalt, Griffe ggf. als Icon).
  • Interaktionen: Hover/Eingabe-Animationen, Fokuszustand zugänglich gestalten (Kontrast ≥ 4.5, Keyboard-Navigation).
  • Beispiel-States in Styleguide/Dokumentation abbilden.
• Statistiken & Charts
  • Mindestens drei zusätzliche Metriken hinzufügen:
    • Win-Rate pro Tür/Option
    • Durchschnittliche Entscheidungszeit pro Spiel
    • Verteilung der Spiele nach Türauswahl und Ergebnis
  • API/Chart-Datenquellen um die neuen Metriken erweitern; Chart-Komponenten entsprechend parametrisierbar machen.
  • Datenschutz/Anonymisierung prüfen (falls necessary).
• Dokumentation & QA
  • Design- und Asset-Guidelines im Projekt-Dokument aktualisieren.
  • Visuelle Regression/Smoke-Tests für UI-Änderungen hinzufügen.
  • Accessibility-Checks (Alt-Text, Beschriftung, Tastatur-Navigation) sicherstellen.

Akzeptanzkriterien

• Alle Autodarstellungen wurden durch SVG-Icons ersetzt und visuals sind konsistent (gleiche Stilrichtung, Farbschema, Größen).
• Buttons sehen eindeutig aus wie Türen, entsprechen dem Look der Monthy Hall-Story, haben klare Hover/Fokus-States und sind barrierefrei.
• Charts zeigen die bisherigen Daten korrekt an und liefern zusätzlich:
  • Win-Rate pro Tür
  • Durchschnittliche Entscheidungszeit
  • Verteilung der Spiele nach Türwahl/Ergebnis
• Neue Metriken werden zuverlässig in der API/Chart-Schicht bereitgestellt und in der UI abrufbar dargestellt.
• Design-Dokument und Asset-Guidelines sind aktualisiert.
• Manuelle QA-Checks bestehen (Visuelle Konsistenz, Interaktionen, Responsivität, Barrierefreiheit).

Offene Fragen

• Soll der Name Monthy Hall in Code/Docs konsistent angepasst werden (z.B. Monty Hall) oder beibehalten werden?
• Gibt es bevorzugte SVG-Stil-Guidelines (Komplexität, Farbschema), die wir übernehmen sollen?