- Home /
How do I implement 2 sided transparent objects (especially for WebGL)?
Hello,
I have a problem that can be broken into 3 parts so let's start from the top:
I have in my scene a window (with transparent glass made of 2 single-side polygons) and a curtain in front of it with a transparent fabric (2-sided material). I am well aware that transparent objects are not sorted "right" in Unity for performance sake. I want to try to write a shader with the Z Depth Check thingy (excuse me if I'm wrong I have 0 experience in writing shaders) because the scene can be rotated (and thus looking into the room from the window through the curtain) so just playing with the queue is not enough. So How do I change the standard shader or better yet, since I'm using UBER how can I duplicate or change the standard 2-sided shader which the curtain is using. I have downloaded the builtin shaders zip but I have no idea where to begin.
Any other idea (or plugin) that can sort it out could also be useful. I really try to wrap my head to find a simple solution that could also run on WebGL without hitting performance too much because on WebGL it looks much much much worse than standalone.
And lastly, maybe I'm attacking the problem from the wrong angle and I'll be happy to see other solutions as long as the semi-transparent curtain lays in front of the window with clear glass. Light should pass (not necessarily realistically) through the fabric and the fabric itself is a "static" object (we don't simulate cloth physics or moving it or anything) but it is NOT opaque whatsoever. Maybe there's some technique to determine under what situations the depth miscalculation will always happen?
Thanks ahead. Also, we're using Unity 2017.3 and 2017.4 only caused us more problems than it solves and 2018 doesn't support Uber so right now 2017.3 is the most stable platform for our usage.