diff --git a/docs/plans/2026-02-24-statistics-screen-design.md b/docs/plans/2026-02-24-statistics-screen-design.md new file mode 100644 index 0000000..892ed30 --- /dev/null +++ b/docs/plans/2026-02-24-statistics-screen-design.md @@ -0,0 +1,59 @@ +# Statistics Screen Design + +**Date:** 2026-02-24 +**Feature:** Word mastery statistics screen +**Branch:** feature/statistics-screen + +## Summary + +Add a statistics screen accessible from the results screen that shows word mastery progress for all vocabulary words. Users can see how well they know each word and reset their statistics. + +## Navigation + +- Results screen gets a "Statistik anzeigen" button +- Tapping it switches to the new `Statistics` view state in `Home.razor` +- A "Zurück zum Start" button returns to the start screen +- No routing changes required + +## Architecture + +A new `Statistics` value is added to the existing view state enum in `Home.razor`. Statistics data is read directly from `GameService` (already loaded in memory). A new `ResetStatisticsAsync()` method is added to `GameService` that clears all `CorrectCount`/`IncorrectCount` values and persists to localStorage. + +## Statistics Screen Layout + +**Header:** Summary line showing total words played and overall accuracy. + +**Word list:** Scrollable list of all 20 words, sorted by ascending accuracy (worst first). Words never played appear at the bottom. + +Each row contains: +- Image thumbnail (~80px SVG) +- Word name (German) +- Accuracy percentage ("75% richtig") or "—" if never played +- Progress bar (fills green based on accuracy) + +**Footer:** +- "Zurücksetzen" button (with confirmation) — resets all statistics +- "Zurück zum Start" button + +## Mastery / Progress Bar Logic + +- Accuracy = `CorrectCount / (CorrectCount + IncorrectCount)` +- Never played: shown last, bar at 0%, label "—" +- Bar color: + - Green: ≥ 70% accuracy + - Orange: 40–69% accuracy + - Red: < 40% accuracy + +## Sorting + +Words sorted ascending by accuracy so the words needing most practice appear at the top. Never-played words are treated as 0% accuracy but sorted after all played words. + +## Reset Flow + +Tapping "Zurücksetzen" shows a browser `confirm()` dialog (or inline confirmation). On confirmation, `GameService.ResetStatisticsAsync()` zeros all counts and saves to localStorage. The list refreshes to show all words at 0 / "—". + +## Files to Change + +- `MemoryGame/Pages/Home.razor` — add Statistics view state and UI +- `MemoryGame/Services/GameService.cs` — add `ResetStatisticsAsync()` method +- `MemoryGame/wwwroot/css/app.css` — add statistics screen styles (including tablet breakpoint)