An interactive material reacts on a mesh when it intersects with or is in close proximity to another mesh. This effect is achieved using a Distance field.
Below are three ways to create a reactive material:
Using distance to create a mask that changes the color of a mesh,
Using a sine wave to cause ripples on the surface of the mesh where the two meshes intersect, and
Using a vector mask to cause the mesh surface to pull toward another mesh in close proximity and drape over the intersecting mesh.
The DistancetoNearestSurface node only works on platforms that have distance fields enabled. Therefore, the material may not work as expected on low performance PCs and mobile because distance field computation is often either a performance bottleneck, because of high-resolution fields, or a nearly impossible task because of degeneracies in input meshes.
Therefore, use the ShadingPathSwitch to force the shaders in the DistancetoNearestSurface to work as configured with mobile platforms and low performance PCs.
First, start by making a material that changes color when it intersects with another mesh:
Create a new material in the Content Browser and double-click the material thumbnail to open the Material Editor.
Create the following nodes:
DistancetoNearestSurface node
ShadingPathSwitch node
Divide node
Saturate node
OneMinus node
Time node
Sine node
Add node
VertexNormalWS node
Mask node
3 X Multiply node
Drag off the DistancetoNearestSurface node and plug into the Default input on the ShadingPathSwitch node.
Select the Divide node and change the ConstB input value to 50.0. This determines the distance between objects for the effects to take place.
Drag off the Divide node and plug it into the Mobile input on the ShadingPathSwitch. This will ensure that the shading mask will work properly across all platforms.
Drag off the ShadingPathSwitch node plug into the Saturate node. This saturates the color on the mesh.
Drag off the Saturate node and plug it into the OneMinus node. This inverts the shaders on the mesh.
Drag off the OneMinus node and plug it into the Base Color input on the material root node.
This creates the basis for the distance field configuration with a mathematical representation of distance between objects. The shaders create a masking effect on the mesh. Try this out on a mesh by intersecting that mesh into another mesh to see how the material reacts.
Notice how the material creates a line around the shape of the automobile the closer it gets.
Rippling Effect
Now create the second configuration of the reactive material:
Drag off the Time node and plug into the B input of the Add node.
Drag off the Add node and plug into the Sine node.
Drag off the Sine node and plug into the B input of the first Multiply node.
Select and expand the Sine node and change the Period value to 0.2.
Drag off the OneMinus node and plug into the A input of the first Multiply node.
Drag off the first Multiply node and plug into the Base Color input on the material root node. This will break the link between the OneMinus node and the material root node.
This configuration applies color to the mesh that is now reactive, using the previous configuration of the distance field. The material interacts with the environment and meshes around it. When the mesh intersects with another mesh, the material causes ripples along the surface.
This configuration is commonly used to create water.
Enveloping Effect
Now to create the third configuration of the reactive material:
Drag off the OneMinus node and plug into the Base Color input on the material root node. This breaks the link between the first Multiply node and the material root node.
Drag off the VertextNormalWS node and plug into the Mask node.
Drag off the Mask node and plug into the A input on the second Multiply node.
Select and expand the second Multiply node, change the B input value to 50.0.
Drag off the second Multiply node and plug into the B input of the third Multiply node.
Drag off the OneMinus node from the first configuration and plug into the A input of the third Multiply node.
Drag off the third Multiply node and plug into World Position Offset input on the material root node.
This is what the second configuration should look like.
Notice how the material in the preview window changes to appear spikey. When applied to the mesh, the mesh’s shape also changes. As the mesh is moved closer to the automobile, the material causes the mesh to wrap around the vehicle.