La Piazzetta di Leverkusen
Website-Neubau · Farbwelt Forno ← Übersicht · 1a Startseite live · 1b Szenen 1–7 · 1c Speisekarte · 1d Mobile · 1e Offene PunkteStartseite — Scrollytelling im Fenster
1440 × 900 · im Fenster scrollen · Szene 1–7Szene 1–7 — Einzelframes zur Abnahme
1440 × 810 je Frame, auf 50 % gezeigt · Verhalten unter jedem Frame
Ankunft
Verhalten: Video skaliert von 1,0 auf 1,14. Headline steigt langsamer als der Rest und blendet über die erste Bildschirmhöhe aus. Header sticky mit Blur.
Bewegtbild: zwei Shots — Belag fällt auf den Teig, dann POV, wie die Pizza in den Ofen geschoben wird. Läuft stumm und einmalig, kein Loop.
Der Teig
Verhalten: Split 50/50, kein Pinning. Kicker, Headline, Absatz und Zahlenblock blenden mit 90 ms Versatz von unten ein. Die Zahl zählt beim Eintritt hoch, sobald die Reifezeit bestätigt ist.
Platzhalter: Reifezeit in Stunden.
Das Feuer
Verhalten: Sticky über 220 vh. Der Glutschein folgt einer Sinuskurve — von 0,2 auf 0,92 Deckkraft in der Sektionsmitte, dann zurück. Dunkelster Grund der Seite (#0B0806).
Achtung: Headline nennt 90 Sekunden, die Backzeit-Kachel ist [TBD] — Widerspruch klären, siehe 1e.
Das Format
Verhalten: Sticky über 190 vh. Der große Kreis wächst von 0,62 auf 1,0 aus dem gestrichelten 28-cm-Kreis heraus; das brace-Label erscheint ab 45 % Fortschritt.
Fakten: 1.089 cm² zu 784 cm², rein rechnerisch. Keine Herstellerangabe nötig.
Mehr als Pizza
Verhalten: Sticky über 250 vh; vertikaler Scroll wird zu horizontalem Durchlauf der vier Karten. Fortschrittsbalken links unten. Auf Mobile wird daraus echtes Wischen.
Typo: italienische Begriffe in Ephesis 46 px, fiamma. Einziges dekoratives Element im Entwurf.
Die Menschen
Verhalten: Wechsel auf mozzarella #F5F0E8 als Atempause — der einzige helle Block der Startseite. Keine Scroll-Bindung, nur Einblenden.
Bewertung: als Satz gesetzt, keine Sterne-Grafik, kein Google-Widget. Kein Porträt von Herrn Guerra — dafür braucht es ein echtes Foto, kein generiertes.
Der Abschluss
Verhalten: statisch. Der heutige Tag wird zur Laufzeit hervorgehoben (brace-Fläche, linke Kante), der Live-Status im Header wird aus derselben Logik gespeist.
Platzhalter: Mindestbestellwert, Liefergebiet, Sitzplätze, Kartenausschnitt.
Speisekarte — Desktop (Artboard 8)
Heller Modus · sticky Kategorie-Navigation · SEO-Seite, kein PDF-ErsatzAlles aus dem Holzofen.
Pizza im Format 33 × 33, napoletanisches Repertoire und das, was in Leverkusen sonst niemand macht. Fünfzehn Kategorien, eine Seite.
Insalate
2 GerichtePizza 33x33
33 cm Durchmesser · 6 Gerichte
Weiße Pizza 33x33
Ohne Tomate · 2 GerichtePizza Fritta
Frittiert, nicht gebacken
Pasta
2 GerichteCalzone
Panuozzo
aus GragnanoFritti
Bambini
Dolce
Getränke · Wein · Ital. Bier · Kaffee und Digestif
Vier Kategorien, im Entwurf als Blockskizze. Aufbau identisch zu den Speisen: Name, Größe, Preis rechtsbündig. Sortiment und Preise [TBD].
Mobile — Artboard 13, 14, 15, 17, 18
390 px · Tap-Targets ab 48 px · kein Scroll-Jacking · Telefon immer als tel:-Link
Startseite Mobile
Alle sieben Szenen als eine lange Ansicht, ohne Pinning. Szene 4 gestapelt, Szene 5 echtes Wischen. Animationen nur Einblenden, respektieren prefers-reduced-motion.
Speisekarte Mobile
Kategorien als horizontal scrollende Chip-Leiste, sticky unter dem Header. Aktive Kategorie in brace. Fotos nur bei ausgewählten Gerichten.
Bestellen Mobile
Lieferung oder Abholung als Segmented Control, PLZ-Check, Öffnungsstatus aus der Uhrzeit-Logik. Telefonbestellung als eigener CTA, nicht als Fußnote.
Navigations-Overlay
Vollbild, geöffneter Zustand. Vier Ziele in Display-Serif, Zeilen 64 px hoch. Öffnungsstatus und Telefonnummer bleiben im Overlay erreichbar.
Sticky Action Bar
Fixiert am unteren Rand über allen Seiten, 64 px hoch, sitzt über dem Home-Indicator. Drei gleich breite Ziele à 124 px. „Anrufen“ ist immer ein tel:-Link, außerhalb der Öffnungszeiten deaktiviert; „Bestellen“ wird dann zu „Vorbestellen“.
Offene Punkte
Alles, was vor dem Livegang vom Kunden kommen mussAlle Fotos im Entwurf sind generierte Platzhalter, keine Aufnahmen dieses Ladens. Für den Livegang braucht es echte Bilder — sonst sind es Werbeaussagen über ein Produkt, das so nicht existiert. Ein Porträt von Herrn Guerra habe ich bewusst nicht erzeugt.
Name, Adresse, Telefonnummer, Öffnungszeiten inklusive Ruhetag, Abholung ab 13 Uhr, Kategorienliste, Inhaber, sowie die Preise Marinara 10,90 €, Diavolo 13,90 €, Parma 14,90 €, Gnocchi alla Sorrentina 15,90 €, Panzerotto 7,90 €. Die Flächenrechnung 1.089 zu 784 cm² ist reine Arithmetik aus 33 und 28 cm.