1
$\begingroup$

I have this transparent model in blender :
enter image description here

The transparent upper part is a principled BSDF with transmission :
enter image description here

However when I look at the exported .glb, I get this result using threejs GLTF viewer :
enter image description here

I suppose it's because transmission doesn't work for glb/gltf.
How can I make such transparency work as intended ?

Improve this question
$\endgroup$

1 Answer 1

Reset to default
2
$\begingroup$

glTF supports transmission, but it's a very new feature — "alpha blending" transparency is far more widely supported in most 3D engines. Assuming you're using three.js to view the exported model above, you'll need a very recent version, maybe r133+.

Blender does not yet export the volumetric properties (like refraction) associated with transmission, meaning light does not appear to bend passing through the surface. Follow glTF-Blender-IO#1646 for progress on that. In the meantime you can add refraction with tools like Gestaltor or a custom script.

Finally, realtime implementations of transmission are often limited to showing only opaque materials through the transmissive surface, unlike Blender's Cycles renderer. In Blender that means using Alpha Mode → Opaque for objects that should be visible through the transmissive surface.

More details and a demo below:

enter image description here

https://www.donmccurdy.com/2021/11/11/writing-volumetric-refraction-gltf/

Improve this answer
$\endgroup$
4
  • $\begingroup$ Thank you for the insightful answer, I imported my model in Gestaltor and see the Transmission is ticked and working, but I still can't see my bubbles inside the model. I tried finding the Blend mode in cycles and went under Material -> viewport display -> settings and i've set everything to opaque, but still got the issue. Any idea why? $\endgroup$
    – Monstar
    Commented Jun 27, 2022 at 16:12
  • $\begingroup$ Outer material should use Transmission > 0 and Alpha Mode: Opaque, inner bubbles should use Alpha Mode: Opaque and cannot use transmission. Not sure how your scene is set up but here's an example: drive.google.com/file/d/1NSflhKTfl29r1ec_jzeZCsdJXBtkOOVC/… ... note that even Blender's own Eevee and Cycles renderers differ on this support. $\endgroup$
    – Don McCurdy
    Commented Jun 27, 2022 at 16:40
  • $\begingroup$ Got it! So if I understand correctly it isn't possible to make both the outer material and the bubbles transparent ? $\endgroup$
    – Monstar
    Commented Jun 27, 2022 at 16:56
  • $\begingroup$ Right — You can set the material up that way, but I don't know of any realtime 3D engine that can render it that way today. Generally need a slower pathtracer like Cycles or three-gpu-pathtracer. $\endgroup$
    – Don McCurdy
    Commented Jun 27, 2022 at 17:48

You must log in to answer this question.

Not the answer you're looking for? Browse other questions tagged .