Is it possible to place a glass window on a wall?

I have an example playground here Babylon.js Playground
What I’m trying to do is have a glass window over a wall but to ignore the wall material so its essentially making a hole in the wall, then you can see the sphere behind it.
I’m trying to avoid changing the wall mesh (like using CSG to make a hole) so I’m wondering if its possible to do this by manipulating the materials.

You can have the wall use multiple materials. One primitive (the outer wall) may have the wall material assigned, while the window may have your glass/volume material. Otherwise they can also be multiple overlapping meshes for your wall (with hole in geometry for the window), and the window itself.

Though if you can’t change your wall mesh, you’re somewhat limited to difference your wall from your window using CSG to make a hole for your window.

@PatrickRyan may have other ideas as well.

This may help:


@ozRocker, I think the examples from @Evgeni_Popov above are probably what you want. I wanted to point out a couple of other concerns with transparency and meshes. You can certainly achieve something like this with a simple alpha:

This technique has a texture that looks like this:

in a node material that uses it for lerping between alpha values, base color values, and roughness values. If you wanted to intersect a frame for the window with your wall, you could use this technique to scale/offset the alpha to the location you need within your wall, which would give you the “pane of glass” for free. That would take some planning on the part of your UVs, but there are also some tradeoffs.

The first is that your wall would need to be using alpha blend and would need a depth prepass so that it orders correctly in Z. Without the depth prepass, you will see artifacts like this:

when you have front faces pointing the same direction at different depths or try to disable backface culling on simple objects. The depth prepass will also make using double sided materials impossible if that matters. There is also cost with placing objects into the transparent queue in engine since it will draw everything behind the object and then draw the transparent object, even if a majority of the pixels in the transparent object are opaque (opacity value of 1.0).

This trick utilizes our specular over alpha feature combined with alpha transparency to render environment reflections to simulate a glass surface. Refraction is another story, as you will need a probe to render the other meshes behind the glass to create a cube map to feed the refraction, but it can be done.

In any case, you can see this technique in this playground with a custom node material driving the technique. Let me know if you have questions about this approach. It may not be the right one for you, but I wanted to help you think outside the box a bit… pun intended.


Thank you my friend! This works perfectly for my needs because I do not have to mess with the properties of the wall

1 Like