Home and Learn: Games Programming Course
Add a Skybox and Fog to a Unity Game
Our scene from previous lessons is looking a little bright and sunny for a graveyard with zombies. It would be better if we could have a nighttime scene, and then add a little fog. Let's see how to do that.
Skyboxes in Unity 3D
A skybox is basically a large cube or sphere that surrounds your game world. This cube/sphere has textures or images mapped onto its inner surfaces to depict skies, distant landscapes, or other unreachable areas. This gives players the impression of being in a much larger world than the actual playable area. Skyboxes are a powerful tool for setting the mood and atmosphere of a game.
By default, Unity 3D gives you a ready-made Skybox. But you can change this to any other Skybox you may have. There are loads of free sky boxes on the Unity Assets store. There are even two in the Starter Assets you downloaded at the start of these lessons. Have a look in this location:
Assets/StarterAssets/Environment/Art/Skybox
You should see this:
The two sky boxes are called SkyboxLite and SkyboxLiteWarm. Click on each of them and you'll see, in the Inspector on the right, that they are both materials. Notice that the Shader at the top is Skybox/Procedural:
To add a skybox to your scene, you need to access the Lighting tabs. So, from the menus at the top of Unity, select Window > Rendering > Lighting. Or hold down the CTRL key on your keyboard and the hit the number 9 key. You should see this panel appear:
Click on the Environment tab at the top to see this:
Notice the Skybox Material slot at the top. It's set to the Default Skybox. You can change this to a skybox of your choosing. You can drag and drop a skybox from the project folders at the bottom of Unity. Or click the small circle indicated by the red arrow in the image above. You'll see the Select Material dialog box appear. Locate the SkyboxLite or SkyboxLiteWarm from the list:
(If the Lighting tabs are getting in your way, you can dock them next to the Inspector on the right. Just hold down your mouse button on the second Lighting in the top left of the Lighting tabs. Drag to where the Inspector is.)
Here's what the SkyboxLiteWarm skybox looks like in the scene:
It's still a bit bright, though. Let's download a darker one. (You may have noticed a fog section on the Environment tab. We'll get to that in a moment.)
There's a great free skybox collection in the Unity Asset Store (Window > Assets Store). It's called Skybox Series Free and it's by Avinox. The page is here:
https://assetstore.unity.com/packages/2d/textures-materials/sky/skybox-series-free-103633
Add the asset and it will open the Package Manager in Unity. Download the pack (it's quite large in size) and then import it into your project. You should see a folder called SkySeries Freebie in the Projects area of Unity, once it has finished importing:
These are all materials.
Go back to your Lighting > Environment tab. Select a skybox from this folder. We went for Dark Storm. It looks like this when the game is played:
Create a Skybox from an HDR image
There is also a folder of HDR images you can turn into a skybox. Look inside the FreebieHdri folder to see the following:
Because they are HDR images, you need to create a new material for yourself and then add the HDR to the material. Let's see how it's done.
To create a material, first create a folder for yourself in the Projects area of Unity. (Right click the Assets folder and select Create > Folder.) Right click inside of your new folder. From the menu that appears in Unity 6, select Create > Material. Your new material will be a grey ball:
With your Material selected, if you look at the Inspector on the right, you'll see that it's using the default Shader, Universal Render Pipeline/Lit:
Click the dropdown for the shader and you'll see a list of other available shaders:
Notice there is a shader on the list called Skybox. Select that option and you'll see a list of different skybox shaders you can set up:
The one that works for us, as we're using the Universal Render Pipeline, is the Cubemap option. Select that shader. Now click the Cubemap (HDR) box:
When you click the Select box indicated by the red arrow in the image above, you'll be able to select the HDR you want:
Now go back to your Lighting > Environment tab. Drag and drop your new material into the Skybox Material slot:
Adding Fog
Stay on the Environment tab. Notice the Fog option at the bottom:
Put a check on the box to the right of Fog. You'll immediately see your Scene change:
You can change the color of your fog. Play around with the color box to see what happens.
The default fog is a Linear fog, with a Start of 0 and an End of 40. The Start is how far away from the camera the fog will start. An end of 40 means that objects farther away than that will be obscured. If you want a light fog, go for low value for the start and a high value for the end, 10 and 100, for example.
The Mode dropdown can be switched to one of three values:
Linear
Exponential
Exponential Squared
All three modes are to do with the way fog accumulates with distance. With the last two modes, Exponential and Exponential Squared, you get a Density slider to play around with:
The fog you can create on the Environment tab is a very basic. For a more realistic fog, you can add a particle system and play around with the many settings. But this would be too involved for us at this stage.
If we had created our project using the High Definition Render Pipeline, we could have added Volumetric Fog, which would have given us an even better foggy scene.
You can switch the fog off, though, if you don't like it. Just uncheck the fog box on the Environment tab.
But we'll move on. Lighting is a huge topic in game creation, and we haven't even scratched the surface here. We may come back to it in a later lesson. For now, let's get the zombie attacking the player and causing damage.
<--Back to the Unity 3D Course Contents Page