Hello everyone welcome back to the channel. In today's video we will create this "Starry Night" effect using Shader graph. This will be the follow-up video of my previous how to create Skybox video. If you haven't seen it, link is in the description below check it out! I am using Unity version 2022, but it will work on any Unity LTS versions. From last time, we have our project in URP, we have our Skybox Shader graph, we have assigned our Skybox material and for this one we will need a post processing volume with the modules "Bloom" and the "Tone mapping" with the mode "Aces". The rest is up to your preference. With those things out of
the way let's get started. Okay, we can modify our Skybox Shader graph but it would become a mess. So to keep things a bit simple and readable let's create a sub graph Think of subgraph as a method or function of our script. We can use them as a node in other Shader graphs and it can be used for reusability of our logic or to keep things simple Terrible description but all right. So let's create the sub graph right click > create > shader graph and subgraph Let's call it StarSubGraph. and double click to open it. Sub graph is different from Shader graph in a sense that it does not have a master node, instead it will contain the output node and the properties of our sub graph will act as an input ports. Let's leave the output node alone for the time being and create a simple noise now we want to control the scale from the inspector so let's create a float property call it StarHeight Give a default value of something like 100 so we can see the preview better assign it to our scale. It would be best to have an actual star texture for real life star constellations but I was unable to create one myself. I also tried using Voronoi but it looks too uniform so we will use our noise as our Stars. Take its output and feed it into Power node. What power node does is, it will just perform mathematical power operation but in this context it will just darkens the value which are less than 1 as we increase the power and we want to control this power so let's create another float property I'll just duplicate this one call it StarPower, how original! Give a default value of something like 15. drag that in and feed it into the power then we will take this output and multiply it with the color set the mode HDR give color of your liking and set the intensity really really high and feed its output into the output node. Select our output node get back here in the node settings and give a proper name here so let's give it Stars. Save. Head back into our Skybox shader graph drag our sub graph here notice our created properties have become input ports so we will create those two properties here and feed them in Now if we are creating outer space scene then we can directly add this with our final Add here but it's not the case here so let me take this output and multiply it with our sky part, so multiply with this clamp node then add it with our final output save our graph Head back into the scene view adjust our star height and power and we have stars That's it from me and I will see you guys in the next one Only if life was this easy.... We have an issue here notice that as we look towards the sides we have this weird stretching going on see The reason is we are trying to apply our texture on our Skybox from the XY plane and the Skybox is a spherical surface area so this will wrap around our Skybox and from the front perspective it will apply perfectly but gets stretched from the edges of our Skybox. In order to fix that We will tell Unity two things. First apply our texture from the XZ plane so XZ plane and Second don't wrap around it otherwise we will get that stretching on the horizon part. Based on our theory we need to calculate the UVs to do that we need axes information for that we can copy these nodes from our Skybox shader graph In our sub graph let's paste them. The UVs are essentially Vector2 with the component X and Y. We need X and Z so we will just take them from the Split node here so let's just create a Vector2. Grab the X and Z so that's our first step done. Now we need to tell Unity to not wrap our texture, instead we want to keep it flat just like this grid. So we will divide this with our Y here. Put this one into our UV Let me just focus on it detach our with StarHeight just so we can visualize see what is happening all right now back in our Skybox shader we are already calculating axes data here so let's directly feed it instead of duplicating so back into our sub graph let's create the Vector3 property call it NormalizedAxes I'm just giving default here so it won't break the preview then drag it in. We don't need these two so delete, and feed this one into our Split node. Save, back into our Skybox shader graph we will take the normalized axis and feed it here okay so we no longer have that weird stretching going on but right now our stars are uniform in terms of color, in real life they shine in different colors. So in the sub graph create a gradient node assign color of your liking and remember to keep the intensity very high. Then select the mode fixed, then to work with the gradient we need sample gradient node, so here. It has a Time, which has
a valid range from 0 to 1. If we pass 0 it will take the color from the very left of our gradient, if we pass 1 it will take the color from the very right and everything in between I want only these colors and not the blended ones hence I chose mode fixed but it's a personal preference. We want random colors so let's create a random range node. It will generate value between 0 and 1 based on the Seed. Let's take our simple noise and feed it into the seed and this one into our time. Let me just disconnect these from the UV so we can actually see the preview. It has created colorized pixels. okay let me just reattach. We cannot expose gradient in Shader graph as of now, April 2023. Hopefully in the future... Unity, please... Okay so we cannot access gradient in the inspector, however I still want to access the intensity so let's create a float property call it Startensity. Give a default value of something like 50 drag this in and then we will multiply it with the sample gradient and we no longer need this color so delete it. and feed this multiply into this multiply. Save our sub graph, head back into our Skybox shader graph, we will create the property for this StarIntensity here StarIntensity Give a default of 50. Drag this one and feed it here. The Skybox graph will look something like this at the end. Save our shader graph, head back into our scene view, adjust our material and we have sparkling Stars. That's it for the video with this knowledge you guys can create Moon, Sun, mix this with scrolling texture from the Fire Shader Video and we can even make clouds. Now it's time for you guys to experiment. If you find the video helpful consider like share and subscribe. If you have any questions post them in the comments. That's it from me for real this time and I will see you guys in the next one
