Rasterization Pipelines

Christoph Garth
Scientific Visualization Lab
Motivation
 Contents of this chapter:

• How does a typical graphics card work?

• Pipeline (high level)

• How can it be programmed?

• APIs (OpenGL)

• Fundamental rendering functionality

• z-Buffer, Blending, Textures, ...

• Typical rendering techniques

• Forward vs. Deferred Rendering, Shadow Mapping, ...

Computer Graphics – Rasterization Pipelines– Motivation 10–1

Graphics APIs
 Specification of state (geometry, shaders, . . . )
Application
and draw commands, using API calls.

Translation of API calls to hardware operations

Driver Compilation of shader programs
Emulation of missing functionality

Graphics Hardware Operation: Rasterization, Clipping, Shading, Visibility, . . .

Computer Graphics – Rasterization Pipelines– Graphics APIs 10–2

 The following slides contain illustrating pseudo code examples based on the OpenGL API.

OpenGL (Open Graphics Library) as an API specification is an industry standard to drive

graphics pipelines.

OpenGL 1.0 was developed in 1992 by a consortium of manufacturers of graphics

hardware lead by the SGI (Silicon Graphics Inc.).

Maintenance and advancement of OpenGL is done by the OpenGL ARB (Architecture

Review Board). The current version is OpenGL 4.6 (published in 2017).

Even though the specification is written in C, there are bindings for many programming
languages.

Computer Graphics – Rasterization Pipelines– Graphics APIs 10–3

 OpenGL ES (OpenGL for Embedded Systems) represents a large portion of the base
functionality of OpenGL, with small adaptions for broad platform compatibility and less
powerful platforms (mobile graphics).

WebGL renders hardware accelerated graphics in browser based on JavaScript and the
<canvas>-element. It is based on the OpenGL ES standard.

Overall the different OpenGL variants have a lot in common – knowledge of one variant
carry over to others.

This ia also true for Microsoft Direct3D, the graphics sub-API of DirectX, as well as Vulkan
(cross-platform) and Metal (Apple). Since graphics APIs are thin abstractions of the
graphics hardware, many concepts are similar.

Computer Graphics – Rasterization Pipelines– Graphics APIs 10–4

 OpenGL operates state based – the rendering pipeline is treated as a state machine. The
current state is modified by API commands, e.g.

glEnable( GL_DEPTH_TEST ); //Activate depth testing

To modify object specific states, an object (identified by a name / integer) has to be

bound to a target first. Then the target is modified:

glBindBuffer( gl.ARRAY_TARGET, buffer );

glBufferData( gl.ARRAY_TARGET, ... );

A draw call uses the current state of the pipeline.

glDrawArrays( GL_TRIANGLES, 0, 3 ); // Draw one triangle

Computer Graphics – Rasterization Pipelines– Graphics APIs 10–5

 Note: OpenGL (and also DirectX) have changed dramatically over the years, to take
advantage of newer hardware designs and features. Examples on the internet often
showcase outdated functionality.

Example: Immediate Mode

• Early variant of geometry specification: one vertex after the other

• Obsolete because of bad performance
• Supported by modern OpenGL versions only in a specific compatibility profile

