Animated Light Cookie Shader (Cloud & Tree Shadows)

In this post I'm going to show you how to make a RenderTexture shader that you can use as an animated light cookie.



Custom Render Texture

Create a new Custom RenderTexture. (Create > Custom Render Texture)

We use Custom Render Texture instead of a regular Render Texture because it has a few more options. It lets you attach a material to it.

Make sure the texture is big enough, I'm going for 1024 x 1024, and attach it to the Cookie part of your scenes Directional Light

Your scene will go dark, because nothing is written to the texture yet.



Base Custom Render Texture Shader

Now we get to the fun part, writing a shader for the render texture

 Unity provides a basic shader(PasteBin Link) in the manual for Custom Render Textures. As you can see, it has an include cginc file, this contains some nice helpers to write our shader.

 Create a new Material out of this shader, and add it into the Custom Render Texture, in the Material slot. Make sure the Update Mode is set to Realtime 

The lighting has returned to the scene.

This base shader can be used for all sorts of pixel based effects, but for now we're just going to make some noise/pattern textures that scroll over eachother, like I do in half my shaders :D

NOTE: If you don't see your realtime shadows anymore after adding the Cookie and you're using forward rendering, make sure your shader has "fullforwardshadows" support.



Clouds Effect

Add in some scrolling controls, 2 noise/pattern samples put together. Then smoothstep through the noise, with controls for how sharp the edges are.

For some more depth, add in a second layer in the same way, only on a smaller texture coord map. and make it move slower, so this layer looks further away. Add to the first layer, and clamp the value so it stays in a good range.

Scaling

So currently the clouds are showing up way too small, and there are no scaling options in the shader. 

The cookie texture is projected from the directional light, scaling in the shader can show the seams. Instead scale the cookie size in the light settings

I set mine to 200 for this small scene

Much better!



Tree Shadow Effect

This is just a tiny edit, all we need to do is set the Time to use a sine wave instead of linear.

I've turned the cookie size down again, to 50.

Add some post processing and stretched particles and you get a nice forest scene!

Shader Code: Pastebin Link 

Material Settings Clouds:

Material Settings Trees:

More info on Custom Render Textures 

Have fun!

Become a patron to

115
Unlock 115 exclusive posts
Be part of the community
Connect via private message