ROLEX Reseller
Design-Guide zum Konzept einer Luxus-Uhren-Landingpage: ein WebGL-Shader-Hero, gefolgt von einer scroll-gesteuerten 360°-Zerlegung einer Uhr in Einzelteile mit begleitenden Info-Karten.
Live Seite ansehen →Sie sehen gerade einen Platzhalterinhalt von YouTube. Um auf den eigentlichen Inhalt zuzugreifen, klicken Sie auf die Schaltfläche unten. Bitte beachten Sie, dass dabei Daten an Drittanbieter weitergegeben werden.
Projekt & Anforderungen
Was das Konzept leisten muss, für wen es gebaut ist und welche Haltung dahintersteckt.
Projektziel
Uhrmacher-Handwerk digital erlebbar machen: statt eines Produktfotos wird die Uhr beim Scrollen buchstäblich in ihre Einzelteile zerlegt und jedes Bauteil einzeln erklärt.
Zielgruppe
Anspruchsvolle Käufer/Sammler, die Materialqualität und Prazision prüfen wollen, bevor sie in ein Reseller-Angebot vertrauen — Detailtiefe schafft Glaubwürdigkeit.
Design-Philosophie
Zurückhaltendes Schwarz-Gold auf Editorial-Niveau: viel Schwarzraum, dünne Goldlinien, Playfair-Display-Serifen — nichts blinkt, alles wirkt verdient statt beworben.
Design-Gedanken zum Konzept
Scroll-gesteuerte 360°-Zerlegung als Herzstück: Eine 600vh hohe Sticky-Sektion spielt eine 240-Bilder-Sequenz der Uhr ab, synchron zur Scroll-Position. Während sich die Uhr öffnet, poppen an vier Seiten Info-Karten zu Saphirglas, Lünette, Zifferblatt, Rotor und Werk auf — das Gefühl, eine Uhr wirklich auseinanderzunehmen, statt nur Text neben einem Foto zu lesen.
WebGL-Shader statt Foto im Hero: Ein prozedural gerenderter Gold-Schimmer-Shader ersetzt ein Stock-Hintergrundbild — bewegte, nie exakt wiederholende Textur, die Materialwertigkeit suggeriert, ohne Ladezeit für ein Video zu kosten.
Editorial-Typografie: Playfair Display in Kursiv für Zitat und Produktnamen erzeugt den Ton eines Auktionskatalogs statt eines Webshops — passend zum Reseller-Kontext, wo Vertrauen wichtiger ist als Rabatt-Lautstärke.
Farbgebung
Fast-Schwarz als Basis, ein einziger warmer Goldton als durchgängiger Akzent — keine zweite Farbe, um die Exklusivität nicht zu verwässern.
Bildwelt
Freigestellte Produktfotos je Referenz (Submariner, Daytona, Datejust) mit selbstgezeichnetem Inline-SVG-Platzhalter, solange kein Foto geladen ist.
Typografie
Live-Seite: Playfair Display (Display/Zitate) & Lato (Fließtext/UI) über Google Fonts. Dieser Guide selbst rendert mit System-Font-Stack, um ohne Drittanbieter-Requests auszukommen.
Interaktionskonzept
Scroll-gekoppelte Bildsequenz mit Info-Karten, hochzählende Kennzahlen, Endlos-Ticker und eine vertikale Heritage-Zeitleiste.
Farbpalette
Fast-Schwarz als Buehne, ein einziger Goldton als Marke — bewusst keine zweite Akzentfarbe.
Markenfarbe
Fast-Schwarz gibt jedem Bauteil-Detail und jedem Goldakzent maximalen Kontrastraum — das Produkt bekommt die Bühne, nicht das Interface.
Der eine Akzent
Gold ist die einzige Farbe im gesamten Interface — sie steht für Uhrengehäuse, Cerachrom- Lünette und Rotor gleichermaßen und wirkt dadurch wie ein Markenzeichen, nicht wie Dekoration.
Zurückhaltung
Grau bleibt bewusst unauffällig für Zuschreibungen und Footer-Links — nichts konkurriert mit Gold um Aufmerksamkeit.
Typografie
Auf der Live-Seite trägt Playfair Display Zitate, Produktnamen und Headlines, Lato den Fließtext und die UI. Dieser Guide selbst rendert mit System-Font-Stack.
Die archetypische Taucheruhr seit 1953. Wasserdicht bis 300 Meter, mit Cerachrom-Lünette und leuchtenden Anzeigen.
UI-Komponenten
Wiederverwendbare Bausteine aus der Live-Seite.
Der Goldschimmer entsteht prozedural per Shader-Code, nicht aus einer Bilddatei — deshalb bewegt er sich endlos, ohne sich sichtbar zu wiederholen, und bleibt bei jeder Bildschirmgröße scharf.
Synthetisches Saphirglas, das fast so hart ist wie Diamant. Entspiegelt für maximale Ablesbarkeit bei jedem Licht.