Tuesday, 7 January 2014


Using the BLEND_Masked Blend Mode is very good to make a texture disappear the way liquids do. Sort of retracting as a blob rather than smoothly fading.

The success of it relies on the information from your texture and on the threshold the Opacity Mask Clip Value applies to it.

[quick disclaimer: the framerate of the videos is a bit jaggy. Gotta use your powerful imagination to see them smooth.]

But what if you want that material to be translucent yet you still want that sort of mask? I’m going to show you a simple little set up that recreates this behaviour. To get there, there will be a few things to cover beforehands.

  • To start with, I’ll show you a way to test material animation within the editor.
  • Then we’ll look at creating an appropriate mask.
  • Finally we’ll get to the threshold part. 

Testing material animation within the editor.

This is a setup I like to use to preview the way my particles will look like once they’re animated in cascade. (so as to avoid back and forth from one editor to the other.)

The sine here is set to 3. Quite slow so I have the time to see what’s going on. The output of a sine curve varies from -1 to 1. With the constant bias scale at its default values (bias = 1, scale = 0.5), we move that range to the range we’d use for an opacity : 0 to 1.

I like to visualize this sort of thing by scribbling lines on paper. It clarifies things whenever I’m confused with what’s happening to my values.

Anyway. Your test multiplier oscillates regularly between 0 and 1 in the material editor.

You can see I've plugged the output into a lerp between green and red. That's my general rule when I debug an issue: strip it bare to the minimum and make it dead obvious.

Creating the mask texture.

Pick your favourite splatter from cgtexture.

In photoshop, invert it then turn it white using the channel mixer, which gives you more controls over the levels of you greys than a simple desaturate. Make sure you retain some details.

If your texture is detailed enough, you might get away with a simple gaussian blur.

If it’s not or if you want to extract certain areas of your texture, duplicate it, apply some harsh levels to isolate a certain range, add a gaussian blur, make the layer additive and balance its opacity. 

The important thing is to avoid areas of one pure value and therefore to keep your gradients as smooth as possible. Otherwise whole zones will pop out as they fade.
I have only tested this texture creation process quickly. I might go back to it in details to try and find the perfect balance and hopefully some way to automate it.


Let's think quickly about what's happening to your gradient in the masked mode. No more shades of grey, everything becomes either black or white. The Opacity Mask Clip Value defines which values is considered as black or white. Again, when I tried to solve this out, I had to go through a paper scribbling phase.

Say I want my white to be set at the actual 0.8 grey of my texture. Any value below 0.8 is black.

How would 0.8 become 1? By adding 0.2.
How would 0.4 become 1? By adding 0.6.
How would 0.15 become 1? By adding 0.85.

Therefore, you need to add the difference between where you want the white to be set and 1.

The only thing left is to plug a floor node at the end of the chain.

And voilĂ !

Now you just want to plug the vertex colour alpha instead of your looping test value and animate your particle’s alpha from cascade.

Remember that the threshold is a clamping value. If you set it to 0.2, and input value of 0.1999 (and so on) is your new 0. (That’s using a constant. Multiplying by a texture will affect the result some more. )

Therefore, you don’t want to animate your alpha from 0 to 1. I mean it, don’t. Adjust your values to your threshold. Not only would you be drawing a transparent sprite for no reason (that’s pure evil), your animated alpha curve would also be biased and you wouldn’t be able to adjust the speed curves the exact way you’d want to. (the alpha would get to a value too quickly and then remain there doing nothing and twiddling its thumbs.)

Test the balance between your threshold and the multiplier you use either in the material editor or cascade. In the following case we’re using a threshold of 0.2.

I’ll use 0.32 as my min and 1.9 as my max. (You can go beyond 1, as long as your result doesn’t exceed 2 otherwise you’d floor the value to several integers. If you really wanted to, you could also clamp the output of your floor to 1 so you can safely multiply by any value later in cascade.)

Quick recap.

A few things are going to affect the amount of details and the speed of your opacity fade curve:
  • The details in your texture (are the lighter and darker shades spread evenly?)
  • The threshold value
  • The min and max multipliers in cascade

No comments:

Post a Comment