Rendering in games - CNRvcg.isti.cnr.it/~tarini/teaching/gamedev2015/25... · 2015. 12. 18. ·...

Video Game Dev - Univ Insubria

2015/2016

18/12/2015

Marco Tarini 1

Video Game Dev 2015/2016Univ. Insubria

Rendering in games

Rendering

Scena 3D Immaginerendering

screen buffer

( array 2D di pixel )


2015/2016

18/12/2015

Marco Tarini 2

Rendering nei games

� Real time

� (20 o) 30 o 60 FPS

� Hardware based

� Pipelined, stream processing

� Complessità:

� Lineare col numero di primitive

� Classe di algoritmi:

� rasterization based

Il triangolo

x

y z

v0 =( x0, y0, z0 )

v1 =( x1, y1, z1 )

v2 =( x2, y2, z2 )


2015/2016

18/12/2015

Marco Tarini 3

GPU pipeline

GPU pipeline – simplified


2015/2016

18/12/2015

Marco Tarini 4

GPU pipeline – simplified more

GPU pipeline – simplified even more

vertici3D

fragmentprocess

pixelsfinali

"frammenti"(fragments)

transform

z x

v0v1

v2

rasterizer

y

triangolo 2Da schermo(2D screen

triangle)

v0v1

v2

9


2015/2016

18/12/2015

Marco Tarini 5

Rasterization based rendering: base schema

� Per vertice: (vertex shader)� skinning (from rest pose to current pose)

� transform (from object space to screen space)

� Per triangle: (rasterizer)� rasterization

� interpolation of per-vertex data

� Per fragment: (fragment shader)� lighting (from normal + lights + material to RGB)

� texturing

� alpha kill

� Per pixel: (after the fragment shader)� depth test

� alpha blend

Rasterization-Based Rendering

3D vertices

perfragment

finalpixels

"fragments"

per vertex

z x

v0v1

v2

per triangle

y

2D triangleon screen

v0v1

v2

11

PROGRAMMABLE!


2015/2016

18/12/2015

Marco Tarini 6

Rasterization-Based Rendering

3D vertices

perfragment

finalpixels

"fragments"

per vertex

z x

v0v1

v2

per triangle

y

2D triangleon screen

v0v1

v2

12

The user-defined"Vertex Shader"(or vertex program)

The user-defined"Fragment Shader"

(or pixel program)

Shading languages

� High level:

� HLSL (High Level Shader Language, Direct3D,

Microsoft)

� GLSL (OpenGL Shading Language)

� CG (C for Graphics, Nvidia -- deprecated)

� Low lever:

� ARB Shader Program

(the “assembler” of GPU -- deprecated)


2015/2016

18/12/2015

Marco Tarini 7

Rendering effects:local lighting

Local lighting

LIGHT

EYEOBJECT

reflection

(BRDF)


2015/2016

18/12/2015

Marco Tarini 8

Local lighting

Material

parameters(data modelling

the «material»)

Illuminant(data modelling

lighting

environment)

Geometric data(e.g. normal,

tangent dirs,

pos viewer)

LO

CA

LL

IGH

TIN

Gfinal

R, G, B

( the lightingequation )

Lighting equations

� Many different equations…� Lambertian

� Blinn-Phong

� Beckmann

� Heidrich–Seidel

� Cook–Torrance

� Ward (anisotropic)

� …

� add Fresnel effects

� Varying levels of� complexity

� realism� (some are physically based, some are… just tricks)

� material parameters allowed

� richness of effects

simplest, most commonly used

to learn more,

see Computer

Graphics course!


2015/2016

18/12/2015

Marco Tarini 9

Lighting equations:most common cases

� Diffuse (aka Lambertian)� physically based

� only dull materials

� only material parameter:

� base color (aka albedo, aka “diffuse” color)

� Specular (aka Blinn-Phong)� just a trick

� add simulated reflections (highlights)

� additional material parameters:

� specular intensity (or, color)

� specular exponent (aka glossiness)

Local lighting

Material


the «material»)


lighting

environment)


tangent dirs,

pos viewer)

LO

CA

LL

IGH

TIN

G

final

