Vertex Position Processing with GLSL

What is a Vertex Shader?

The graphics pipeline is a sequence of stages that transforms your 3D vertex data into the 2D colored pixels you see on screen. The very first programmable stage in this pipeline is the vertex shader. Its fundamental job is to run once for every single vertex you send to the GPU and determine its final position.

To get a high-level overview of shaders and their role, let's start with a short video.

As the video explained, the vertex shader's main output is the final position of a vertex. But what coordinate system is that position in?

The Target: Normalized Device Coordinates (NDC)

OpenGL only renders things that are within a specific, cube-shaped region of space where the x, y, and z coordinates all range from -1.0 to 1.0. This is called Normalized Device Coordinates (NDC). The vertex shader's ultimate goal is to output coordinates that will end up in this space. Anything outside this range is "clipped" and won't be visible.

The output of the vertex shader is technically in "clip space," which is then converted to NDC by dividing by its w component. For now, you can think of the vertex shader's job as simply outputting the position in this -1.0 to 1.0 cube.

Writing Your First Vertex Shader in GLSL

Now, let's write the code. Shaders are written in a special language called GLSL (OpenGL Shading Language), which has a syntax very similar to C.

Here is the simplest possible vertex shader:

#version 330 core

layout (location = 0) in vec3 aPos;

void main()
{
    gl_Position = vec4(aPos, 1.0);
}

This might look a little strange, so let's break it down line-by-line.

Let's recap the most important parts:

• #version 330 core: Specifies we're using GLSL version 3.30 and the modern "core" profile, which disallows old, deprecated functions.

• layout (location = 0) in vec3 aPos;: This is how we get data into the shader.

  • in: Keyword for an input variable coming from the vertex buffer.
  • vec3: A GLSL data type representing a 3-component vector (x, y, z).
  • aPos: A name we've chosen for our position attribute variable.
  • layout (location = 0): This is the crucial link! It explicitly connects this shader input to attribute location 0 in our C code—the same location we configured with glVertexAttribPointer(0, ...) and enabled with glEnableVertexAttribArray(0).

• void main() { ... }: The entry point for the shader, just like in C. This code will be executed for every vertex.

• gl_Position = vec4(aPos, 1.0);: This is the shader's output.

  • gl_Position: A special, built-in GLSL variable. Whatever vec4 value you assign to it becomes the final clip-space position of the vertex.
  • vec4(aPos, 1.0): We must output a 4-component vector (vec4). We construct it using our 3-component input aPos for x, y, and z, and set the fourth component, w, to 1.0. The w component is used for perspective calculations, which we'll cover in detail later. For now, think of w = 1.0 as indicating a point in 3D space.

This simple shader does no processing; it just takes the input position and passes it directly to the output.

The Shader in Action

Visually, you can think of the process like this:

In your C application, you will eventually load this shader code as a simple string. The next lesson will cover compiling this string into a usable GPU program, but seeing how it's stored can be helpful now.

Hands-On Experiment: Modifying gl_Position

The best way to understand what the vertex shader does is to play with it. What happens if we don't just pass the position through, but modify it?

Consider this slightly changed shader:

#version 330 core

layout (location = 0) in vec3 aPos;

void main()
{
    // Move every vertex 0.5 units to the right
    gl_Position = vec4(aPos.x + 0.5f, aPos.y, aPos.z, 1.0);
}

If our input vertices defined a triangle centered at the origin, this shader would take each vertex and add 0.5 to its x-coordinate before outputting the final position. The result? The entire triangle would be rendered shifted to the right.

This simple modification demonstrates the power you now have. You can manipulate every vertex on the GPU to translate, rotate, scale, or deform your geometry in any way you can imagine.

Conclusion

Congratulations! You've taken your first step into the world of shader programming. While this first vertex shader was simple, it laid the foundation for all the advanced visual effects to come.

Key Takeaways:

• A vertex shader is a program that runs on the GPU for each vertex, with its primary goal being to compute the vertex's final position in clip space.
• Shaders are written in GLSL, a C-like language.
• The in keyword declares input attributes, which are linked to your VBO data using layout (location = ...).
• The special built-in variable gl_Position is the vec4 output that determines the vertex's final position.
• By manipulating the calculation for gl_Position, you can directly transform your geometry on the GPU.

Preview of the Next Lesson:
A vertex shader is only half of the story. Once OpenGL knows where the vertices of a triangle are, it needs to fill in the pixels inside. This is the job of the fragment shader. In the next lesson, "Write a basic fragment shader in GLSL to output a solid color," you will write your second shader and learn how to control the color of your rendered shapes.