The Math behind (most) 3D games - Perspective Projection

383,503
0
Published 2021-06-08
Perspective matrices have been used behind the scenes since the inception of 3D gaming, and the majority of vector libraries will have built-in helper functions to construct them for you. But what if you wanted to know the reasoning behind how these matrices are constructed.

I start off with a brief introduction of computer graphics and the key ideas behind 3D rendering. I differentiate between Image Order Rasterization typically used by Ray tracers, and object order rasterization as used in most video games. I then present an animated walkthrough showing the full derivation of both the orthographic and perspective projection matrices.

My derivation here is focused on the Vulkan API, but the reasoning applies just as well to other API's such as OpenGL or direct X, with the only notable differences being the size of the canonical viewing volumes, and the handedness and conventions of the xyz coordinate systems.

0:00 How does 3D graphics work?
2:05 Image versus object order rendering
2:51 The Orthographic Projection matrix
5:17 The perspective transformation
7:08 Homogeneous Coordinate division
8:27 Constructing the perspective matrix
10:29 Non-linear z depths and z fighting
11:30 The perspective projection transformation

** Resources **
Fundamentals of Computer Graphics by Peter Shirley & Steve Marschner
www.songho.ca/opengl/gl_projectionmatrix.html
matthewwellings.com/blog/the-new-vulkan-coordinate…
www.insider.com/pixars-animation-evolved-toy-story…

* Attributions*
Ray tracing graphics cards - Photo by Nana Dua from Pexels
Rubiks cube - Photo by Mathias P.R. Reding from Pexels
Ray tracing in video games - www.digitaltrends.com/gaming/battlefield-v-dxr-ray…
en.wikipedia.org/wiki/Line%E2%80%93plane_intersect…

All Comments (21)
  • @BrendanGalea
    For those of you who have been following the vulkan tutorial series, this video is a slight departure from the normal format. The coding portion for the tutorial will be released separately as soon as I’m finished. Future tutorials will return to the more typical structure, with code and theory interleaved. Enjoy!
  • @func8211
    Cleanest description of the math behind view projection I've seen! Nice.
  • @ammonwolfert
    I’m writing a rendering engine from scratch in C and this was exactly the resource I was looking for. Wonderful visualization and explanation!
  • After watching 3blue1browns "Essence of Linear Algebra" Playlist, taking the linear algebra module in my university AND watching this video I was finally able to implement these concepts all while deriving the used methods by myself too. Thanks for this awesome video
  • @guitarvoicing
    Another master piece of 3d explanation. I really never understood well the black magic of the perspective matrix. It was in somehow just diving by z. Yet, your explanation is so clean and so perfect. It makes it really easy to understand. Please post more tutorials like these. You should definitely write a book about it too.
  • @bellanthea
    Thank you for this video!! I don’t code much, but I love art and math and was so curious on the math behind game engines / 3d graphics and wanted to see how close or far off my guesses were. this makes me want to code!
  • @AlexGomes09
    Beautiful, right to the point. Not a lot of extra theory. Easy to follow and understand. Keep them coming 🙏
  • @lavz24
    Found this, Great explanation this topic was killing me, I was not able to understand it before where they get the values and a visual representation of it. You have everything. Great job!
  • @PBrrtrn
    Absolutely loved this explanation and would recommend it to anyone trying to understand the nuts and bolts of graphics programming.
  • @zdspider6778
    12:33 The vertical FOV is actually the angle from the center to the top (or center to the bottom, same thing). It's a half angle. Hence the theta/2.
  • @ssopkc_venom
    Probably the best in depth tutorial i have ever seen on Youtube for graphics rendering. Even better than Cherno IMO
  • @tomatrix7525
    This is very very very good. I’ve seen too many people code in opengl etc without really understanding what is going on. Sure it works, but this intuition as to what these matrices are doing is good
  • @krumss
    Very well explained!! Good work!! Look forward to your game engine and computer graphics series!!
  • @Josh-kh1zp
    This is amazing!! I always wondered what was behind it, great Job!
  • @Fireblazer777
    Thanks a lot! I've never heard these concepts explained so well!
  • @rootKLM
    Two videos in a week! So glad you're making this series, I was struggling a lot with the vulkan documentation before I found your videos!
  • @zarblitz
    This video on its own is incredible, educational, and just all around superb. I learned so much and tied together so many loose ends I had dangling in my brain because of this video. Thank you.
  • @burakcanik01
    This, along with Cem Yuksel's 3D Transformation video really explains the subject well. I've reviewed this subject multiple times throughout the years but I gotta say, this 2-step approach (perspective projection = perspective transformation + orthographic projection) is IMHO the most intuitive and easy to remember way of teaching/studying this subject. Most books/resources tend to focus on deriving the perspective projection matrix from the ground up, often times skipping the inherent connection to orthographic projection. Thank you for a job well done. Cheers!
  • This simultaneously looks easily and neatly explained and not understandable at all without an already pretty advanced level
  • @aaaakko139
    Even though I thought I had already understood this before I watched, I still learn something from it. Thanks for making this video, I think it's the clearest one about how to get the Perspective Projection