Für Aerocycle habe ich einen webbasierten Konfigurator entwickelt, der das Rennrad fotorealistisch in jeder wählbaren Kombination aus Rahmenfarbe, Farbverlauf, Schaltgruppe (105, Ultegra, Dura-Ace) und Laufrädern zeigt. Statt auf 3D-Rendering setzt er auf ein schlankes HTML/CSS-Ebenensystem mit Masken und Blend-Modes und kommt ganz ohne externe Bibliotheken aus. Eingebunden ist er in die WordPress-Seite mit WooCommerce, sodass Kund:innen ihr Wunschrad samt Größenfinder und Live-Preis direkt in den Warenkorb legen können.
Was die Lösung ausmacht
Fotorealistisches Rendering ohne 3D-Engine: Masken- und Blend-Mode-Ebenen über einem Basisfoto
Zweifarb-Verlauf zur Laufzeit pixelweise per Canvas berechnet
Live-Preis und Warenkorb via WooCommerce-Anbindung über ein eigenes WordPress-Plugin
Größenfinder, der aus vier Angaben Rahmengröße, Lenkerbreite und Vorbaulänge ableitet
Ohne Framework und ohne externe Bibliotheken umgesetzt
