Initialize repo and add session changes (2025-09-08)
This commit is contained in:
Auto Commit
185
docs/wireframes/guest-pwa.md
Normal file
185
docs/wireframes/guest-pwa.md
Normal file
@@ -0,0 +1,185 @@
|
||||
# Guest PWA — Wireframes (Low-Fi)
|
||||
|
||||
Navigation Flow
|
||||
|
||||
```mermaid
|
||||
flowchart TD
|
||||
A[Scan QR / Open Link] --> B[Token Validate]
|
||||
B -->|ok| C[Terms / Optional PIN]
|
||||
B -->|invalid| Z[Error: Event Closed]
|
||||
C --> D[Gallery]
|
||||
D --> E[Upload Picker]
|
||||
E --> F[Upload Queue]
|
||||
D --> G[Photo Lightbox]
|
||||
D --> H[Filters]
|
||||
D --> I[Settings]
|
||||
F --> D
|
||||
G --> D
|
||||
```
|
||||
|
||||
Gallery (mobile)
|
||||
|
||||
```
|
||||
+--------------------------------------------------+
|
||||
| Toolbar: [Scan?] [Filter] [Upload] [Menu] |
|
||||
+--------------------------------------------------+
|
||||
| ▢ ▢▢ ▢ ▢▢▢ ▢▢ ▢ ▢▢ Masonry grid |
|
||||
| ▢▢ ▢ ▢▢ ▢ ▢ ▢▢ ▢ |
|
||||
| ▢ ▢▢ ▢ ▢▢ ▢▢ ▢ ▢ |
|
||||
+--------------------------------------------------+
|
||||
| Pull to refresh ▲ new items |
|
||||
+--------------------------------------------------+
|
||||
```
|
||||
|
||||
Upload Queue (mobile)
|
||||
|
||||
```
|
||||
+---------------- Uploads -------------------------+
|
||||
| [ ] IMG_1234.jpg 75% ||||||||||\____ [X] |
|
||||
| [!] IMG_1235.jpg retry network error [↻] |
|
||||
| [ ] IMG_0002.jpg queued |
|
||||
| |
|
||||
| Background sync: (On) • Pause • Clear all |
|
||||
+--------------------------------------------------+
|
||||
```
|
||||
|
||||
Lightbox
|
||||
|
||||
```
|
||||
+------------------ Photo -------------------------+
|
||||
| < back ❤ 128 likes Share ⤴ |
|
||||
| |
|
||||
| [ image ] |
|
||||
| |
|
||||
| Emotion: 🎉 Party Task: Jump shot |
|
||||
+--------------------------------------------------+
|
||||
```
|
||||
|
||||
States & Messages
|
||||
- Empty gallery: “Be the first to upload a photo!” + CTA button.
|
||||
- Event closed: explain and provide contact hint.
|
||||
- Offline: banner “You’re offline — viewing cached photos. Uploads will resume automatically.”
|
||||
|
||||
Notes
|
||||
- Keep wireframes platform-agnostic; exact visuals handled by design system.
|
||||
- Photos only; video capture/upload is not supported.
|
||||
|
||||
Additional Screens (from PWA_Wireframes.txt)
|
||||
|
||||
Landing / Einstieg
|
||||
|
||||
```
|
||||
+---------------- Landing -------------------------+
|
||||
| Willkommen bei Fotochallenge 🎉 |
|
||||
| |
|
||||
| [ QR/PIN eingeben ] [ Event beitreten ] |
|
||||
| |
|
||||
| Fehler: Ungültiger Code / Event geschlossen |
|
||||
+-------------------------------------------------+
|
||||
```
|
||||
|
||||
Profil-Setup
|
||||
|
||||
```
|
||||
+---------------- Profil --------------------------+
|
||||
| Profil erstellen |
|
||||
| [ Dein Name ] |
|
||||
| ( ) Avatar wählen (Rund-Icons) |
|
||||
| [ Starten ] [ Überspringen ] |
|
||||
+--------------------------------------------------+
|
||||
```
|
||||
|
||||
Home / Feed (mit Info-Bar)
|
||||
|
||||
```
|
||||
+---------------- Home ----------------------------+
|
||||
| Eventtitel |
|
||||
| Dein Fotospiel zur Hochzeit |
|
||||
| ———————————————————————————————— |
|
||||
| X Gäste online ✅ Y Aufgaben gelöst |
|
||||
| |
|
||||
| [ Aufgabe ziehen ] [ Wie fühlst du dich? ] |
|
||||
| (klein) Einfach ein Foto machen |
|
||||
| |
|
||||
| [Masonry Feed …] |
|
||||
+--------------------------------------------------+
|
||||
```
|
||||
|
||||
Aufgaben-Picker (Emotionen)
|
||||
|
||||
```
|
||||
+-------------- Stimmung wählen -------------------+
|
||||
| Albern Energetisch Herzlich Cool Gemeinsam |
|
||||
| Kreativ Ruhig Mutig |
|
||||
| [ Aufgabe anzeigen ] |
|
||||
+--------------------------------------------------+
|
||||
```
|
||||
|
||||
Aufgaben-Detail (Karte)
|
||||
|
||||
```
|
||||
+---------------- Aufgabe -------------------------+
|
||||
| Stimmung: Albern [X] |
|
||||
| Aufgabe: Selfie in falsche Richtung |
|
||||
| Dauer: <1 Min Gruppe: 2–5 |
|
||||
| [ Los geht’s ] [ Neue Aufgabe ] [ Stimmung ] |
|
||||
+--------------------------------------------------+
|
||||
```
|
||||
|
||||
Kamera / Upload
|
||||
|
||||
```
|
||||
+--------------- Kamera/Upload --------------------+
|
||||
| [ Kamera öffnen ] [ Foto hochladen ] |
|
||||
| ✔ Foto erfolgreich hochgeladen |
|
||||
| [ Galerie ansehen ] |
|
||||
+--------------------------------------------------+
|
||||
```
|
||||
|
||||
Galerie / Filter
|
||||
|
||||
```
|
||||
+---------------- Galerie -------------------------+
|
||||
| [ Neueste ] [ Beliebt ] [ Meine ] |
|
||||
| ❤️12 [Foto] |
|
||||
| ❤️ 5 [Foto] |
|
||||
| ❤️21 [Foto] |
|
||||
+--------------------------------------------------+
|
||||
```
|
||||
|
||||
Foto-Detailansicht
|
||||
|
||||
```
|
||||
+--------------- Foto-Detail ----------------------+
|
||||
| [X] |
|
||||
| [ Vollbild-Foto ] |
|
||||
| ❤️ 23 🎉 4 Reaktionen |
|
||||
| Aufgabe: Gruppenfoto (>=5) |
|
||||
| Hochgeladen von: Lisa |
|
||||
| [ ❤️ Like ] |
|
||||
+--------------------------------------------------+
|
||||
```
|
||||
|
||||
Erfolge / Achievements
|
||||
|
||||
```
|
||||
+--------------- Erfolge --------------------------+
|
||||
| Erstes Foto 5 Aufgaben Beliebtestes Foto |
|
||||
| Gruppenfoto-König |
|
||||
| Fortschritt: [██████▁▁▁] (6/10) |
|
||||
+--------------------------------------------------+
|
||||
```
|
||||
|
||||
Optionale: Slideshow & Abschluss
|
||||
|
||||
```
|
||||
+------------- Slideshow (optional) ---------------+
|
||||
| Vollbild-Wechsel alle 5s, Likes & Aufgabe-Overlay|
|
||||
+--------------------------------------------------+
|
||||
|
||||
+--------------- Event-Abschluss ------------------+
|
||||
| Danke fürs Mitmachen! |
|
||||
| Fotos: 120 Aufgaben: 45 Likes: 900 |
|
||||
| QR/Link zur Online-Galerie |
|
||||
+--------------------------------------------------+
|
||||
```
|
||||
Reference in New Issue
Block a user