My Journey into the Fundamentals of Computer Graphics - Part 2: Linear Algebra Strikes Back
Tags: gamedev, learning, computergraphics, mathematics
Published: 2023-09-05 14:37:59

## Overview

Hi everyone! This week I continued reading and doing the exercises of the books that I started [last week](https://eric-buitron.hashnode.dev/my-journey-into-computer-graphics-part-1). I finished part 2 of the [book by Penny de Byl](https://www.goodreads.com/book/show/66087612), where I saw practical applications of essential trigonometry. Meanwhile, in the [3D Math Primer book](https://gamemath.com/), I reviewed linear algebra concepts which I go into more detail in the corresponding section. So let's jump straight into what I learned!

## Top 3 things I learned

### Upright space

The authors of 3D Math Primer introduce a coordinate space that they call "upright space". It is halfway between world space and a particular object space. Besides, the axes are parallel with the axes of the world space and the origin coincides with the origin of the object space. It'll probably make a lot more sense if you look at this figure from the book:

![](https://cdn.hashnode.com/res/hashnode/image/upload/v1693888189392/8036d508-ac2d-4828-adf8-27f3b7613571.png?auto=compress,format&format=webp align="center")

I found it very useful because it makes it easier to transform a point between the world and object space by separating the operation into 2 steps, as shown in this figure:

![](https://cdn.hashnode.com/res/hashnode/image/upload/v1693888353119/5ffbd62e-85e7-478e-86d3-27e5dabd060e.png?auto=compress,format&format=webp align="center")

### Normals are very useful

I went from learning how to draw the normals of a cube to calculating the normals of the triangles of each polygon to draw it correctly.

Drawing normals of a cube:

![](https://cdn.hashnode.com/res/hashnode/image/upload/v1693889307727/f82aab52-ba3e-45f1-b469-76085dff6a53.png?auto=compress,format&format=webp align="center")

Drawing normals on each triangle face of a cube

![](https://cdn.hashnode.com/res/hashnode/image/upload/v1693889404292/a36cd41c-76ec-45e1-99ef-0bbcf03f7772.png?auto=compress,format&format=webp align="center")

Displaying normals on a loaded mesh

![](https://cdn.hashnode.com/res/hashnode/image/upload/v1693889426883/90a564de-2c70-446e-857d-5f28c803b781.png?auto=compress,format&format=webp align="center")

Besides, I also learned these two uses of normals:

* Dictating which side of a polygon is visible through culling, which is removing polygons by not rendering the backface (opposite side of the polygon from which the normal is projected). This means that you only see the polygons that have their normal projected into the camera.
    
* Drawing billboards, which are flat planes that represent something solid from both sides. This is mostly used for faking distant geometry/buildings or individual leaves/branches on vegetation and grass.
    

![](https://cdn.hashnode.com/res/hashnode/image/upload/v1693890283209/5eba152d-6b6c-473c-928d-8d63ba679897.gif?auto=compress,format&format=webp align="center")

### Specify the order of your vertices!

Normals are also used to calculate how light falls across the surface of a polygon. However, you must specify the order of your vertices to avoid having problems with external files. This is because if OpenGL doesn't receive information about how to calculate the normals, it will automatically calculate them assuming that they are given in a counter-clockwise order. This can result in incorrect lighting of an object. Hopefully, these two GIFs will clarify this point:

Not calculating the normals will give the impression that the colors randomly change and not provide any indication of the direction of the light source.

![](https://cdn.hashnode.com/res/hashnode/image/upload/v1693890259755/9180e108-d91d-44f9-8499-62b746d5aa8e.gif?auto=compress,format&format=webp align="center")

When the normals are calculated correctly, it's easy to see that the cube is lit from a single direction.

![](https://cdn.hashnode.com/res/hashnode/image/upload/v1693890341095/1658f200-335d-489e-a9a3-cccae2b7b6f3.gif?auto=compress,format&format=webp align="center")

## This week's math concepts

### Multiple Coordinate Spaces

This chapter was very important for understanding the different coordinate spaces (world, object, camera, and upright). Besides, it explains the usefulness of basis vectors when performing transformations between coordinate spaces.

### Intro to Matrices

This chapter served as a review of the basics of matrices. Most notably, it allowed me to understand how a square matrix can describe any linear transformation (which I'll see in more detail in the next chapters). I also found very useful the explanation of how, by interpreting the row vectors of a matrix as basis vectors, you can construct or deconstruct the matrix and visualize the transformation.

For example, it explains how sketching a skew box (the complete parallelogram that is formed by 2 basis vectors) and drawing the object inside the box can help with the visualization, as shown in these figures:

Skew box.

![](https://cdn.hashnode.com/res/hashnode/image/upload/v1693890978205/a9f39ad6-082f-40e8-b928-b9b3710018a0.png?auto=compress,format&format=webp align="center")

Drawing the object inside the skew box.

![](https://cdn.hashnode.com/res/hashnode/image/upload/v1693890985740/4da9caaa-33ef-489a-a7e7-afffdda01d2a.png?auto=compress,format&format=webp align="center")

## Useful resources

This week, there are just a couple of useful resources provided by the 3D Math Primer book. The authors explain how the concepts of linear algebra in the book only focus on the geometric applications of vectors and matrices. They explain how solving larger systems of equations is something that is usually involved in the development of these technologies:

* Physics engine
    
* Fluid simulation
    
* Cloth simulation
    
* Hair simulation
    
* Robust procedural animation
    
* Real-time global illumination
    
* Machine vision
    
* Gesture recognition
    

Since the book doesn't cover how to solve these bigger parts of linear algebra and scientific computation, the authors recommend a pair of courses from [MIT OpenCourseWare](https://ocw.mit.edu/) given by Professor Gilbert Strang:

* **Undergraduate-level** [Linear Algebra course](https://ocw.mit.edu/courses/18-06sc-linear-algebra-fall-2011/pages/syllabus/)
    
* **Graduate-level** [Computational Science & Engineering course](https://ocw.mit.edu/courses/18-085-computational-science-and-engineering-i-fall-2008/pages/syllabus/)
    

## What's next

Next week, I'll continue my deep dive into linear algebra by learning the theory and practical applications of the essential linear transformations. Meanwhile, I invite you to tell me your thoughts on the use of "upright space"!