Programmer Buddy If you work on any computer languages before, you will find yourself in a completely new dimension while programming in shader. You don’t have much tool to debug these codes nor even a log, as these codes are run on the GPU of the graphics card (hardware). So to master shader you need to learn how to debug or validate your logic. Will go through these tricks as we progress further.
How do we know the origin of the shader coordinate?
To master the shape generation you need to understand the UV’s, one of the techniques to know about your UV’s is to identify from where it starts (origin of the UV’s ) and end of the UV’s.
In shader you only have colours to understand anything. If we shade the pixel base on the UV’s and observe the colours you will know about the origin.
If we calculate the finalColor of each pixel base on the below command. We will get the gradient as shown in the image below, which goes from black to red and in-between these we have an interpolated value of black to red.
finalColor=vec4(uv.x,0.0,0.0,1.0);
In GLSL (0, 0) is on the bottom left corner. In some shader environments it might be on the top left corner, using gradient shader you will know where our (0, 0) lies in the geometry plane.
In most of the cases this technique is used to troubleshoot the shader.
Note: Play around by uncommenting lines in code. and build your logic, how code changes the pattern.
Uncomment line “finalColor=vec4(vUv.x,vUv.y,0.0,1.0);” in the code.
Area with black color represents that xy=(0.0, 0.0) is at the bottom, see bottom left corner on the image.
How To Shift Origin to Center in Shader ?
In some cases we required the origin to be on the centre of the geometry plane.
As we now know that our coordinate starts from bottom-left corner (0.0, 0.0) to top-left corner (1.0, 1.0).
uv = uv * 2
If you multiply 2 with uv you will get the uv=(0.0 to 2.0)
uv = uv * 2 – 1
Now if you subtract 1 you will get the uv=(-1.0 to 1.0)
