These are some examples of how visual shader patches can be used to change the appearance of materials.
Learn how to:
You can also use patches to create color gradients.
This graph uses visual shaders to combine a texture with a color.
A single texture and a color are connected to a Multiply patch, then connected to the Diffuse Texture port of defaultMaterial0.
You can use the Multiply patch to apply more than one texture to the same material channel.
You'll need to:
To create a Multiply patch, just right-click in the Patch Editor and select the Multiply patch from the menu.
If you connected the RGBA output of one of the texture patches directly to the material, you'd apply the texture to the material.
Instead, connect the RGBA outputs of each texture patch to the inputs in the Multiply patch.
Then connect the output of the Multiply patch to the input in the patch representing the material's property:
In the example below, we've combined a texture that looks like a wall pattern with a gold texture:
To finish the material we’ve added a normal map and a specular texture. This creates the look of rough surface and the appearance of 3 shiny gold bricks:
We've connected the RGB channel of the wall1_diffuse texture patch and the alpha channel of the wall1_mask texture patch to the Pack patch.
We've then connected the output of the Pack patch to the Diffuse Texture port of defaultMaterial0.
Before we connected the alpha channel the material appeared to be square, like in other examples on this page.
You can use the 2D Transform Pack patch and the Texture Transform patch to rotate, scale, pivot and translate textures.
To transform a texture using patches, you'll need to:
To create the 2D Transform Pack patch and the Texture Transform patch, right-click anywhere in the Patch Editor and select them from the menu.
You’ll see the 2D Transform Pack patch has 4 input ports, each with values that can be edited. Edit:
Your graph should look like this:
Connecting these patches will apply the texture to your material. Here’s an example we’ve created using a texture that looks like a brick wall:
You’ll need to adjust the values in the 2D Transform Pack patch to actually transform the texture. For example, in the graph below we’ve:
As a result, the texture looks like this:
You can use the Patch Editor to add animation to textures to
In this example we'll use the Loop Animation, Transition and Mix patches to create an effect that animates between two textures in one material:
To create this effect, you'll need to:
To create the Loop Animation and Transition patches, right-click in the Patch Editor and select them from the menu. Set the data type of the Progress patch to Number.
By default, operations are placed in the vertex stage where possible. In the vertex stage pixel colors get computed only at the vertices and not at each pixel. The actual colors of the inner pixels are linearly interpolated as a result. This makes rendering more efficient and improves the performance of your effects.
In the example below, we’ve applied two texture to two different planes.
In the top plane, the material has had its diffuse texture set using operations in the vertex stage. The plane at the bottom of the scene uses the fragment stage.
The colors of the four vertices in the top plane are computed - two pink vertices on the left side and two green vertices on the right side. The interior is then linearly interpolated, resulting in a smooth transition between them, which creates a gradient.
This is the graph we built to create this effect:
We’ve added the Step patch to this graph. The intention here is to make a sharp transition from pink to green at 0.5 in the X axis, instead of a gradient. To achieve this sharp transition we need to compute the interior pixels too, by adding the Fragment Stage patch.
If we add the Fragment Stage patch between the Swizzle and Step patches, everything that comes after it will be computed per fragment (pixel) rather than being interpolated. This means we can see the sharp transition between colors in the second plane.
Here’s how the graph looks: