Posts
Search
Contact
Cookies
About
RSS

Animating sky with raylib

Added 25 Sep 2019, 3:44 p.m. edited 18 Jun 2023, 5:52 p.m.

There are a number of ways to provide a sky scene with raylib, common solutions involve using either a sky dome, or a cubic map on a sky box. However when it comes to simple animating techniques (such as scrolling the texture) you'll often see the texture moving in odd ways, typically if the clouds are moving south to north, looking west or east the clouds will appear to be moving in a curve.

A simple way around this (and never forget the KISS principle) is to use a simple plane for the sky. You then have the obvious problem of a big square in the sky, this is easily solved by having an open ended cylinder on which you can display for example a mountain range

Now I'm no artist, so don't expect miracles (you'll see what I mean when you look at my mashed together mountains)

There are two shaders in use this time, however its exactly the same techniques used in the previous post, the sky is simply scrolling the texture, and the "sky" part of the mountain texture is discarded so you can see the sky plane behind it. This does mean the plane has to be larger than you'd expect so you can't see the edge through the mountains, however it does give quite a good effect.

If you want to source another cloud texture, you should avoid textures that shows any kind of perspective, I found a good source for this was cloudy ocean views of the sea from the ISS... you're looking straight down at clouds obscuring a nice blue surface. Obviously as its a scrolling texture you'll need to ensure that you tile it seamlessly...

Another thing to note is both shader programs use exactly the same vertex shader, and both the fragment shaders are really very simple. They're so simple the code really does speak for itself...

While I have just used a simple plane for the ground, using an actual terrain will greatly enhance the overall effect. At any rate you should have enough here to make a start with.

Taking it further

You could add a night time mode, by having a star field and gradually blending with the clouds to a mixture of both. You'll need to scroll the star field differently (slowly rotating) while the darker clouds continue as normal...

Again using the shader, you could animate a sun, by setting a position of the sun and making the texture much brighter depending how near it is to the suns position, giving the sun a maximum radius you can use the distance from the suns position and the texture coordinate, to get a graduated bright patch, which should look like the sun is behind the clouds. This looks best with an overcast cloud texture.