R, G, B



lighting

environment)


2015/2016

18/12/2015

Marco Tarini 10

Illumination environments:discrete

� a finite set of “light suroces”� few of them (usually 1-4)

� each sitting in a node of the scene graphs

� types:� point light sources

� have: position

� spot-lights� have: position,

orientation, wideness (angle)

� directional light sources � have: orientation only

� extra attributes:� color

� intensities

� (other minor attributes)

Illumination environments:densely sampled

� From each direction

(on the sphere)

a light intensity / color

� Asset to store that:

“Environment map”

θ

φ

180-180

90

-90


2015/2016

18/12/2015

Marco Tarini 11

Local lighting

Material


the «material»)

Illuminat(data modelling

lighting

environment)


tangent dirs,

pos viewer)

LO

CA

LL

IGH

TIN

Gfinal

R, G, B


Material


the «material»)

GPU rendering of a Meshin a nutshell (reminder)

� Load…

� store all data on GPU RAM

� Geometry + Attributes

� Connectivity

� Textures

� Shaders

� Material Parameters

� Rendering Settings

� …and Fire!

� send the command: “do it” !

THE MESH ASSET

THE MATERIAL ASSET


2015/2016

18/12/2015

Marco Tarini 12

Terminology

� Material parameters

� parameters modelling the optical behavior

of physical object

� part of the input of the lighting equation

� Material asset

� an abstraction used by game engines

� consisting of

� a set of textures (e.g. diffuse + specular + normal map)

� a set of shaders (vertex + fragment)

� a set of global parameters (e.g. global glossiness)

� rendering settings (e.g. back face culling?)

� corresponds to the status of the rendering engines

Material parameters


2015/2016

18/12/2015

Marco Tarini 13

Authoring material parameters

� Q: which materials parameters needs be

defined?

A: depends on chosen lighting equation

� Idea:

game engine lets material artist choose

intuitively named material parameters,

then pick a lighting equation accordingly

� the one best suiting them

� “speak material-artist language”

Authoring material parameters

� Popular choice of “intuitive parameters”:

� Base color (rgb)

� Specularity (scalar)

� “Metal-ness” (scalar)

� Roughness (scalar)

ima

ge

s: u

nre

al e

ng

ine

4


2015/2016

18/12/2015

Marco Tarini 14

“Physically based materials”

� Basically, a buzzword ☺� Meanings:

� 1. use accurate material parameters� physically plausible � maybe measured

� instead of: invented and tuned by intuition (by the material artist)

� 2. keep each lighting element separated(e.g. its own texture)� use fewer shortcuts that usual� e.g. use:

� base color: one texture

� baked AO: another texture

� instead of:� base color x baked AO : one texture

Ambient Occlusion:

see later

Local lighting in brief

Material

properties(data modelling

the «material»)


lighting

environment)


tangent dirs,

pos viewer)

LO

CA

LL

IGH

TIN

G

final

R, G, B



tangent dirs,

pos viewer)


2015/2016

18/12/2015

Marco Tarini 15

Reminder: normals

� Per vertex attribute of meshes

Reminder:Tangent dirs

normal mapping

(tangent space)

requires tangent dirs

«anisotropic»

BRDF:

requires tantent dir


2015/2016

18/12/2015

Marco Tarini 16

Material qualities: improving

indie 2006 indie 2010

Material qualities: improving


2015/2016

18/12/2015

Marco Tarini 17

Local lighting in brief

LO

CA

LL

IGH

TIN

Gfinal

R, G, B


Material

properties(data modelling

the «material»)


lighting

environment)


tangent dirs,

pos viewer)

Lighting equation:how

� Computed in the fragment shader� most game engine support a subset as default ones

� any custom one can be programmed in shaders!

� Material + geometry parameters stored :� in textures (highest freq variations)

� in vertex attributes (smooth variations)

� as “material assets” parameter (no variation)

� for example, where are� diffuse color� specular color� normals� tangent dirs

typically stored?


2015/2016

18/12/2015

Marco Tarini 18

How to feed parametersto the lighting equation

� Hard wired choice of the game engine

� WYSIWYG game tools

