Our client's product pages needed a step up in visual quality. We built both the conversion pipeline that transforms Rhino CAD files into web-ready 3D models, and the high-fidelity Three.js viewer that presents them to customers.
The existing web experience displayed jewelry with basic WebGL fidelity — flat, unrealistic, and unconvincing for fine jewelry. The underlying Rhino .3dm CAD files were not in a web-compatible format, and no automated path existed to convert them. Customers browsing made-to-order rings were making purchase decisions based on a low-quality visual representation.
Two connected systems: a batch conversion pipeline that processes Rhino files into production-ready .glb format, and a high-fidelity Three.js viewer that delivers an interactive 3D experience — including real-time turntable animation, multiple lighting environments, a custom gemstone shader and a material adjustment tool for internal use.
- Automated Rhino .3dm → .glb pipeline: geometry cleanup, material handling, decimation, batch processing
- High-fidelity real-time rendering: gemstones, metals, and prong detail rendered accurately in the browser
- Interactive rotation, zoom, and turntable animation
- Lighting presets and environment presets
- SD/HD quality modes to support different devices; composition effects including glare, tone-mapping, and contrast
- Material adjustment tool: part selection, material reassignment, real-time visualization, save/load as JSON
Customers now interact with photorealistic 3D models of their configured rings directly in the browser — before the physical product exists. The conversion pipeline processes the full CAD library automatically, with no manual per-file work.