Getting the most out of your clouds!

So you got some cloud sprites and you figure you’ll just casually scroll them across the screen. Well, let me ask you one question:

Would Steve Jobs casually scroll clouds across the screen???

I rest my case. Here’s how to add some ‘je ne sais quoi’ to your boring scrolling clouds:

For starters, here are my clouds:

and my eye-popping background:


If you think about any object that moves, the further away it is, the slower it moves, and the fainter the object’s color. Surprisingly, the same is true for clouds. With this in mind, we can start by assigning a scroll speed to each cloud, then assign an alpha value to it’s sprite’s color, based upon the speed. I’ve experimented in the scene view in Unity, and I like an alpha range of 0.15 to 0.85, and a scroll speed range of 0.001 to 0.02.

Assigning the speed is easy:

Then, the alpha based upon the speed:

Great! So when to use these methods? Logically, when the cloud passes out of the cameras view. When this happens, the sprite needs to be reset at the other side of the screen, and then the methods run. Luckily, we have this beaut: MonoBehaviour.OnBecameInvisible()

At the moment the cloud fully scrolls offscreen, this baby is run, and we perform our logic. So simple!

Now, if these tweaks aren’t enough, just let your creativity fly and play with Unity’s abundant features. You could:

Flip it! (In the style of Queen)

or maybe…Size it!

or howbout…Color it!

This one was a little tricky. As you can see, I’m assigning the the same value to r, b, and g. This effectively adjusts the grayscale, which is what we want, because clouds are grayscale. You could definitely get a sunset effect going if you want, just play with the color in Unity’s editor.
Also, I experimented again in the scene view to find the 0.7 and 1.0 float values.

Leave a Reply

Your email address will not be published. Required fields are marked *