3.8 KiB
3.8 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 läuft, können 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 veröffentlichen.
- Dateinamen nach Muster
m0-<rolle>-<seite>-<viewport>.png.
Kernseiten
| Priorität | Seite | Rolle | Status | Zweck |
|---|---|---|---|---|
| Hoch | index.php |
Mitglied | vorhanden: m0-member-dashboard-desktop.png, m0-member-dashboard-mobile.png |
Dashboard, Saldo, Jahreswerte, eigene Striche, PayPal |
| Hoch | index.php |
Admin | aktuell identisch wie Mitglied | Dashboard mit Admin-Sidebar |
| Hoch | kaffeeliste.php |
Admin | vorhanden: m0-admin-kaffeeliste-desktop.png |
Gesamtübersicht und Aktionsleiste |
| Hoch | stricheintragen.php |
Admin | vorhanden: m0-admin-stricheintragen-desktop.png |
Sammelerfassung Striche |
| Hoch | einzahlung.php |
Admin | vorhanden: m0-admin-einzahlung-desktop.png |
Sammelerfassung Einzahlungen |
| Hoch | mitarbeiterverwalten.php |
Admin | vorhanden: m0-admin-mitglieder-desktop.png |
Mitgliederliste und Formular |
| Hoch | letzteneintraege.php |
Admin | vorhanden: m0-admin-letzteneintraege-desktop.png |
Korrekturansicht mit Löschaktionen |
| Mittel | csvupload.php |
Admin | vorhanden: m0-admin-csv-upload-desktop.png |
CSV-Upload-Formular und Ergebniszustand |
| Mittel | hinweise.php |
Admin | vorhanden: m0-admin-hinweise-desktop.png |
Hinweise anlegen und Liste |
| Mittel | faq.php |
Mitglied | vorhanden: m0-member-faq-desktop.png |
FAQ-Inhalte und Typografie |
| Mittel | namenanpassen.php |
Mitglied | offen | Formular für Anzeigenamen |
| Niedrig | teilnehmerauswertung.php |
Admin | offen | Detailauswertung pro Teilnehmer |
| Niedrig | mailausgebe.php |
Admin | offen | Mail-/Adressausgabe |
| Niedrig | umfrage.php |
Mitglied | offen, falls SaaS-relevant | Randmodul, falls SaaS-relevant |
| Niedrig | umfrageergebnisse.php |
Admin | offen, falls SaaS-relevant | Randmodul, falls SaaS-relevant |
Gelieferte Dateien
docs/m0/screenshots/m0-admin-einzahlung-desktop.png
docs/m0/screenshots/m0-admin-csv-upload-desktop.png
docs/m0/screenshots/m0-admin-hinweise-desktop.png
docs/m0/screenshots/m0-admin-kaffeeliste-desktop.png
docs/m0/screenshots/m0-admin-letzteneintraege-desktop.png
docs/m0/screenshots/m0-admin-mitglieder-desktop.png
docs/m0/screenshots/m0-admin-stricheintragen-desktop.png
docs/m0/screenshots/m0-member-dashboard-desktop.png
docs/m0/screenshots/m0-member-dashboard-mobile.png
docs/m0/screenshots/m0-member-faq-desktop.png
Zustände
Diese UI-Zustände sollten, wenn möglich, 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 geöffnet und geschlossen.
Designmerkmale, die erhalten bleiben sollen
- Grüner Akzent für Links, Buttons und Linien.
- Roboto-Slab-Überschriften.
- Open-Sans-Fließtext.
- Weiße Hauptfläche.
- 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 außerhalb des Repos ablegen und nur als Referenz verwenden.