This article the basic of perspective projection from a theoretical approach, while also explaining a few equations and how it actually works. We will not cover the perspective matrix, but I highly suggest to study it, as it is always used. But let’s start with a simpler thing, how to simply make perspective on a vec3.

A simple explanation, as the human eyes.

Let’s start with a very simple scene consisting of a eye, a light source and a simple object(the cube), I will use a simple point on the cube surface as a simple exemple. Let’s see how this simple point can get seen from the eye.

So the light emits photons, the photons are then bounced all around, when the photons hits the box, they will be reflected in all different angles. Some of those reflected photons will then hit the eyes, and allow you to see the blue dot. I made a very ugly drawing to express this idea.

So in short: The lights emits photons, some of those photons are hitting the object and are reflected all around with different angles, then some of those reflected photons hits the eyes, and you see the blue dot.

A simple image sensor.

Let’s add an image sensor to our imaginary setup. Basically, the image sensor will be responsable to hold what the scene would look like. I mean, for a better description of what an image sensor is, let’s take the wikipedia def:

“An image sensor or imager is a sensor that detects and conveys information used to make an image. It does so by converting the variable attenuation of light waves (as they pass through or reflect off objects) into signals, small bursts of current that convey the information. The waves can be light or other electromagnetic radiation. Image sensors are used in electronic imaging devices of both analog and digital types, which include digital camerascamera modulescamera phonesoptical mouse devices,[1][2][3]medical imaging equipment, night vision equipment such as thermal imaging devices, radarsonar, and others. As technology changes, electronic and digital imaging tends to replace chemical and analog imaging.

Let’s make a very simple scene consisting of 2 dots, and the image sensor. Once again, the light source emits photons, some hits the 2 points, then these points reflects the photons, some of those reflected will hit the image sensor.

The outcome of this image would be complete garbage, as we would not be able distinct all the light hitting the sensor and looking at it would simply be a blasted overdrived image, that is not good, as we want to see the actual scene.

Adding the lens.

To properly display the image, we will need some lens, or a way to actually reduces the amount of lights hitting the sensor. Let’s image we have the sensor, and in front of hit, we put a simple lens, or a type of filter with a very small hole that will only let pass a small amount of light being reflected from the object in the scene. We could model it this way:

With this in mind, we do not really care if the light hits the objects and got reflected all over the place, our lens will make sure that only a very small of reflected photons hit the image sensor. Making the sensor only capture the 2 points we have in our scene.

From the above image, we see that all the reflected photons in blue are simple not hitting the sensor, the one in green are the only one that does. The following output image would be something like this.

This model of capturing the light is used into what we called a pinhole camera, one again, I will refer to wikipedia:

pinhole camera is a simple camera without a lens but with a tiny aperture (the so-called pinhole)—effectively a light-proof box with a small hole in one side. Light from a scene passes through the aperture and projects an inverted image on the opposite side of the box, which is known as the camera obscura effect.

A little more complex scene to work with.

Let’s add two object into our scene and see how it get projected from the light hitting them, then passing into the hole, and getting finally hitting the sensor.

Note: As mentionned, these are only drawing to explore and get a better understanting on how the whole subject of basic perspective works. These were made in paint, and are not necessarily the most rigorous schema out there!

Let’s check for the last part of every of our 2 objects to properly see how it reaches the sensor.

By setting up this scene, we see that the object are projected in the opposite side of the actual scene. Meaning that if we would look to this hypothetic image generated from our scene, we would see something like this:

But why so? I mean, it’s actually how your eyes works too right? Here is a simple experiment for you to try on your own body: make your eyes look all the way left and gently, apply a presure on the right side of one of your eyes while looking left, stimulating the right side of your eyes! What do you expect to see?

If your eyes is looking at the total left, and you apply a pressure on the right on the eyes, you will indeed see some stuff appearing on the left side from where you are looking at.

Well at it’s nice to understand that, in the world of 3D programming, we do not really want this effect to occurs. Stuff of the right, should be on the right, and left should be on left on our monitor, or whatever textures we are rendering to.

Moving to the CG worlds

Awesome, we have now seen how lights got emmited all over the place, reflecting to object, then hitting the sensor after being filtered from the sensor hole. But how do we actually use this technique to make nice graphics on our screens?

The goal here, will be to move the sensor to be in front of the focal point, instead of back from it. Wich leads us to something like this:

Let’s face it, physically, this thing does not make any sense. Let’s not forget that the aperture was put in front the sensor so this way we would not have the whole reflected photons from the camera. In a physical world, this is actually how you would model a simple lens model, but in our world of 3D programming, we actually care much more about mathematics than physics right? We need mathematics to express this idea, so let’s work it out!

A bit of math to make this whole idea works.

Well, at this point, we want to make the image sensor in front of the aperture, wich, if would ask the part of my brain that takes picture for fun with friends at party, would not make any fucking sense, and it, indeed, physically make no fucking sense. But what about actually trying to find a way to make the computer handle that using mathematics.

Let’s start with a very simple scene and notes.

We will define two axis here: x and z.

Ok so now let’s go a bit simpler, and remove everything we have defined so far, let’s start with the two simple axis we defined, x and z. Let’s define the focal plane, the focal point and our image plane.

Let’s note that the focal point is at (0,0)! I also made the image plane one unit away on the z axis.

Alright, now let’s get back into our scene with a simple blue line to be rendered! I made sure to place focal point at (0,0) then making the image plane a (0,1) and the simple line we want to draw at (0,2), so one unit away of the Z unit from the image plane.

I will continue on this subject in a next article, as I realized while writting on the subject that breaking down how to project on the image plane would require a bit more of math and redactions. Therefore, you can still see a bit of the simple technique I want to introduce in the next subject by dividing from z and stuff.

At this point, you will pretty much have the good understanding on how to mimic perspective in a rasterizer. But we will dive into more details in the next series. 🙂

With love,


Leave a Reply

Your email address will not be published. Required fields are marked *