A 3D rendering of Sony headphones surrounded by dynamic particle effects and animated audio wave rings, displayed in an interactive browser-based product experience with clickable hotspots and color customization.
Most product pages want you to look at the thing and then buy the thing. Lorenz Wieseke's Sony headphones experience wants you to play with the thing, and it's a better pitch for it. Built with Webflow and Spline Design, the page drops you into a 3D scene where the headphones float in a cloud of particles. Animated audio wave rings pulse outward from the ear cups, visualizing sound as expanding geometry. You can swap colorways, trigger the microphone animation, click through interactive hotspots. The materials are convincing enough that you'll catch yourself checking for fingerprints. Shadows land where they should. Nothing feels like a shortcut.
What's technically interesting here is less about writing raw shaders and more about what's now possible when you orchestrate the right tools well. Spline handles the 3D scene, the particle systems, the material work. Webflow handles layout, scroll interactions, and the broader page logic. The result sits in a space that would've required a custom WebGL pipeline and weeks of integration work not long ago. That's worth paying attention to, whether or not it's how you'd build it yourself. The detail work on the particle environment alone, the way it frames the product without overwhelming it, shows someone who understands restraint as a design tool.
Lorenz Wieseke runs Loviz, and you can dig into the project breakdown for more info. It's worth spending a few minutes clicking through every hotspot and color option. There's craft here.
- Live Demo: https://sony-headphones.webflow.io
- Author: Lorenz Wieseke (LinkedIn, GitHub, Instagram, YouTube)