Computer Graphics
COMP3421/9415 2021 Term 3 Lecture 5
What did we learn last week?
2D Graphics
¡ñ OpenGL Pipeline
¡ñ Textures
¡ñ Transforms
¡ñ Some ideas on how a 2D game could be made
What are we covering today?
3D Graphics
¡ñ We are entering the 3rd dimension!
¡ñ 2D to 3D . . . what changes?
¡ñ 3D Objects
¡ñ Coordinate Spaces
¡ñ Making a (virtual) Camera
2D to 3D
What are our current capabilities?
In our 2D Graphics
¡ñ Shapes made of triangles
¡ñ Textures on objects ¡ñ Transforms
Capabilities in 3D
What are we wanting to do in 3D?
¡ñ Shapes made of triangles
¡ñ Textures on objects ¡ñ Transforms
Going to 3D
We’ve been teaching you 3D graphics all along!
¡ñ Only minor modifications needed
¡ñ Coordinates start to use z
¡ñ Triangles are always 2 dimensional objects . . .
¡ñ . . . but multiple triangles can make 3D objects
¡ñ Textures work with verts exactly as they do in 2D
¡ñ Transforms are going to add a dimension
3D Transforms
Our Transform Matrices are adding a dimension
¡ñ Our Vectors are now (x,y,z,w)
¡ñ Our Matrices are now 4 x 4
Scale
Reasonably simple expansion into 3D
Scale x
0
0
0
0
Scale y
0
0
0
0
Scale z
0
0
0
0
1
Scale x
0
0
0
Scale y
0
0
0
1
Translate
Reasonably simple also!
1
0
0
Tx
0
1
0
Ty
0
0
1
Tz
0
0
0
1
1
0
Tx
0
1
Ty
0
0
1
Rotate
Gets more interesting here
¡ñ In 3D rotation must be done AROUND a vector
¡ñ In 2D we were basically rotating around the Z axis
This row leaves the Z coordinate unaffected by the transform
cos¦È
-sin¦È
0
0
sin¦È
cos¦È
0
0
0
0
1
0
0
0
0
1
cos¦È
-sin¦È
0
sin¦È
cos¦È
0
0
0
1
This column stops the Z coordinate from affecting any others
Rotate around other axes
We can similarly rotate around the X or Y axes
1
0
0
0
0
cos¦È
-sin¦È
0
0
sin¦È
cos¦È
0
0
0
0
1
cos¦È
0
sin¦È
0
0
1
0
0
-sin¦È
0
cos¦È
0
0
0
0
1
Rotate around X Rotate around Y
3D Objects
Making 3D Objects
Meshes of vertices
¡ñ We’ve already seen things like rectangles made up of two triangles
¡ñ In 3D triangles can form the outer surface of an object
¡ñ Vertices can form surfaces that wrap entirely around an object
Image credit: School of Computing, University of Utah
Inside vs Outside
The idea of a surface implies an inside and outside
¡ñ Triangles now have a front and a back
¡ñ Vertices go from being points in space to being positions on a surface
¡ñ These are important properties that we’ll be looking at in detail later . . .
Coordinate Spaces
Each object actually exists in its own local coordinate space
¡ñ This means each object actually has its own local origin (0,0,0)
¡ñ . . . which is a point in space in the world coordinates
¡ñ And its own local x,y and z axes
¡ñ . . . which are vectors in the world space
What is a transform?
We’ve seen them already, but what do they represent?
¡ñ A Transform Matrix is actually the local origin and axes of an object in relation to the world space
¡ñ When we’re applying a transform, we’re actually shifting an object between two coordinate systems
Deconstructing the Transform
The Identity Matrix is the World Transform
The X axis
The Y axis
The Z axis
1
0
0
0
0
1
0
0
0
0
1
0
0
0
0
1
The origin
Deconstructing a Scale Transform
What happens in the scale transform?
¡ñ The object’s X axis is twice as “long” as the world’s X axis
¡ñ This is in effect what “stretches” the object
The X axis has been doubled
2
0
0
0
0
1
0
0
0
0
1
0
0
0
0
1
Deconstructing a Translate Transform
What happens in the translate transform?
¡ñ The object has an origin of (5,6,2)
¡ñ This means that its vertices are now
positioned relative to that point
1
0
0
5
0
1
0
6
0
0
1
2
0
0
0
1
The origin of the object has moved
Composing Multiple Transforms
Multiple Transforms together
¡ñ Retain all information from each of the transforms
¡ñ Build up a set of axes and origin for an object
¡ñ The final transform takes an object from local to world space
¡ñ It’s also known as the model matrix
Break Time
The Matrix (1999)
¡ñ Speaking of important films with CG . . .
¡ñ The Matrix was rendered in Sydney by
Animal Logic
¡ñ One of the Silicon Graphics Onyx machines
used in the Matrix is in the lobby of the K17 building (donated by and others from iCinema in 2012)
Image credit: Warner Bros Entertainment
Cameras and Viewpoints
Cameras as Objects in a Scene
They exist in their own coordinate space
¡ñ So a camera will have its own transform matrix
¡ñ But it’s not a 3D model, and has no vertices!
¡ñ It’s more of a viewpoint that exists in the world space
¡ñ OpenGL will treat the camera as if its Z axis points from your screen to
your eyes
¡ñ Using the camera transform will put all the vertices into the camera’s
perspective!
Making a Camera Transform
How do we make our camera?
¡ñ Build up the transform piece by piece 1
Image credit: learnopengl.com
Camera Position
Placing the camera in a position
¡ñ Placing something in our scene using a Translate transform
¡ñ Let’s use (0,1,2) as an example
¡ñ Our camera is along and just above the
Z axis
1
0
0
Px
0
1
0
Py
0
0
1
Pz
0
0
0
1
Camera Direction
Start building the three axes of our camera’s coordinate space
¡ñ The first vector goes from where the camera is looking
¡ñ to the camera itself
¡ñ It’s directly on the line the camera is looking, but aimed at the camera
¡ñ (Camera Location) – (What we’re looking at)
¡ñ In this example, we can keep it simple:
¡ñ (0,1,2) – (0,0,0) = (0,1,2)
Vectors . . . Directions with Length?
We’re going to want to be careful with all our vectors
¡ñ Vectors can represent points or directions
¡ñ If they represent a direction and not a distance . . .
¡ñ Then we should always normalize them!
¡ñ Normalize roughly means: “Make a vector length 1”
¡ñ We do this by dividing a vector by its own length
¡ñ (0,1,2) normalized is (0, 1/¡Ì5, 2/¡Ì5)
The World’s Up Vector
We have an assumption of gravity
¡ñ Humans tend to expect the camera to stay upright
¡ñ So there’s always an idea of up and down in a virtual world
¡ñ We can keep this simple in most worlds by using the Y axis:
¡ñ (0,1,0)
¡ñ Is this an acceptable axis to add to the camera?
Why have the Up Vector?
The World’s Up vector can’t be trusted as an axis
¡ñ To make a set of axes, they MUST be orthogonal
¡ñ That means they’re all 90 degrees from each other
¡ñ There’s no guarantee the World’s Up vector is 90 degrees from the
Camera Direction vector
¡ñ (in fact it’s incredibly unlikely!)
¡ñ But we’ll use it to make one of our axes . . .
The Right Vector
Not the wrong vector.
¡ñ One of the axes in our camera is the one that goes to the right
¡ñ Like going across the surface of a screen from left to right
¡ñ How do we create a vector that’s right angle to two other vectors?
¡ñ Cross Product!
¡ñ Up x Camera Direction = Right
¡ñ (remember that cross product order is important . . . right hand rule)
¡ñ (0,1,0) x (0,1,2) = (2,0,0)
¡ñ We’d normalize this to (1,0,0)
Camera’s Up Vector (or the Up Axis)
The third axis is easy to make
¡ñ If we have two vectors, we can make a third that’s orthogonal
¡ñ Cross Product
¡ñ Camera Direction x Right = Up Axis
¡ñ (0,1,2) x (1,0,0) = (0,2,-1)
¡ñ Normalized to (0, 2/¡Ì5, -1/¡Ì5)
Three Axes make a transform
Making a Transform
¡ñ Use the vectors to make a matrix
¡ñ The Right Vector
¡ñ The (camera’s) Up
¡ñ The Camera Direction
¡ñ This gives us all our rotation and scaling, but isn’t yet using our position
Rx
Ry
Rz
0
Uz
0
Dx
Dy
Dz
0
0
0
0
1
Combine the Camera Position with Orientation
Multiplying the two matrices together
¡ñ The resulting transform is known as the LookAt matrix
¡ñ This moves the world relative to the camera
Rx
Ry
Rz
0
Uz
0
Dx
Dy
Dz
0
0
0
0
1
1
0
0
Px
0
1
0
Py
0
0
1
Pz
0
0
0
1
X
Will we need to do all this maths?
Thanks again GLM
¡ñ The GL Maths Library has a single function for creating a LookAt matrix
¡ñ glm:lookAt(position, target, up)
¡ñ This function allows us to give only three vectors and will calculate the
LookAt matrix for us
What did we learn today?
2D to 3D
¡ñ A lot of what we knew still applies in 3D
¡ñ Some 3D Transforms
¡ñ Objects as meshes
¡ñ Transforms as their own coordinate spaces
¡ñ Making a Camera LookAt transform