A nice simple OpenGL triangle

CSE 381 – Advanced Game ProgrammingBasic 3D Graphics

Today’s Important Terms• aspect ratio

• back face culling

• camera

• double buffering

• face

• field of view

• frame buffer

• GPU

• index buffer

• left-handed coordinate system

• model space

• projection transform

• render

• right-handed coordinate system

• scene• screen coordinates• surface• transformed coordinates• transforms• untransformed coordinates• vertex buffer• view frustum• world space• world transform

Coordinate Systems

• 3D Graphics is about transforming data from one coordinate system (space) to another

ModelSpace

WorldSpace

ScreenSpace

Drawing Using Screen Coordinates

• What is screen space?– drawing on a flat, 2D space (the monitor)– draw objects at x, y locations– 0, 0 is top-left-hand corner of screen

(0, 0)

(width, height)

2D Games naturally use screen coordinates

Shift Flash Game: http://www.flashninjaclan.com/zzz883.php

y

x

What is a frame buffer?

• A 2D array of colors– what dimensions?

• Represents the pixels we view on the monitor (screen space)

• GPU

• Often represented using a single 1D array– How?

You change the frame buffer pixel data

It ends up on the screen

What is double buffering?

• A GPU has 2 (or more) frame buffers

• Why?– one for filling in– one for current display

• So?– when we’re done filling one in, we swap them– this prevents flickering– why would flickering happen?

So what else will the GPU do for us?

• Has efficient implementations of OpenGL & DirectX functions– matrix math– model transformations

• for rendering & animating

– texturing– storing data– shading– etc.

But 3D Graphics have 3Ds (duh)

• A game world is a cube

• It has an origin (0,0,0)

• We place objects at locations inside this world volume (x, y, z)– camera (s)

– models (artwork)

– terrain

– particle systems

– light sources

• We project objects onto the camera’s “screen”

What is world space?

• A coordinate system for placing all game objects

• Every model has coordinates (x,y,z)– Refers to either the coordinates of:

• the model’s bounding box’s center

• one of the model’s corners

• A 3D game world is in a box or sphere– called its bounding volume

A game world’s bounding volume

• Keeps all objects inside world– when objects move, test to make sure they don’t leave

• An additional BV provides art for out of reach background– sky box or sky sphere

• You’ll make both for HW 2

How do we project 3D objects onto a 2D screen?

• Linear algebra

• We’ll let OpenGL & the GPU do this for us

• We could alternatively do this in software– What are pros & cons?

• More on this in a minute

Which objects should we project?

• That’s the trick

• Projecting models is computationally expensive– even with a fast GPU– detailed models have lots & lots of data

• We don’t want to have to try to project all objects in the game world

• So, when rendering a world, the procedure is:1. Calculate which objects should be drawn2. Render only those objects

• This will be a big issue all semester

What are models?• Data describing 3D game assets (artwork)

– also called meshes

• What data might a model have?– vertices– triangles– adjacencies– materials– textures– bone hierarchy– animations– mipmaps– billboards– and more

http://www.wowmodelviewer.org/

Models are created using modeling software

• Like Maya, Blender, 3ds max, etc.

Modeling Software uses Model Space

• Each model has its own origin (0, 0, 0)

• So how do they end up in world space?– Linear algebra matrix transformations

What’s a matrix?

• A 2D array of numbers– used to position a vertex in 3D space– also used to project a vertex in 3D space onto a 2D screen

• NOTE: If you want to be a game programmer you must know Matrix Math

2 0 0 0

0 1 0 0

0 0 1 0

0 0 0 1

1 0 0 0

0 1 0 0

0 0 1 0

0 0 0 1

Identity Matrix What will this do?

Different Transformation MatricesscaleX 0 0 0

0 scaleY 0 0

0 0 scaleZ 0

0 0 0 1

1 0 0 0

0 1 0 0

0 0 1 0

moveX moveY moveZ 1

Also rotation matrices,

depending on axis of rotation

Matrices can be combined

• Multiply matrices for combined effects

• Result is transformation matrix for a given object

• This is used to position all vertices of that object in world space

• How?– by performing matrix math on x,y,z values of vertices

Model Vertices Conversions

• Note: models are created in tools using their own coordinate system (model space)

• During rendering of a model, for each vertex:

1. Perform necessary transformations to convert from model to world coordinates

• translate (move to xyz location in world), rotate, scale

2. Convert to view coordinates (view transform)3. Convert to screen coordinates (projection transform)

• You’ll learn all about this in CSE 328

Scene

• An assembly of objects presented on the screen at once

Rendering

• The process of producing a pixel by pixel image of the scene for the screen

What is this thing?

View Frustum

• The volume of the game world to be projected onto the screen

http://www.resourcecode.de/view.php?id=2059

What is the camera?

• A point for viewing the objects in world space– the camera is placed in world space– the camera looks in a specific direction in world space– based on where the camera is, where it’s looking, and