� E.g. in Unreal Engine 4

Rendering techniques

popular in games

� Shadowing� shadow mapping

� Screen Space Ambient Occlusion

� Camera lens effects� Flares

� limited Depth Of Field

� Motion blur� High Dynamic Range� Non Photorealistic Rendering

� contours

� toon BRDF

� Texture-for-geometry� Bumpmapping

� Parallax mapping

SSAO

DoF

HDR

NPR

con PCF


2015/2016

18/12/2015

Marco Tarini 19

Shadow mapping

Shadow mapping


2015/2016

18/12/2015

Marco Tarini 20

Shadow mappingin a nutshell

Two passes.

1st rendering: camera in light position� produces: depth buffer� called:

the shadowmap

2nd renedring: camera in final position

� for each fragment� access

the shadowmap onceto determineif fragment is reachedby light or not

Shadow mappingin a nutshell

OCCHIOLUCE

SHADOW

MAP

final

SCREEN

BUFFER


2015/2016

18/12/2015

Marco Tarini 21

Shadow Mapping:issues

� Rendering shadomap:� redo every time object move� can bake once and for all for static objects� (jet another reason to tag them)

� Shadowmap resolution:� it matters! aliasing effects� remedies: PCF, multi-res shadow-map

optional topics

(no exam)

Screen Space AO


2015/2016

18/12/2015

Marco Tarini 22

Screen Space AO

OFF

Screen Space AO

ON


2015/2016

18/12/2015

Marco Tarini 23

Screen Space AOin a nutshell

� First pass: standard rendering� produces: rgb image

� produces: depth image

� Second pass: screen space technique� for each pixel, look at depth VS its neighbors:

� neighbors in front? difficult to reach pixel: darken ambient

� neighbors behind? pixel exposed to ambient light: keep it lit

(limited)Depth of Field

depth

in focus

range:

sharpdepth

out of focus

range:

blurred


2015/2016

18/12/2015

Marco Tarini 24

(limited) Depth of Field in a nutshell

� First pass: standard rendering

� rgb image

� depth image

� Second pass:

screen space technique:

� pixel inside of focus range? keep

� pixel outside of focus range? blur

� (blur = average with neighbors pixelskernel size ~= amount of blur)

HDR - High Dynamic Range(limited Dynamic Range)


2015/2016

18/12/2015

Marco Tarini 25

HDR - High Dynamic Rangein a nutshell

� First pass: normal rendering, BUTuse lighting / materials with HDR � pixel values not in [0..1]

� e.g. sun emits light with = RGB [500,500,500]:

� >1 = “overexposed”! “whiter than white”

� Second pass: screen space technique:� blur image, then clamp in [0,1]

� i.e.: overexposed pixels lighten neighbors

� i.e.: they will be max white (1,1,1),and their light bleeds into neighbors

Parallax Mapping

Normal map

only


2015/2016

18/12/2015

Marco Tarini 26

Parallax Mapping

Normal map

+ Parallax map

Parallax mapping:in a nutshell

� Texture-for-geometry technique

� Texture used:

� displacement maps

� color / rgb map


2015/2016

18/12/2015

Marco Tarini 27

Motion Blur

NPR rendering / Toon shading / Cel Shading


2015/2016

18/12/2015

Marco Tarini 28

NPR rendering:Toon shading / Cel Shading

Toon shading / Cel Shadingin a nutshell

� Simulating “toons”

� Two effects:

� add lines

� at discontinuity lines of:1. depth, 2. normals, 3. materials

� quantize lighting:

� e.g. 2 or 3 tones: light, medium, darkinstead of continuous

� simple variation of lighting equation


2015/2016

18/12/2015

Marco Tarini 29

NPR rendering:simulated pixel art

img by Howard Day (2015)


img by Dukope


2015/2016

18/12/2015

Marco Tarini 30


img by Dukope

Rendering in games - CNRvcg.isti.cnr.it/~tarini/teaching/gamedev2015/25... · 2015. 12. 18. ·...

Documents

Transcript of Rendering in games - CNRvcg.isti.cnr.it/~tarini/teaching/gamedev2015/25... · 2015. 12. 18. ·...