Applying Dynamic Transformations

Introduction

Welcome back to 3D Worlds and Matrix Transformations! Having successfully completed two lessons, we've built a solid foundation in transformation mathematics and applied static GLM transformations to create our first rotated square. Now, we're ready to take a significant leap forward into the realm of dynamic, real-time graphics. In this third lesson, we'll discover how to create dynamic model transformations that update continuously while our application runs. Instead of calculating transformations once on the CPU as we did previously, we'll learn to send transformation matrices directly to the GPU using uniforms and update them every frame. This approach will transform our static 45-degree rotated square into a smoothly spinning animation, demonstrating the power of real-time matrix transformations in modern graphics programming.

From Static to Dynamic Transformations

As you may recall from our previous lesson, we applied transformations by calculating new vertex positions on the CPU and sending the pre-transformed vertices to OpenGL . While this approach worked perfectly for our static rotated square, it becomes impractical when we want smooth, continuous animation. Think about what would happen if we wanted our square to rotate continuously: we'd need to recalculate every vertex position, recreate the vertex buffer, and upload new data to the GPU for every single frame. With a typical display running at 60 frames per second, this becomes extremely inefficient and can severely impact performance. Dynamic transformations solve this problem by moving the transformation calculations to the GPU itself. Instead of sending transformed vertices, we send the original vertex data once and then provide transformation matrices as uniforms that the GPU can apply in real time. This allows us to animate objects smoothly without constantly updating vertex data, leveraging the GPU's parallel processing power for maximum efficiency.

Understanding Uniforms

Uniforms are a special type of variable in shader programs that remain constant across all vertices or fragments within a single draw call but can be updated between draw calls. Think of them as global parameters that we can modify from our CPU code to control how the GPU processes our geometry. In our case, we'll use a uniform to send a transformation matrix from our CPU application to the vertex shader. This matrix will then be applied to every vertex during the rendering process, allowing us to rotate, translate, or scale our entire object without modifying the original vertex data. The beauty of uniforms is that they bridge the gap between our CPU logic and GPU rendering, providing a clean way to pass dynamic parameters to our shaders. Unlike vertex attributes, which can vary per vertex, uniforms maintain the same value for all vertices in a draw call (hence the name uniform). This makes them perfect for transformations that affect the entire object uniformly, such as rotating our square around its center.

Join the 1M+ learners on CodeSignal

Be a part of our community of 1M+ users who develop and demonstrate their skills on CodeSignal

Creating the Dynamic Render Loop

Now, we implement the heart of our dynamic transformation system: a render loop that continuously updates our model matrix based on the current time. This creates smooth, time-based animation.

C++

while (!glfwWindowShouldClose(window))
{
    float currentTime = (float)glfwGetTime();
    
    if (currentTime - lastRenderTime < TARGET_FRAME_TIME) {
        glfwPollEvents();
        continue;
    }
    lastRenderTime = currentTime;

    // Create dynamic rotation matrix
    glm::mat4 model = glm::rotate(glm::mat4(1.0f), currentTime, glm::vec3(0, 0, 1));
        
    glClear(GL_COLOR_BUFFER_BIT);
    glUniformMatrix4fv(modelLoc, 1, GL_FALSE, glm::value_ptr(model));
    glDrawElements(GL_TRIANGLES, 6, GL_UNSIGNED_INT, 0);
    glfwSwapBuffers(window);
    glfwPollEvents();
}

while (!glfwWindowShouldClose(window))
{
    float currentTime = (float)glfwGetTime();
    
    if (currentTime - lastRenderTime < TARGET_FRAME_TIME) {
        glfwPollEvents();
        continue;
    }
    lastRenderTime = currentTime;

    // Create dynamic rotation matrix
    glm::mat4 model = glm::rotate(glm::mat4(1.0f), currentTime, glm::vec3(0, 0, 1));
        
    glClear(GL_COLOR_BUFFER_BIT);
    glUniformMatrix4fv(modelLoc, 1, GL_FALSE, glm::value_ptr(model));
    glDrawElements(GL_TRIANGLES, 6, GL_UNSIGNED_INT, 0);
    glfwSwapBuffers(window);
    glfwPollEvents();
}

The magic happens with glm::rotate(glm::mat4(1.0f), currentTime, glm::vec3(0, 0, 1)). Instead of using a fixed angle like 45 degrees, we use currentTime as our rotation angle. Since glfwGetTime() returns the time in seconds since the program started, this creates a rotation that increases continuously over time.

The glUniformMatrix4fv() function uploads our transformation matrix to the GPU uniform, where modelLoc specifies which uniform to update, 1 indicates we're uploading one matrix, GL_FALSE means the matrix data is not transposed, and glm::value_ptr(model) provides a pointer to the matrix data in the format OpenGL expects.

Introduction

From Static to Dynamic Transformations

Understanding Uniforms

Join the 1M+ learners on CodeSignal

Updating the Vertex Shader

Setting Up Uniform Access

Creating the Dynamic Render Loop

The Dynamic Result

Conclusion and Next Steps