Heat air refractive post-effect

Hola fellas, today I’m gonna introduce you my implementation of refractive effect caused by high temperature.

Take a look at this bears. The right one is pretty hot, huh?

Demo project - https://playcanvas.com/project/546676/

So if your scene has things as hot as this bear, you need this post-effect to be used by your camera.

Firstly, clone the repo and add files to your assets.

Then, add script component to your active camera and choose refractiveEffect.

image

There are default settings, I guess it’s okay to start. The only thing you have to set is Refractive Map. Select texture from repo.

image

You’re brilliant! We got so far!

Now we have to add some primitives to our scene. They will refract it.

And add heat-air tag to them. You can change it in script’s options, by the way.

image

And that’s all!
Since now you have to be very happy, aren’t you?

Also, this effect has build-in blur and you can configure it by options. Or just turn it off.

To be honest, now this effect is not really good for performance, because it renders the whole scene twice (regular render and masked) but I’ll optimize it. When time will come.

If you have any suggestions about that, please tell me.

Best Regards,
Mike.

3 Likes