Modern approach: complete specification of geometry, after that the draw call (e.g.
glDrawArrays() –> retained mode

Computer Graphics – Rasterization Pipelines– Graphics APIs 10–6

Rasterization Pipelines
 Geometry
Geometry Processing Topology
Vertices + Attributes
• Transformation and projection of
Vertex Stream
geometry vertices to homogeneous
clip coordinates. Vertex Stage / Shader
(programmable)

Rasterization
Vertex Stream
• Assembly of primitives from vertices
and identification of covered pixels; Primitive Assembly
for each pixel and primitive a Scan Conversion
fragment is generated
Fragment Stream

Fragment Processing Fragment Stage / Shader

• Shading and fragment color (programmable)

calculation; combination with

Fragment Stream
underlying pixel
Output / Blending

Computer Graphics – Rasterization Pipelines– Rasterization Pipelines 10–7

 Almost arbitrary graphical effects can be achieved by programmable vertex and fragment
shaders / stages.

Shading languages: GLSL (OpenGL, Vulkan), HLSL (DirectX), . . .

• Syntax similar to C/C++

• Compile (at start of application)
• Link (join of shader stages)
• Run (draw objects / draw call)
• Platform independent (shader compiler is part of driver)

This is the currently modern state of graphics programming. It is called shader-based

rendering; corresponding APIs are called shader-based APIs.

Computer Graphics – Rasterization Pipelines– Rasterization Pipelines 10–8

 Rendering pipeline coordinate systems:

normalized window
object space view space clip space device coordinates coordinates

Fragment
Stream

Stream
Vertex

Modelview Projection Perspective Viewport

Matrix Matrix Divide Transform

Vertex Stage Vertex Stage Rasterizer Rasterizer

• Modelview Matrix: local coords → camera coords (chapter 9)

• Projection Matrix: projection (chapter 9)

Distinction of the two matrices stems from traditional approaches. In shader-based

pipelines it is not needed, however it is still often done.
Computer Graphics – Rasterization Pipelines– Rasterization Pipelines 10–9
Vertex Stage
 Geometry
Geometry Processing Topology
Vertices + Attributes
• Transformation and projection of Vertex Stream
geometry vertices to homogeneous
Vertex Stage / Shader
clip coordinates.
(programmable)

Vertex Stream

Primitive Assembly
Scan Conversion

Fragment Stream

Fragment Stage / Shader

(programmable)

Fragment Stream

Output / Blending

Computer Graphics – Rasterization Pipelines– Vertex Stage 10–10

 Vertex Shader Inputs:

• Per-Vertex Attributes (one or more per vertex) – attributes / vertex stream

• Vertex position
• (local coordinates), normals, color and more
• Constants – uniforms
• e. g. transformation matrices and general parameters
• specified by application per draw call

Output: Transformed Vertex Stream

• Per-Vertex Variables – varyings

• at least position (gl_Position) in homogeneous clip coordinates
• interpolated per-vertex variables (e. g. color if per-vertex shading)

(gl_Position is always needed and thus automatically declared by system)

Computer Graphics – Rasterization Pipelines– Vertex Stage 10–11
 Vertex Shader – Overview

uniforms
Transformation Matrix
...
constant over all vertices of a draw call

attributes varyings
Position Position
(object space) Vertex (clip space)
Normals Shader Normals
... ...
per vertex per vertex

Computer Graphics – Rasterization Pipelines– Vertex Stage 10–12

 Typical Vertex Shader (GLSL):

1 // input (attributes)
2 in vec3 vertexPosition;
3 in vec3 vertexNormal;
4
5 // output (varyings)
6 out vec3 normal;
7
8 // constant parameters (uniforms)
9 uniform mat4 mvpMatrix;
10 uniform mat3 normalMatrix;
11
12 void main(){
13 // compute transformed vertex in homogeneous clip coordinates
14 gl_Position = mvpMatrix * vec4( vertexPosition, 1.0 );
15
16 // compute normal in world coordinates
17 normal = normalMatrix * vertexNormal;
18 }

Computer Graphics – Rasterization Pipelines– Vertex Stage 10–13

 Setting uniforms (OpenGL / C++)

1 // compile vertex & fragment shader, link program

2 GLint program = buildProgram( ... );
3
4 // create MVP matrix as a Float32Array
5 GLfloat* matrix = createMVPMatrix();
6
7 // use program for future draw calls
8 glUseProgram( program );
9
10 // obtain index of uniform in shader program
11 GLint location = glGetUniformLocation( program, "mvpMatrix" );
12
13 // set mvpMatrix uniform
14 glUniformMatrix4fv( location, GL_FALSE, matrix );

Computer Graphics – Rasterization Pipelines– Vertex Stage 10–14

 Matrices are linearized in 1D arrays: row-major ordering vs. column-major ordering

float rmm[16] = {

row-major
 
a b c d a, b, c, d,

 e f g h 
 e, f, g, h,
i j k l
 
  i, j, k, l,
m n o p m, n, o, p
};

float cmm[16] = {
column-major

 
a b c d a, e, i, m,

 e f g h 
 b, f, j, n,
i j k l
 
  c, g, k, o,
m n o p d, h, l, p
};

OpenGL docs: “The translation components [d, h, l] occupy the 13th, 14th, and 15th
elements of the 16-element matrix.” column-major layout expected.
Computer Graphics – Rasterization Pipelines– Vertex Stage 10–15
 Specification of Input Mesh

Geometry: per vertex one or more attributes are specified

• at least position, additionally color, normal, ...

• saved in arrays (buffers) in graphics memory
• attributes are linked to variables in the vertex shader (later) by a name (string)

Topology: Two options

• indexed face set

indices of triangle vertices are passed in an array / buffer
• face set (special case with implicit indices)

Computer Graphics – Rasterization Pipelines– Vertex Stage 10–16

 Example: specification of a mesh in indexed face set format

• Two attributes (position and normal), one triangle (three vertices)

• One array buffer per attributes (GL_ARRAY_BUFFER) and one for the index array
buffer (GL_ELEMENT_ARRAY_BUFFER)
• Data is copied into the buffer and then declared as attribute

float float float float float float float float float

attribute position V0,x V0,y V0,z V1,x V1,y V1,z V2,x V2,y V2,z

attribute normal N0,x N0,y N0,z N1,x N1,y N1,z N2,x N2,y N2,z

index buffer 0 1 2

uint uint uint

Computer Graphics – Rasterization Pipelines– Vertex Stage 10–17

 Example: 1 // Example: draw a single triangle with position and normal attributes
2
3 // 3 vertices with 3 coordinates each
4 float positions[] = {
5 0.0, 0.0, 0.0,
6 1.0, 0.0, 0.0,
7 0.0, 1.0, 0.0
8 };
9
10 // create buffer in GPU memory
11 GLint positionBuffer
12 glGenBuffers( 1, &positionBuffer );
13 // bind positionBuffer for modification
14 glBindBuffer( GL_ARRAY_BUFFER, positionBuffer );
15 // upload position data to buffer
16 glBufferData( GL_ARRAY_BUFFER, positionData, GL_STATIC_DRAW );
17 // find out the index of this attribute in the vertex shader
18 GLint positionIndex = glGetAttribLocation( program, "vertexPosition" );
19 // associate buffer with the corresponding attribute and set interpretation
20 glVertexAttribPointer( positionIndex, GL_FLOAT, 3, false, 0, 0 );
21
22 // enable attribute
23 glEnableVertexArray( positionIndex );

Computer Graphics – Rasterization Pipelines– Vertex Stage 10–18

 Example: 1 // assume we have also set up a normal attribute in a buffer,
2 // similar to the positionBuffer above
3
4 if( useIndices )
5 {
6 // set up index buffer
7 unsigned int indices[] = { 0, 1, 2 };
8 GLint indexBuffer;
9 glGenBuffer( 1, &indexBuffer );
10 glBindBuffer( GL_ELEMENT_ARRAY_BUFFER, indexBuffer );
11 glBufferData( GL_ELEMENT_ARRAY_BUFFER, indices, GL_STATIC_DRAW );
12 // all set, tell driver to render three vertices using unsigned
13 // integer indices, starting at the first vertex
14 glDrawElements( GL_TRIANGLES, 3, GL_UNSIGNED_INT, 0 );
15 }
16 else
17 {
18 // alternatively, could have used implicit indices (0, 1, 2, ...)
19 glDrawArrays( GL_TRIANGLES, 0, 3 );
20 }

Computer Graphics – Rasterization Pipelines– Vertex Stage 10–19

 Attribute types:

• scalars (float and int)

• vectors (vec2,vec3,vec4)
• matrices (mat2,mat3,mat4)
• etc. → GLSL specification

Per-vertex matrices are used, e. g., in some animation techniques (skinning).

Primitive types:
modern graphics hardware focuses near exclusively on triangles (and potentially lines).

All other primitives are emulated and are no longer supported in OpenGL from version 3.3
onward.

Computer Graphics – Rasterization Pipelines– Vertex Stage 10–20

Rasterization Stage
 Geometry
Topology
Vertices + Attributes
Vertex Stream

Vertex Stage / Shader

(programmable)
Rasterization
Vertex Stream
• Assembly of primitives from vertices
and identification of covered pixels; Primitive Assembly
for each pixel and primitive a Scan Conversion
fragment is generated Fragment Stream

Fragment Stage / Shader

(programmable)

Fragment Stream

Output / Blending

Computer Graphics – Rasterization Pipelines– Rasterization Stage 10–21

 In the primitve assembly, primitives are put together from the transformed vertex stream
and the connectivity (indices) of the primitives.

Afterwards, the following steps are performed:

• Conversion of primitives into other types

• E. g. lines → pixel-wide triangles
• Culling Primitives can be selectively discarded
• E. g. backface culling
• Clipping of parts of the primitive that are outside the viewing volume

• The homogeneous position in clips space is translated into pixel coordinates

Computer Graphics – Rasterization Pipelines– Rasterization Stage 10–22

 Back-face culling:

• Discarding triangles that are oriented away from

the viewer

Rationale: back faces of closed objects cannot

be seen, and thus need not to be drawn.

glFrontFace( GL_CCW );
• Caution: Orientation is set by order of traversal
glCullFace( GL_BACK );
in the image plane and not by the (in principal glEnable( GL_CULLING );
optional) normal vector attribute.

Computer Graphics – Rasterization Pipelines– Rasterization Stage 10–23

 Clipping is done in normalized device coordinates. It is clipped against all six
plane of the frustum, which represent the six faces of an axis-aligned cube.

One method is to use, e. g., an algorithm similar to the Sutherland-Hodgman

algorithm (→ Chapter 3), but other strategies exist (e. g. guard band clipping)

(−1, 1, 1)
(−1, 1, −1) +y (1, 1, 1)
+z
(r, t, f )
+x
(l, t, n)
(r, t, n) (−1, −1, −1) (1, −1, 1)
+y
(l, b, n)
+x (r, b, n) (1, −1, −1)
+z

Computer Graphics – Rasterization Pipelines– Rasterization Stage 10–24

 Fragment Generation:

The rasterizer generates fragments (parts of a primitive that fall into a pixel) from the
primitives (e. g. as described in Chapter 3).

Furthermore:

• If necessary, fragments that are not inside the viewport are discarded.
• Interpolation of varyings (e.g. barycentric)
• Interpolation of z-coordinate and depth test ( later)
• Stencil test ( later)

The rasterizer is not programmable, but several functions can be selectively

enabled/disabled, e. g. depth test, stencil test, . . .

Computer Graphics – Rasterization Pipelines– Rasterization Stage 10–25

 Illustration: fragment generation

For each covered pixel, a fragment is generated.

For each created fragment:

vertex attributes from the vertex shader (varyings) are
interpolated barycentrically at the pixel center.

Computer Graphics – Rasterization Pipelines– Rasterization Stage 10–26

 Perspective-correct interpolation: The interpolation of the variables could theoretically
be done directly in pixel coordinates. This, however, leads to incorrect behavior due to
perspective effects (projection is not affine).

Better: including depth information (interpolation of z)

Affine interpolation along scan lines: ua = (1 − α)u0 + αu1
(1 − α) uz00 + α uz11
Perspectively correct interpolation: ua =
(1 − α) z10 + α z11

Computer Graphics – Rasterization Pipelines– Rasterization Stage 10–27

 Result of rasterization: a set of fragments, each with

• pixel coordinates
• interpolated z-value
• interpolated attributes (color, normals,. . . )

These are emitted as a fragment stream to the fragment stage and are processed there
(typically in parallel).

per-fragment data

x y z CR CG CB Nx Ny Nz ...

Computer Graphics – Rasterization Pipelines– Rasterization Stage 10–28

Fragment Stage
 Geometry
Topology
Vertices + Attributes

Vertex Stream

Vertex Stage / Shader

(programmable)

Vertex Stream

Primitive Assembly
Scan Conversion

Fragment Stream
Fragment Processing
Fragment Stage / Shader
• Shading and fragment color (programmable)

calculation; combination with

Fragment Stream
underlying pixel
Output / Blending

Computer Graphics – Rasterization Pipelines– Fragment Stage 10–29

 Per incoming fragment, the fragment shader is executed. It computes a color for the
fragment (e. g. diffuse lighting) and outputs it.

// input (interpolated from vertex shader output)

in vec3 normal;

// output
out vec4 fragColor;

// constant parameters
uniform vec3 lightDirection;
uniform vec3 objectColor;

void main()
{
vec3 nnormal = normalize( normal );
float kd = max( 0.0, dot( nnormal, lightDirection ) );

fragColor = vec4( kd*objectColor, 1.0 );

}

Computer Graphics – Rasterization Pipelines– Fragment Stage 10–30

Output & Blending
 Example: If multiple objects are drawn to a pixel in random order, only the frontmost
object should be visible.

3 1 4 2

In general, the sorting of the primitives is

not possible, e. g. if objects overlap in a
cycle (no object is the foremost).

Computer Graphics – Rasterization Pipelines– Output & Blending 10–31

 What is the z-coordinate needed for?
+∞

It gives the distance to the near plane and is used far plane
for the so-called depth test (→ output stage) 1
view
frustum
Depth test: If fragments of multiple surfaces fall
into the same pixel, only the fragment that is 0

nearest to the viewer is kept (smallest −1

near plane
z-coordinate).

For this, a dedicated buffer is needed (depth

buffer) which holds per pixel the depth (in
normalized device coordinates / NDC) of the last behind
camera
rendered fragment (initial value: 1.0). −∞

Computer Graphics – Rasterization Pipelines– Output & Blending 10–32

 Aside: In a typical pipeline implementation, additional buffers (besides the output pixel
colors) are used:

• color (pixel) buffer: stores RGB(A) for

each pixel
(RGB = color, A = opacity / alpha)
• depth buffer: stores a depth /
z-value for each pixel
• stencil buffer: stores a bitmask for
each pixel color buffer
depth buffer
stencil buffer
Often, the term framebuffer is used to
designate all of these buffers. OpenGL
calls these attachments.

Computer Graphics – Rasterization Pipelines– Output & Blending 10–33

 Before a fragment is written to the output image, its z-value is compared to the one
stored in the depth buffer.

• The depth buffer is initialized with the largest possible depth (1.0)
• If a fragment produces an output in the color buffer, its z-value is written to the
depth buffer.
• A fragment only produces output if its z-value is smaller than the one stored in the
depth buffer.

Computer Graphics – Rasterization Pipelines– Output & Blending 10–34

 Depth Test (continued): The depth buffer stores the depth of the previously nearest
fragment for each pixel.

Illustration:

Typically, the depth buffer does not store z directly, but 2

(z+1) ∈ [0, 1] which gives a higher
accuracy closer to the viewer.

If the z-value is not changed by the fragment shader, the depth test can be performed
before the fragment stage. This is done often in practice (→ early-z).

Computer Graphics – Rasterization Pipelines– Output & Blending 10–35

 The depth test cann be explicitly (de-)activated in OpenGL,

glEnable( GL_DEPTH_TEST );

Additionally, a comparator function may be specified,

glDepthFunc( GL_LESS );

For some specific effects it might be useful to do the depth test without overwriting the
z-buffer:

glDepthMask( GL_FALSE );

Computer Graphics – Rasterization Pipelines– Output & Blending 10–36

 The stencil buffer can be used to exclude pixels from rendering.

During fragment rendering, a bitmask can be set in the stencil or manipulated by logical
operators (AND, OR, XOR).

Later fragments are tested with logical bit operation against the existing values and are
shaded only if the test is not returning 0.

The stencil test occurs after the depth test in the pipeline.

Computer Graphics – Rasterization Pipelines– Output & Blending 10–37

 Illustration: Stencil Test

1. Initialize stencil buffer with 0

2. Rendering of the knot

3. Rendering of the ground

Set stencil for all respective
pixel to 1

4. Rendering of the mirrored knot

with stencil test: render only
fragments for which stencil is 1

with stencil test without stencil test

Computer Graphics – Rasterization Pipelines– Output & Blending 10–38

 Depth and stencil buffer are Start Depth Test
often integrated into a single
buffer, e. g. Is Depth Testing enabled?
No

Yes
24 bit depth Compare src and dst depth values
+8 bit stencil Depth Test result

= 32 bit
No
Is Depth Write enabled?
This minimizes memory access
cost if both are in use. Yes
End Depth Test
No
Is Stencil Test Result TRUE?
Historically, depth and stencil
Yes
test are often integrated in the
Apply Depth Write Mask and
End Depth Test
same hardware unit. save depth component

End Depth Test

logical sequence of depth and stencil test

Computer Graphics – Rasterization Pipelines– Output & Blending 10–39

 Blending determines how the calculated fragment colors (source color / src) are
combined with the already existing colors in the color buffer (destination color / dst).

There are different blend functions that allow for various effects.

Computer Graphics – Rasterization Pipelines– Output & Blending 10–40

 Alpha blending combines fragment colors (src) with pixel colors (dst) via the opacity
(α-value) of both colors:

Intuition: α ∈ [0, 1] describes which fraction of the fragment color is carried over into the
pixel.

Illustration:
α-blending

Computer Graphics – Rasterization Pipelines– Output & Blending 10–41

 Illustration: α-blending (per fragment)

Computer Graphics – Rasterization Pipelines– Output & Blending 10–42

 Blend Over:

• Assume two objects with colors (C1 , α1 ) and (C2 , α2 )

• Object 1 is drawn after object 2.
• Blending of the two colors results in

C = α1 C1 + (1 − α1 )α2 C2
α = α1 + (1 − α1 )α2

Example: (C1 , α1 ) = (1, 0, 0, 0.6), (C2 , α2 ) = (0, 0, 1, 0.5)

C = 0.6 · (1, 0, 0) + 0.4 · 0.5 · (0, 0, 1) = (0.6, 0.0, 0.2)

α = 0.6 + 0.4 · 0.5 = 0.8

Computer Graphics – Rasterization Pipelines– Output & Blending 10–43

 Blending and Depth Buffer:

Correct transparency via blending requires that fragments further in front are drawn after
fragments further in back (correct z-order). The depth buffer cannot ensure this.

In order to correctly represent transparent objects, the following approach can be used:

1. Delete color / opacity in (0, 0, 0, 0) in the color buffer

2. Render opaque objects using z-buffering.
3. Sort transparent objects back to front (distance to the viewer)
4. Render transparent objects in sorted order with blend over

Computer Graphics – Rasterization Pipelines– Output & Blending 10–44

 OpenGL does not Parameter (fR , fG , fB , fA )
implement specific blend
GL_ZERO (0, 0, 0, 0)
modes; rather the mode is
GL_ONE (1, 1, 1, 1)
modeled via weight
GL_ONE_MINUS_SRC_COLOR (1, 1, 1, 1) − ( kRs , Gs Bs
, , As
)
functions for src and dst. R kG kB kA
Rd Gd Bd Ad
GL_DST_COLOR (k , k , k , k )
R G B A
R G B Ad
E. g. blend over: GL_ONE_MINUS_DST_COLOR (1, 1, 1, 1) − ( kd , k d , kd ,
R G B kA
)
GL_SRC_ALPHA ( kAs , kAs , kAs , kAs )
A A A A
glEnable( GL_BLEND ); GL_ONE_MINUS_SRC_ALPHA (1, 1, 1, 1) − ( kAs , kAs , kAs , As
)
A A A kA
A A A A
glBlendFunc(
GL_DST_ALPHA ( kd , kd , kd , kd )
A A A A
A A A Ad
GL_SRC_ALPHA, GL_ONE_MINUS_DST_ALPHA (1, 1, 1, 1) − ( kd , kd , kd , kA
)
A A A
GL_ONE_MINUS_SRC_ALPHA GL_CONSTANT_COLOR (Rc , Gc , Bc , Ac )
);
GL_ONE_MINUS_CONSTANT_COLOR (1, 1, 1, 1) − (Rc , Gc , Bc , Ac )
GL_CONSTANT_ALPHA (Ac , Ac , Ac , Ac )
GL_ONE_MINUS_CONSTANT_ALPHA (1, 1, 1, 1) − (Ac , Ac , Ac , Ac )
GL_SRC_ALPHA_SATURATE (i, i, i, 1)

Computer Graphics – Rasterization Pipelines– Output & Blending 10–45

 Blend unit operation: fragments after depth test

Start blending
If blending is deactivated
No
(default), the pixel color is Is blending enabled?

simply replaced by the Source 1 from pixel Source 2 already in the

fragment color. shader output output render target
Yes
Controls how to Controls how to
Other blend equations also modulate the pixel modulate the render
shader output [optional target [optional pre-
supported in modern pre-blend operation] blend operation]

hardware, see
glBlendEquation(). Blend operation Use pixel shader output

Apply render target

write mask and save

End blending

Computer Graphics – Rasterization Pipelines– Output & Blending 10–46

 With this we have covered all essential parts of the
rasterization pipeline.
We could not cover all aspects in detail; these are
very complex in parts and offer much flexibility. We
have scratched the surface and understood the
high-level workings.
In a modern pipeline, there are additional
programmable stages (geometry shaders,
tesselation shaders, compute shaders).
For modern 3D graphics, the algorithms presented
here highly optimized. Very nice write-up:
A trip through the Graphics Pipeline, F. Giesen

Detailed pipeline diagram (OpenGL 4.4): here.

Computer Graphics – Rasterization Pipelines– Output & Blending 10–47

Rendering Techniques
 In contrast to ray tracing / path tracing, rasterization pipelines do not automatically yield
physically correct behavior.

Many effects have to be recreated (with large efforts) and only represent a bad copy of
the real physics.

Examples:

• Shadows
• Reflection
• Refraction
• Caustics
• ...

In the following, we will discuss some common techniques.

Computer Graphics – Rasterization Pipelines– Rendering Techniques 10–48

 Shadows are global effects which are not represented by the local illumination model of
the fragment shader.

Instead, the following approach is used:

1. Render the scene with the light source as the view point and create a depth image
(shadow map) that encodes the distance to the light source.

scene without shadows depth image with the light source as view point

Computer Graphics – Rasterization Pipelines– Rendering Techniques 10–49

 2. Render the scene from the camera view point, while projecting the fragments into
the view of the light source.
3. Test whether a point lies in front (illuminated) or behind (in the shadow) the value
stored in the depth image of the light source.

points in shadow scene with shadows

Computer Graphics – Rasterization Pipelines– Rendering Techniques 10–50

 Illustration:

Computer Graphics – Rasterization Pipelines– Rendering Techniques 10–51

 By using a simple approach, artifacts can occur due to the low resolution of the shadow
map (shadow acne).

Computer Graphics – Rasterization Pipelines– Rendering Techniques 10–52

 By filtering of the shadow map (e. g. blurring), artifacts can be partially avoided and soft
shadows created.

In video games etc. a multitude of different techniques are used that achieves the
desired compromise between the different aspects (empirical realism, performance, type
of light source).

The acquired result look very compelling, the methods, however, are equally complex.

Computer Graphics – Rasterization Pipelines– Rendering Techniques 10–53

 Mapping of the environment of an object, e. g. for reflection or lighting (“environment
lighting”), also called reflection mapping or environment mapping.

There are many techniques for this, too.

Computer Graphics – Rasterization Pipelines– Rendering Techniques 10–54
 Ambient Occlusion: Imitation of global illumination
from ambient light.

Better depth perception by ambient occlusion.

Computer Graphics – Rasterization Pipelines– Rendering Techniques 10–55

 This can be procomputed if the geometry is static baking.

The computed ambient occlusion is multiplied with the direct illumination in the
fragment shader. More details in Chapter 11.

Computer Graphics – Rasterization Pipelines– Rendering Techniques 10–56

 Deferred Rendering: If the computation of the fragment shaders is expensive, it makes
sense to only apply the shader to the actually visible fragments.

The overdraw factor measures how many fragments fall into one pixel averaged over the
whole image.

scene visualization of overdraw factor

(lighter → more fragments)

A large overdraw factor indicates high costs for to shader evaluation and memory
bandwidth (color/z-buffer)
Computer Graphics – Rasterization Pipelines– Rendering Techniques 10–57
 For deferred rendering (also deferred shading) different buffers holding the relevant
information for the shading are created.

diffuse color normals (encoded in RGB) z-buffer

Together, these buffers are called G-buffer (G → geometry).

Since the amount of information inside the g-buffer exceeds the capacity of a
RGBA-buffer, multiple images have to be created simultaneously. For this, multiple render
targets (MRT) are used.

Computer Graphics – Rasterization Pipelines– Rendering Techniques 10–58

 If the G-buffer is created, it is rendered as a fullscreen rectangle inside the image, during
this the actual shading is executed. Color, normal and depth buffer are read as textures
(→ Chapter 12).

final image

Computer Graphics – Rasterization Pipelines– Rendering Techniques 10–59

 This allows for tricks, like, e. g., the intersection of lights and the scene, which enhances
the shading performance drastically.

The volume hit by the light (represented by the wire frame) is painted into the scene. The
resulting fragments are shaded with the light source.

light volume of a spotlight

Computer Graphics – Rasterization Pipelines– Rendering Techniques 10–60

 Deferred rendering is
especially useful in the case
of
• many light sources
• complex lighting
situations
• large overdraw

In contrast to “normal” rendering (forward rendering), there are disadvantages, e. g.

anit-aliasing (→ Chapter 12) and performance problems induced by the required memory
bandwidth of the G-buffer.

In practice, there is a lot of engineering involved to successfully implement deferred

rendering.

Computer Graphics – Rasterization Pipelines– Rendering Techniques 10–61

 Achieving realism in rasterization pipelines while maintaining good performance is no
easy task. Therefore, often software frameworks (game engines) are used that already
supply a large amount of the implementation.

Common engines:

• Unreal Engine
• Source Engine
• C4 Engine
• Unity
• ...

Besides the actual rendering, these engines support tasks like the loading of so-called
assets (meshes, textures,. . . )

Computer Graphics – Rasterization Pipelines– Rendering Techniques 10–62

Recap
 Recap: In this chapter, we have considered

• the general operation of rasterization pipelines and their individual stages (vertex
stage, rasterization, fragment stage, output stage),
• fundamental programming of such pipelines using the OpenGL API,
• concepts of shader-based rendering and shader programming, such as variable
types (uniforms, attributes, varyings),
• depth testing and stencil testing for correct visibility and advanced rendering,
• blending for transparency rendering,
• some techniques to achieve high-quality rendering including global illumination
aspects in rasterization pipelines.

In the next chapter, we will discuss mapping techniques, which allows us to describe
complex surface appearance easily.

Computer Graphics – Rasterization Pipelines– Recap 10–63