some other conditions (ex: z-plane, culling), we can draw the appropriate graphics on the screen

• How do we define the camera?– 2 matrices (linear algebra), a.k.a. transforms

• view transform• projection transform

View Transform

• Defined by a 4 X 4 matrix

• Tells the computer three things:– the camera position in world space (xc, yc, zc)

– the direction in which the camera is pointed• defined as a 3D vector (xvc, yvc, zvc)

– the orientation of the camera• the direction that is “up” for the camera

• also defined as a 3D vector

http://www.resourcecode.de/view.php?id=2059

Projection Transform

• Defined by a 4 X 4 matrix • Tells the computer how the scene should be projected

onto the monitor– does so by defining the viewing frustum

• only those elements inside the viewing frustum are rendered to the screen

• Defines 4 things:– front clipping plane

(z near plane)

– back clipping plane (z far plane)

– aspect ratio

– y field of view

Field of View?

• If you have the y fov, the x fov can be calculated using the aspect ratio– fov defined using radians

CameraPosition

Z

Z near plane

Z farplane

fov

Transformation Matrix

View Transform Matrix

Projection Transform

Matrix

Model’s Vertices

A bunch of vertices on

screen

What is a triangle?

• 3 connected points (vertices)

• if we combine 3 vertices, we can easily draw lines to connect them

Note: this data then feeds texture mapping

process

Models

• face– the area between lines

(sides) of a polygon• typically triangles or

quadrilaterals

• surface– a face or many faces

together

A wireframe model of a table

Textures

• Textures are 2D images

• We can wrap the wireframe in a texture

How is texturing done?

• We have triangle data (3 vertices)• We specify for each triangle, texture mapping in U,V

coordinates– refers to pixel region of an image

• After vertices are transformed:– texels are mapped onto triangles– specified by a modeler

• We’re talking mapping individual texture pixels onto screen– high-resolution texture takes longer

• Note: GPUs are optimized for all of this

(0, 0)

(1, 1)

3D Game World

Game Matrices

Matrix Projections

Matrix Projections

Table Data

Table & Camera Matrices

Texturing

Texturing

For a cube

• How many triangles– 12 (2 per face)

• How many vertices?– 8

• Common question: how should we store this data?

Making other shapes using Triangles

• How many vertices, edges, & triangles to make a cube?– 8 vertices?

– 18 edges

– 12 triangles

• How about an x-wing fighter?– 3099 vertices

– 9190 edges

– 6076 triangles

http://gts.sourceforge.net/samples.html

One approach

• Make a data structure called triangle with 3D– x, y, z

• For each model, store a data structure of triangles– For cube, 12 triangles would fill data structure– How many vertices is that?

• 36

– Not efficient

Graphics Data

• While a scene is being rendered, where should the vertex data be stored?– storing it in system memory (RAM) requires slow

copying to the video card– storing it directly in the graphics card is best

• this is where vertex buffers come in

What is a Vertex Buffer?

• A memory store in the GPU for vertices

• In Direct3D for example, one can use the VertexBuffer class

– Can store all types of vertices (ex: transformed, with normal, etc …)

• In OpenGL, we’ll use glVertext3D method

• Note: other platforms also have vertex buffers

What is an Index Buffer?

• Remember constructing 36 vertices to create a cube using triangles?– inefficient use of memory

– a real cube only has 8 vertices (one for each cube corner)

• In a large-scale application, redundant data is costly• Index buffers are a mechanism for sharing vertex data

among primitives– a buffer that stores indices into vertex data

• What does that mean?

– an array (or vector, etc.) that describes shapes (e.g., triangles) using indices of constructed vertices in vertex buffer

• groups of 3 indices describe one triangle

A Cube Index Buffer Solutionprivate short[] indices = {

0,1,2, // Front Face

1,3,2, // Front Face

4,5,6, // Back Face

6,5,7, // Back Face

0,5,4, // Top Face

0,2,5, // Top Face

1,6,7, // Bottom Face

1,7,3, // Bottom Face

0,6,1, // Left Face

4,6,0, // Left Face

2,3,7, // Right Face

5,2,7 // Right Face

};

Advantages & Disadvantages of Index Buffers

• What are the advantages?– more efficient memory management

• What are the disadvantages?– vertices have to share color data– vertices have to share normal data– may result in lighting errors

What is a Depth Buffer?• A means for storing depth information for rendering• Used during rasterization to determine how pixels occlude

(block) each other, algorithm:– convert each surface that’s drawn to a set of pixels– for each pixel, compute the distance from the view plane– before each pixel is drawn, compare it with the depth value

already stored at that on-screen pixel– if the new pixel is closer (in front of) what’s in the depth buffer,

the new pixel’s color & depth values replace those that are currently there

• In Direct3D & OpenGL, can be simply turned-on:– depth buffer management is done for you– you may choose format:

• z-buffers• w-buffers, a type of z-buffer that provides more precision

– not as widely supported in hardware