Getting ready

This recipe requires a new shader, which we'll be calling Transparent, and a new material (TransparentMat) so that it can be attached to an object. As this is going to be a transparent glass window, a quad or plane is perfect (GameObject | 3D Objects | Quad). We will also need several other non-transparent objects to test the effect:

In this example, we will use a PNG image file for the glass texture since it has support for an alpha channel that will be used to determine the transparency of the glass. The process of creating such an image depends on the software that you are using. However, these are the main steps that you will need to follow:

  1. Find the image of the glass you want for your windows.
  2. Open it with a photo editing software, such as GIMP or Photoshop.
  3. Select the parts of the image that you want to be semi-transparent.
  4. Create a white (full opacity) layer mask on your image.
  5. Use the selection previously made to fill the layer mask with a darker color. White is treated as fully visible, black will be treated as invisible, and grey will be somewhere in the middle.
  6. Save the image and import it into Unity.

The toy image used in this recipe is a picture of stained glass from the Meaux Cathedral in France (https://en.wikipedia.org/wiki/Stained_glass). If you have followed all of these steps, your image should look like this (RGB channels on the left, and A channel on the right):

You can also make use of the image file in provided the example code for this book in Chapter 3 Textures folder (Meaux_Vitrail.psd).

Attaching this image to the material will cause the image to show up, but we cannot see it behind the glass:

As we would like to see behind this, we can make adjustments to the shader to do exactly that.