Hi everyone,
I’m working on a 3d model of car a that will be exported to glb format and used within a glb viewer. The completed model will include a case similar to the attached picture.
The case is by far giving me the most difficulty, the transparency itself is quite tricky to achieve without causing the glb viewer to stutter and lag. But I am at a complete loss as to how to achieve the reflection of the car onto the case.
Any tips or help on how to create that case material is more than welcome.
The glTF format has a couple ways to define transparent materials, equivalent to Alpha Blending or Transmission in the Principled BSDF material. Transmission gives better reflections (and, optionally, refraction) but is far slower for a realtime viewer to render.
With either of those options, which parts of the scene can be shown in reflections is determined by the 3D viewer’s capabilities and not by the glTF asset or the material. Two ideas to consider:
If the viewer allows you to select an IBL / environment map, that should give nice reflections (though not reflections of the model itself, just a surrounding environment).
If the viewer has a way to enable “screen space reflections” (typically a post-processing effect) that might provide some more convincing reflections of the car itself. See the three.js SSR demo for an example of the effect in a realtime web viewer, or Sketchfab’s SSR blog post for another.