Game Programming 06The Rendering Engine

2010 년 2 학기디지털콘텐츠전공

Rendering in Video Games

• Depth-Buffered Triangle Rasterization– Virtual Scene– Virtual Camera– Various Light Sources– Visual Properties

Solving the Rendering Equation (Shading Equation)

Rendering in Video Games

• Purpose of the rendering:– Photorealism – Stylized look (cartoon, sketch, watercolor and

so on)

Describing a Scene

• Scene is composed of objects:– Opaque (solid) object

• Surfaces (triangles) define its shape• Don’t care about inside

– Transparent object

Representing object (surface)• Surface: a two-dimensional sheet

composed of an infinite number of points in 3D

• Representation– Analytical form (parametric surface equation)– Collection of Patches– Triangle mesh

Representing object (surface)• Analytical form (parametric surface

equation)– Ex.) Sphere equation

2222 rzyx

Representing object (surface)• Collection of Patches– Patch: a simple rectangular surfaces – Similar to a quilting– Ex.) NURBS, Bezier Surfaces, Subdivision

Surface

Quilt

NURBS surfaceNURBS modeling

Representing object (surface)• Triangle mesh– A piece-wise linear approximation to the

surface

Piece-wise linearapproximation to a function

Piece-wise linearapproximation to a surface

Representing object (surface)• Triangle mesh– Using a triangle because:

• It is the simplest type of polygon• It is always planar• It still remains a triangle after transformations such as

affine (projective) transformation• All graphics card support a hardware acceleration to

draw it

Triangle Mesh

• Tessellation– A process of dividing a surface up into a

collection of triangles

• LOD (Level-of-detail)

Triangle Mesh

• Winding Order– How to define the front/back face direction– Counterclockwise (CCW) / Clockwise(CW)

Counterclockwise winding order

Computing normal direction

21

21

vv

vvn

Triangle Mesh

• Representation of mesh– Triangle list

1v

2v

3v4v

5v

6v

7v

1v 2v 4v 2v 3v 4v 1v 5v 2v

iv : 점의 좌표

Triangle Mesh

• Representation of mesh– Indexed Triangle List

1v

2v

3v4v

5v

6v

7v

1v 2v 3v 4v 5v 6v 7v 8v

: 점의 좌표iv

Vertex list:

0 1 3 1 2 3 0 4 1 Indexed triangle list:

0 1 2 3 4 5 6 7

Triangle Mesh

• Other representation of mesh– Triangle strip– Triangle fan

Triangle strip Triangle fan

1v 2v 3v 4v 5v 6vVertex list: 0v

Model space

• Positions of a triangle mesh’s vertices are usually specified relative to a local coordinate system. (front/left/up)

left

up

front

World space and mesh instance • Individual meshes are located in a scene

(world)

• Mesh instance:– Any one mesh might appear many times in a

scene– Representation:

• Reference mesh, and its transformation matrix

red: model coord.

black: world coord.

Visual properties of a surface• Information needed to define a final color

in the rendered image:

– Direction of surface normal– Diffuse color– Shininess/reflectivity– Roughness– Texture– Opacity or transparency– Other optical properties

: How light should interact with the surface

Introduction to Light

• What we see is a result of complex interactions of light with matter.

• Four main interactions of light– Absorption– Reflection– Transmission / refraction (bent)– Diffraction

Introduction to Light

• Absorbed by a surface

Why does red look red?

Introduction to Light

• Reflected by a surface

Introduction to Light

• Transmitted through a media– Partially absorbed or refracted

Color model

• Color model: how to represent a color– RGB (Red-Green-Blue):

• RGB888 (8 bit for each channel: 0~255 integer) – 24 bit

• RGB565 (5 bit for red, and blue, 6 bit for green) – 16 bit

– HSV (Hue-Saturation-Value)

– LDR (Low Dynamic Range) vs. HDR (High Dynamic Range) • HDR: RGB in a higher precision (float value)

Color model

• LDR with various exposes and tone mapping

Alpha channel

• Representing opacity• A fourth channel to RGB RGBA or ARGB– RGBA8888 – 32 bit per pixel– RGBA5551 – 16 bit per pixel

Vertex Attributes

• Position vector (x, y, z)• Vertex normal (nx, ny, nz)• Diffuse color (dr, dg, db)• Specular color (sr, sg, sb)• Texture coordinates (u, v)• Skinning weights (w1, w2, …)

Attribute interpolation

• Flat shading and Gouraud shading

Gouraud Shading:Inside color is interpolated from the vertex colors

Texture maps

• To overcome the per-vertex attribute, using image to fill-in the polygons

Texture maps

• To overcome the per-vertex attribute, using image to fill-in the polygons

+ =

Texture maps

• Texture coordinates:– 2D coordinate system defined on an image– Denoted as (u,v): uv-coordinate

u

v

u

v

Types of textures

• Types of textures– Diffuse map– Bump map– Normal map– Gloss map– Environment map

Types of textures

• Diffuse map– describing diffuse surface color

Types of textures

• Bump map (similarly displacement map)– Describes small perturbations in height

A sphere without bump mapping (left). A bump map to be applied to the sphere (middle). The sphere with the bump map applied

(right)

Types of textures

• Normal map: encodes normal vectors

Low vs. high res. Low res. + diffuse map Low res. + diffuse + normal

Types of textures

• Gloss map (similarly specular map) – encoding how shiny a surface should be

Types of textures

• Environment map– containing a picture of surrounding

environment for reflection

Mipmapping

• Different resolution of the texture with respect to the distance between an object and a camera

OGRE::Mesh in action

• Get the sample file at our home page

• Create your own cylinder mesh from scratch.