Getting Started

In this section, we'll walk you through setting up the Dot Matrix Shader.

1. Project Settings

Before using this asset, you need to enable Custom Depth in your project settings. To do this, go to:
Edit -> Project Settings, then search for "Custom Depth". Locate the option Custom Depth-Stencil Pass and set it to Enabled with Stencil.

2. Post-Process Volume

After enabling Custom Depth, the next step is to add a Post Process Volume to your scene. Alternatively, you can use an actor with a Post-Process Component.

Make sure to check the Infinite Extent option to apply the effect globally.

3. Adding Materials

Now, select your Post Process Component and search for "Materials" in the Details panel. You'll see an empty list—click the plus icon and choose your preferred Dot Matrix material.

Note

Do not use surface variants for the post process component.

4. Assigning Custom Depth

If everything is set up correctly, you might notice a solid color or no visible changes in your viewport.

This is expected—since no specific mesh has been targeted yet, only the background color is rendered.

To see the effect in action, add a sphere (or any mesh) to the scene and enable Custom Depth. Select the mesh, in the Details panel search for "Custom Depth" and enable Render CustomDepth Pass. Also set the CustomDepth Stencil Value to 77. Now, the Dot Matrix effect should appear on the selected mesh! 🎉

5. Using Surface Variants

Some variants of the shader can be applied directly to any mesh. Simply drag and drop the materials denoted with "Surface" onto the desired surface, and it will work right away!

---

Adding Your Own Patterns

There are two variants of this shader: Regular and Flipbook. Assigning custom motifs vary for each, so let's see how its done.

Regular Variant

Regular variant of the Dot Matrix shader uses individual textures to act as motifs. This means adding more motifs will require duplicating a few simple nodes in the material graph. This process may seem tedious but it comes with the benifit of a more random grid.

1. Open the parent material of choice, here I'm using the M_DotMatrixR.

   

2. In the texture samples section of the material nodes, select any of the Texture Sample node and change its texture in the details panel.

   

3. To add more patterns, simply duplicate the Texture Sample node and assign any excess textures.

   

4. Next make sure the new Texture Sample node follows the same lerp format.

   

5. For the Alpha we'll duplicate a Step node in the Step Node section. Make sure the Y value corresponds to the number of the texture. So the fourth texture will have a value of 4.

   Correction

   The floor input should go to X and the step number to Y.

   

6. Connect this returning value to the alpha of the Lerp. Finally connect the output of the Lerp node to the ManualPatterns reroute.

   

To see additional patterns in effect, make sure to increase or decrease the NumberOfTextures parameter in the material/material instances.

Flipbook Variant

Flipbook variant of the Dot Matrix shader uses pre-defined altases or flipbooks for its grid patterns. This is far easier to modify but comes at the cost of less appealing repititions.

1. Open any flipbook material and simply assign your own texture to the FlipbookPattern parameter.

   

2. Set the appropriate number of rows and columns as seen in your custom flipbook.

   

Using Scene Color as Background

If you're looking to create the above effect, there are a couple things to take into consideration.

1. This effect can be achieved using the "BG" variants of the dot matrix shader.

   

2. However once you apply it to the post-process volume, you'll notice the surface material of the mesh leak through the motifs.

   

3. To fix, this simply select the mesh in question and in the Material parameter, assign the M_TransparentBase that comes with the pack.