2.7 KiB
2.7 KiB
M0 Screenshot- und Designreferenz
Stand: 2026-07-11
Diese Checkliste friert die bestehende Optik ein, damit die SaaS-App vertraut bleibt. Wenn die Legacy-App lokal nicht laeuft, koennen Screenshots aus der aktuellen Umgebung geliefert werden.
Allgemeine Vorgaben
- Je Seite Desktop mit ca. 1440 px Breite aufnehmen.
- Je Kernseite mobile Ansicht mit ca. 390 px Breite aufnehmen.
- Je relevanter Rolle aufnehmen: normales Mitglied und Admin.
- Keine echten personenbezogenen Daten veroeffentlichen.
- Dateinamen nach Muster
m0-<rolle>-<seite>-<viewport>.png.
Kernseiten
| Prioritaet | Seite | Rolle | Zweck |
|---|---|---|---|
| Hoch | index.php |
Mitglied | Dashboard, Saldo, Jahreswerte, eigene Striche, PayPal |
| Hoch | index.php |
Admin | Dashboard mit Admin-Sidebar |
| Hoch | kaffeeliste.php |
Admin | Gesamtuebersicht und Aktionsleiste |
| Hoch | stricheintragen.php |
Admin | Sammelerfassung Striche |
| Hoch | einzahlung.php |
Admin | Sammelerfassung Einzahlungen |
| Hoch | mitarbeiterverwalten.php |
Admin | Mitgliederliste und Formular |
| Hoch | letzteneintraege.php |
Admin | Korrekturansicht mit Loeschaktionen |
| Mittel | csvupload.php |
Admin | CSV-Upload-Formular und Ergebniszustand |
| Mittel | hinweise.php |
Admin | Hinweise anlegen und Liste |
| Mittel | faq.php |
Mitglied | FAQ-Inhalte und Typografie |
| Mittel | namenanpassen.php |
Mitglied | Formular fuer Anzeigenamen |
| Niedrig | teilnehmerauswertung.php |
Admin | Detailauswertung pro Teilnehmer |
| Niedrig | mailausgebe.php |
Admin | Mail-/Adressausgabe |
| Niedrig | umfrage.php |
Mitglied | Randmodul, falls SaaS-relevant |
| Niedrig | umfrageergebnisse.php |
Admin | Randmodul, falls SaaS-relevant |
Zustaende
Diese UI-Zustaende sollten, wenn moeglich, separat gesichert werden:
- Positiver Kontostand.
- Negativer Kontostand.
- Nullsaldo.
- Nutzer ohne Zugriff.
- Erfolgreiche Stricherfassung.
- Erfolgreiche Einzahlung.
- CSV-Import mit Erfolg, Dublette und unbekanntem Nutzer.
- Hinweisbanner aktiv.
- Leere Tabellen oder keine Daten.
- Mobile Sidebar geoeffnet und geschlossen.
Designmerkmale, die erhalten bleiben sollen
- Gruener Akzent fuer Links, Buttons und Linien.
- Roboto-Slab-Ueberschriften.
- Open-Sans-Fliesstext.
- Weisse Hauptflaeche.
- Graue Sidebar in der App.
- Tabellen als zentrale Datenansicht.
- Schlichte Formularfelder und Buttons.
- Ruhige, arbeitsorientierte Darstellung.
Ablage
Empfohlene lokale Ablage, falls Screenshots ins Repo sollen:
docs/m0/screenshots/
Vor dem Commit sollten Screenshots anonymisiert sein. Wenn echte Namen, E-Mails, PayPal-Daten oder Salden sichtbar sind, besser ausserhalb des Repos ablegen und nur als Referenz verwenden.