SHADER BASICS PART 3
MIX (aka LERP)
In the previous thread, we mentioned how to take into account the pixels' coordinates to not just paint the screen with a solid color.
#shaderbasics #shaders
MIX (aka LERP)
In the previous thread, we mentioned how to take into account the pixels' coordinates to not just paint the screen with a solid color.
#shaderbasics #shaders
There are plenty of ways to take advantage of those coordinates but some of the main tools for that purpose are the "mix", "step" and "smoothstep" methods. Here I'll just cover "mix".
You might've already heard of this method, though in other environments outside of glsl, it goes by the name of "lerp", meaning linear interpolation.
The math expression for this method would be:
f(a, b, t) = t*a + (1.0 - t)*b
which in simpler terms means that, having a value "t", the method linearly interpolates from the value of "a" to the value of "b" as "t" goes from 0 to 1.
f(a, b, t) = t*a + (1.0 - t)*b
which in simpler terms means that, having a value "t", the method linearly interpolates from the value of "a" to the value of "b" as "t" goes from 0 to 1.
So if "t" is 0, you get a
If "t" is 1, you get b
If "t" is 0.5, you get (a+b)/2 (the middle value)
Keep in mind that the transition from a to b happens *linearly*, which in most graphics cases, is a synonym for *boringly*. But we'll get to that when we talk about "smoothstep".
If "t" is 1, you get b
If "t" is 0.5, you get (a+b)/2 (the middle value)
Keep in mind that the transition from a to b happens *linearly*, which in most graphics cases, is a synonym for *boringly*. But we'll get to that when we talk about "smoothstep".
In Unity, the method exists in many contexts, including in unity shaders, where it's called "lerp" instead of "mix". You can also find a "lerp" method in the C# code, in the Mathf library and as a static method in Vector classes. The functionality remains the same.
Here's the code for the initial image. It's just 2 mixes of 2 colors based on the Y coordinate of the screen, which are then mixed based on the X coordinate of the screen. As you can imagine, "mix" is great for, well, mixing colors, but it can have other uses too!
Since "mix" returns a value based on whether the third parameter, it can be used as a form of conditional branching without using "if". Using the result of a "step" method as the third parameter usually helps with that purpose, but more on that on the next thread!
It was just pointed out to me that I fudged the expression up. It should be:
f(a, b, t) = (1.0 - t) * a + t * b
The explanation below is still accurate, even if I messed up the expression. That's how you get "a" if "t" is 0.
Sorry about that ^^"
f(a, b, t) = (1.0 - t) * a + t * b
The explanation below is still accurate, even if I messed up the expression. That's how you get "a" if "t" is 0.
Sorry about that ^^"
