# 📱 PWA Wireframes (Markdown) ## Landingpage -------------------------------------------------- HEADER [ Willkommen bei Fotochallenge 🎉 ] HAUPTBEREICH Eingabe-Feld: [ QR-Code / Event-PIN ] Button: [ ➡️ Event beitreten ] FOOTER (none) -------------------------------------------------- ## Profil-Setup -------------------------------------------------- HEADER [ Profil erstellen ] HAUPTBEREICH Eingabefeld: [ Dein Name ] Option: Avatar wählen (Rund-Icons) Button: [ ✅ Starten ] -------------------------------------------------- ## Startseite (Home) -------------------------------------------------- HEADER [ Hochzeit Anna & Tom 🎉 ] (Avatar rechts) 📸 Dein Fotospiel zur Hochzeit – mach Aufgaben & teile Momente INFO-BAR 👥 37 Gäste online | ✅ 142 Aufgaben gelöst HAUPTBEREICH [ 🎲 Aufgabe ziehen ] (großer Button, primär) [ 😊 Wie fühlst du dich? ] (großer Button, sekundär) (kleiner Link unterhalb:) [ 📸 Einfach ein Foto machen ] GALERIE / FEED Filter: [ Neueste ] [ Beliebt ] [ Meine ] Foto-Kacheln mit ❤️ Like-Icon -------------------------------------------------- FOOTER-NAVI 🏠 Start 🎲 Aufgaben 🏆 Achievements 🖼️ Galerie -------------------------------------------------- ## Aufgaben-Picker -------------------------------------------------- HEADER [ 🎲 Aufgabe ziehen ] (X schließen) HAUPTBEREICH Option A: Zufallsaufgabe sofort anzeigen Option B: Stimmung wählen (Emoji-Grid) 😊 Emotionen (Grid): 🤪 Albern 🕺 Energetisch 🤗 Herzlich 😎 Cool 🧑‍🤝‍🧑 Gemeinsam 🧠 Kreativ 😌 Ruhig 🎯 Mutig Optional: Slider "Energie-Level" [ 🔋 niedrig | 🔋 mittel | 🔋 hoch ] BUTTON [ 👉 Aufgabe anzeigen ] -------------------------------------------------- ## Aufgaben-Detail (Karte) -------------------------------------------------- HEADER [ 🤪 Albern ] (X schließen) AUFGABEN-KARTE 📸 Aufgabe: "Mach ein Selfie, bei dem alle in die falsche Richtung schauen." ⏱️ Dauer: < 1 Min 👥 Gruppengröße: 2–5 BUTTONS [ 📷 Los geht’s ] (Foto machen/hochladen) [ ↻ Neue Aufgabe ] (gleiche Stimmung) [ 😊 Andere Stimmung wählen ] (zurück zum Picker) -------------------------------------------------- ## Kamera/Upload -------------------------------------------------- HEADER [ 📷 Foto aufnehmen ] HAUPTBEREICH [ Kamera öffnen ] oder [ Foto hochladen ] Nach Upload: ✅ „Foto erfolgreich hochgeladen 🎉“ BUTTON [ Galerie ansehen ] -------------------------------------------------- ## Galerie (Übersicht) -------------------------------------------------- HEADER [ 📸 Galerie ] (Filter oben) FILTER [ Neueste ] [ Beliebt ] [ Meine ] FOTOS (Kachel- oder Feed-Ansicht) [ ❤️ 12 ] Foto 1 [ ❤️ 5 ] Foto 2 [ ❤️ 21 ] Foto 3 ... Tap → öffnet Foto-Detail -------------------------------------------------- ## Foto-Detailansicht -------------------------------------------------- HEADER [ X Schließen ] HAUPTBEREICH 📷 Foto im Vollbild UNTER DEM FOTO ❤️ 23 Likes 🎉 4 Reaktionen 📸 Aufgabe: "Gruppenfoto mit mindestens 5 Personen" 👤 Hochgeladen von: „Lisa“ BUTTON [ ❤️ Like ] -------------------------------------------------- ## Achievements / Erfolge -------------------------------------------------- HEADER [ 🏆 Meine Erfolge ] HAUPTBEREICH Badges: 🎊 Erstes Foto 🏅 5 Aufgaben erledigt 🔥 Beliebtestes Foto 👯 Gruppenfoto-König Fortschritt-Balken: (xx / yy Aufgaben) -------------------------------------------------- ## Optionale Seiten ### Slideshow / Präsentation -------------------------------------------------- HEADER [ 📽️ Slideshow-Modus ] HAUPTBEREICH - Vollbild-Diashow der Galerie - Automatischer Wechsel alle 5 Sek. - Anzeige: Likes & Aufgabe -------------------------------------------------- ### Admin-Panel -------------------------------------------------- HEADER [ 👑 Admin-Panel ] HAUPTBEREICH - Fotos moderieren (löschen, hervorheben) - Teilnehmer-Übersicht -------------------------------------------------- ### Event-Abschluss -------------------------------------------------- HEADER [ 🎉 Danke fürs Mitmachen! ] HAUPTBEREICH - Zusammenfassung: Anzahl Fotos, Aufgaben, Likes - QR-Code oder Link zur Online-Galerie - „Bis bald ❤️“ --------------------------------------------------