Question How to make a 2d pixel art shader for a glass window that shows outer space?

I want to make some glass windows in a spaceship that show outer space. Each window would have a shader that randomly generated a bunch of starts, each start changes its brightness over time (some starts can move slightly, and some standstill) and it would have a meteor occasionally. Also, it must be pixel art.

 

Hi,

This is not a "work for free" forum and your question sounds more like a description of something you need, rather than a problem/issue.

So, what have you tried so far?

 

@Olmi
I have some nodes pixelate the UV and then feed the UV to a simple noise node.


Then I have a comparison node to check if the value of each pixel of the noise is above some threshold and output it. The reason I don't use a step node is because the step node only returns either 0 or 1, but I want the exact value of each pixel so I connect the noise into the true input of the branch node.


Finally, I just multiply the final result with some color. What I want to do now is:
1. Randomly change the brightness (alpha or the whole color) of each pixel over time.
2. Once in a while, I want to have a meteor which just basically means a light trail appears and disappears over time.
I have no idea how to achieve these 2 things, do you have any idea?

 

After a while, I figured out how to make it. I just used a noise node then connect it to a smooth step node. The value of the noise node will be the intensity of the pixel's color (HDR). The intensity value you see from the color picker is calculated by this formula: [color] * 2 ^ [intensity] (e.g intensity = 0 then [color] * 2^0 = [color] * 1). I also connect the value to a lerp node to change its range from [0;1] to [minIntensity; maxIntensity]. Here's the graph:
1. Pixelate the UV like before:


2. Generate the noise:


3. Convert it to the intensity:

Here's a bit tricky: I want all the values that are greater than 0 to be greater than minIntensity, but if I just use the Lerp node then all the positions that don't have a pixel (i.e == 0) now will have one (i.e > 0) so I have to subtract the minIntensity from all the positions that are less than 0 after lerping it. Then I need to remove all the 0 from the final output and because 2^0 = 1, I just remove all the 1 from the final texture.

4. Multiply the final output with color:


Here's the final result:

 

Now what I want is:
1. Having the pixel to change intensity over time randomly.
2. Randomly have a falling start.
Something like this:

Are there any ways to achieve something like this?

 

1. You could modulate the star brightness by just moving a noise pattern over them. Or make something more intricate (like rendering actually brightening and darkening stars.)

2. This is doable too, but it might require some trickery. Might be better to do it with something else like an animated object unless you really need/want to have it in a shader.

 

2) maybe could try having that falling star with trail as a scrolling texture,
then fade it in and out, and randomizing y-offset and max transparency each time?

 

@mgear Can you be more specific about that? Can you give me an example, because I'm very new to shader?

 

@Olmi You mean changing the noise scale of the current noise that I'm using? Because if I do so, it will change the stars' position. I don't want to add or remove starts, I just want to change its intensity (the noise value) over time.

 

ive never really used shadergraph, so not sure of specific steps there..

but try making texture that looks like the falling star and trail,
overlay that texture into your shader, to see how it looks.

animate its UV offset, so it scrolls around, then try fading it in and out..
now thinking about it, it might get complicated to to make it nice..

just using dummy object with Trail renderer would be ready in few minutes
https://docs.unity3d.com/Manual/class-TrailRenderer.html

if you must have it inside single material and shader,
could render trailrenderer view into rendertexture, apply that texture to your shader..

 

@Long2904 I meant something like this on high level (not actual node or Shader Graph function names):

Overlay a noise over your stars. So you would basically just modulate the star brightness with another texture or a procedural element you create.

You could imagine this as some sort of pattern like the ancient Photoshop clouds effect (a Perlin-noise style pattern or such.) Then, overlay this noise pattern over your stars. Now when you move this noise pattern moves over the stars, it will change the intensity of the stars and make them appear as if they are blinking.

You could of course also go through the route of making something much more special (and more procedural) but overlaying something is most likely much cheaper and easier to render.

 

@Olmi Idk if I understand you correctly but what I do is I multiply my stars to a noise node. Then change the noise node scale over time by using the sine time and lerp it between some values that I want for the noise scale (i.e [500, 520], I realize that keeping the range small will make the stars looks more beautiful and realistic). It works perfectly now. Also, I can change the lerp range to randomize it a bit.

 

Ok, so I implement the falling star by having an object with a TrailRenderer and Rigidbody, then spawn it randomly, set the size relative to the pixelateAmount, and move it in a random direction. The only problem now is that I only want the object to be visible when it is on the object that has the shader. How to do it?