02 · Collection
Zehn Objekte.
Kein Rand.
Ziehe die Fläche in jede Richtung. Ein Klick auf ein Objekt öffnet es – mit 360°-Ansicht.
FX-012 · Infinite Spatial Canvas Die Kollektion als endlose Fläche: ziehen, schleudern, die Fläche kippt in Zugrichtung, Objekte nahe der Mitte rücken nach vorn.
Pointer Events mit Trägheit · Modulo-Wrap · CSS 3D-Transforms
Im Motion Lab ansehen
Pointer Events mit Trägheit · Modulo-Wrap · CSS 3D-Transforms
Im Motion Lab ansehen
Aufnahmen werden geladen …
- Material
- Maße
FX-006 · FLIP Layout Morph Ein Produkt wächst aus der Fläche nahtlos in seine Detailansicht – und kehrt beim Schließen an seinen Platz zurück.
View Transitions API (gleiches Dokument) · FLIP mit Web Animations API als Fallback
Im Motion Lab ansehen
View Transitions API (gleiches Dokument) · FLIP mit Web Animations API als Fallback
Im Motion Lab ansehen
FX-009 · Photographic 360° Viewer Jedes Möbel als fotografischer Drehteller: 60 Einzelbilder aus einem KI-Video, dessen Start- und Endbild das Produktfoto ist – der Kreis schließt sich nahtlos. Ziehen dreht mit Trägheit.
Canvas 2D · Pointer Events · progressives Laden (grobes Raster zuerst) · Seedance 2.5 (Start = Endbild)
Im Motion Lab ansehen
Canvas 2D · Pointer Events · progressives Laden (grobes Raster zuerst) · Seedance 2.5 (Start = Endbild)
Im Motion Lab ansehen
FX-011 · Material Shift Der Bezug wechselt nicht schlagartig: Eine leuchtende Naht wandert von unten nach oben über das Foto und hinterlässt das neue Material – fotografische Varianten in identischer Perspektive.
CSS mask-image · requestAnimationFrame · Ideogram 4.5 Precise Edit (Varianten)
Im Motion Lab ansehen
CSS mask-image · requestAnimationFrame · Ideogram 4.5 Precise Edit (Varianten)
Im Motion Lab ansehen
360°-Ansicht: 60 Einzelbilder aus einem Seedance-2.5-Drehteller-Video (KI-generiert, keine Echtzeit-3D). Bezüge: fotografische Varianten in identischer Perspektive.
Penna · Skulpturleuchte
Aus Licht
zusammengesetzt.
Scrolle: Penna zerfällt in Lichtpunkte – und findet zurück in ihre Form.
FX-019 · Particle Reconstruction Penna zerfällt in bis zu 90.000 Lichtpunkte, die exakt auf der Oberfläche des 3D-Modells liegen, und setzt sich wieder zusammen – zur fotografischen Aufnahme der leuchtenden Leuchte.
MeshSurfaceSampler · TSL-Vertex-Shader · Additive Blending · deckungsgleiches Nachtfoto (Ideogram 4.5 Precise Edit)
Im Motion Lab ansehen
MeshSurfaceSampler · TSL-Vertex-Shader · Additive Blending · deckungsgleiches Nachtfoto (Ideogram 4.5 Precise Edit)
Im Motion Lab ansehen
FX-010 · Light Studio Fotografisches Relighting: Zwei deckungsgleiche Aufnahmen (Leuchte aus/an) werden im linearen Farbraum addiert. Dimmer und Farbtemperatur 2200–4000 K bleiben dadurch fotorealistisch; Dimmen wird wärmer wie bei einer Glühlampe.
Three.js WebGPURenderer / WebGL2 · TSL-Shader (lineare Lichtaddition) · Fotos: Magnific Seedream 5 Pro + Ideogram 4.5 Precise Edit
Im Motion Lab ansehen
Three.js WebGPURenderer / WebGL2 · TSL-Shader (lineare Lichtaddition) · Fotos: Magnific Seedream 5 Pro + Ideogram 4.5 Precise Edit
Im Motion Lab ansehen
Lichtstudio
Du hältst
das Licht.
Ziehe über das Bild: nach oben heller, nach links wärmer. Mit der Tastatur: Bild fokussieren, dann Pfeiltasten.