5 min read

In this article by Jamie Dean, the author of the book Mastering Unity Shaders and Effects, we will use transparent shaders and atmospheric effects to present the volatile conditions of the planet, Ridley VI, from the surface. In this article, we will cover the following topics:

  • Exploring the difference between cutout, transparent, and fade Rendering Modes
  • Implementing and adjusting Unity’s fog effect in the scene

(For more resources related to this topic, see here.)

Creating the dust cloud material

The surface of Ridley VI is made inhospitable by dangerous nitrogen storms. In our game scene, these are represented by dust cloud planes situated near the surface.

We need to set up the materials for these clouds with the following steps:

  1. In the Project panel, click on the PACKT_Materials folder to view its contents in the Assets panel.

  2. In the Assets panel, right-click on an empty area and choose Create| Material.

  3. Rename the material dustCloud.

  4. In the Hierarchy panel, click to select the dustcloud object.

    The object’s properties will appear in the Inspector.

  5. Drag the dustCloud material from the Assets panel onto the Materials field in the Mesh Renderer property visible in the Inspector.

    Next, we will set the texture map of the material.

  6. Reselect the dustCloud material by clicking on it in the Assets panel.

  7. Lock the Inspector by clicking on the small lock icon on the top-right corner of the panel.

    Locking the Inspector allows you to maintain the focus on assets while you are hooking up an associated asset in your project.

  8. In the Project panel, click on the PACKT_Textures folder.

  9. Locate the strato texture map and drag it into the dustCloud material’s Albedo texture slot in the Inspector.

    The texture map contains four atlassed variations of the cloud effect. We need to adjust how much of the whole texture is shown in the material.

  10. In the Inspector, set the Tiling Y value to 0.25.

    This will ensure that only a quarter of the complete height of the texture will be used in the material.

    The texture map also contains opacity data. To use this in our material, we need to adjust the Rendering Mode.

    The Rendering Mode of Standard Shader allows us to specify the opaque nature of a surface.

    Most often, scene objects are Opaque. Objects behind them are blocked by them and are not visible through their surface.

    The next option is Cutout. This is used for surfaces containing areas of full opacity and full transparency, such as leaves on a tree or a chain link fence. The opacity is basically on or off for each pixel in a texture.

    Fade allows objects to have cutout areas where there are completely transparent and partially transparent pixels.

    The Transparent option is suitable for truly transparent surfaces such as windows, glass, and some types of plastic. When specular is used with a transparent material, it is applied over the whole surface, making it unsuitable for cutout effects.

    Comparison of Standard Shader transparency types

    The Fade Rendering Mode is the best option for our dustCloud material as we want the cloud objects to be cutout so that the edges of the quad where the material is applied to is not visible. We want the surface to be partially transparent so that other dustcloud quads are visible behind them, blending the effect.

  11. At the top of the material properties in the Inspector, click on the Rendering Mode drop-down menu and set it to Fade:

    Transparent dustCloud material applied

    The dust clouds should now be visible with their opacity reading correctly as shown in the preceding figure.

    In the next step, we will add some further environmental effects to the scene.

Adding fog to the scene

In this step, we will add fog to the scene. Fog can be set to fade out distant background elements to reduce the amount of scenery that needs to be rendered. It can be colored, allowing us to blend elements together and give our scene some depth.

  1. If the Lighting tab is not already visible in the Unity project, activate it from the menu bar by navigating to Windows | Lighting.

  2. Dock the Lighting panel if necessary.

  3. Scroll to the bottom to locate the Fog properties group.

  4. Check the checkbox next to Fog to enable it.

    You will see that fog is added to the environment in the Scene view as shown in the following figure. The default values do not quite match to what we need in the planet surface environment:

    Unity’s default fog effect

  5. Click within the color swatch next to Fog Color to define the color value.

  6. When the color picker appears over the main Unity interface, type the hexcode E8BE80FF into the Hex Color field near the bottom as shown in the following screenshot:

    Fog effect color selection

    This will define the  yellow orange color that is appropriate for our planet’s atmosphere.

  7. Set the Fog Mode to Exponential Squared to allow it to give the appearance of becoming thicker in the distance.

  8. Increase the fog by increasing the End value to 0.05:

    Adjusted fog blended with dust cloud transparencies

Our dust cloud objects are being blended with the fog as shown in the preceding image.

Summary

In this article, we took a closer look at material Rendering Modes and how transparent effects can be implemented in a scene.

We further explored the real-time environmental effects by creating dust clouds that fade in and out using atlassed textures.

We then set up an environmental fog effect using Unity’s built-in tools.

For more information on Unity shaders and effects, you can refer to the following books:

  • Unity 5.x Animation Cookbook: https://www.packtpub.com/game-development/unity-5x-animation-cookbook
  • Unity 5.x Shaders and Effects Cookbook: https://www.packtpub.com/game-development/unity-5x-shaders-and-effects-cookbook
  • Unity Shaders and Effects Cookbook: https://www.packtpub.com/game-development/unity-shaders-and-effects-cookbook

Resources for Article:


Further resources on this subject:


LEAVE A REPLY

Please enter your comment!
Please enter your name here