### Control Keys

move to next slide (also Enter or Spacebar).
move to previous slide.
d  enable/disable drawing on slides
p  toggles between print and presentation view
CTRL  +  zoom in
CTRL  -  zoom out
CTRL  0  reset zoom

Slides can also be advanced by clicking on the left or right border of the slide.

### Notation

Type Font Examples
Variables (scalars) italics $a, b, x, y$
Functions upright $\mathrm{f}, \mathrm{g}(x), \mathrm{max}(x)$
Vectors bold, elements row-wise $\mathbf{a}, \mathbf{b}= \begin{pmatrix}x\\y\end{pmatrix} = (x, y)^\top,$ $\mathbf{B}=(x, y, z)^\top$
Matrices Typewriter $\mathtt{A}, \mathtt{B}= \begin{bmatrix}a & b\\c & d\end{bmatrix}$
Sets calligraphic $\mathcal{A}, B=\{a, b\}, b \in \mathcal{B}$
Number systems, Coordinate spaces double-struck $\mathbb{N}, \mathbb{Z}, \mathbb{R}^2, \mathbb{R}^3$

### List of Math Symbols

Symbol Meaning
$\Omega$ Solid angle
$\theta$ Polar angle in the spherical coordinate system
$\phi$ Azimuth angle in the spherical coordinate system
$\Phi$ Luminous flux
$I$ Luminous intensity
$E$ Illuminance
$L$ Luminance
$\mathrm{f}_r$ BRDF (Bidirectional Reflection Distribution Function)
$\mathrm{f}_d$ Diffuse part of the BRDF
$\mathrm{f}_s$ Specular part of the BRDF

### List of Math Symbols

Symbol Meaning
$\mathbf{n}$ Surface normal
$\mathbf{v}$ Unit vector in view direction
$\mathbf{l}$ Unit vector in light direction
$\eta$ Refractive index
$F$ Fresnel reflectance
$\mathbf{h}$ Halfway vector between light and view direction
$(\dots)_+$ Ramp function
$\langle \mathbf{a}\cdot \mathbf{b}\rangle$ Scalar product

### Light

• Light is a quantized, electromagnetic wave
• The visible range is between 380 and 770nm
• The color of visible light corresponds to its wavelength
• Light sources often emit a wide spectrum. Due to the superposition of many frequencies, the light appears white (e.g., daylight)

### Perception of Light by the Human Eye

• Light is emitted from a light source
• Some rays of light may hit the eye directly; others are reflected from an object's surface towards the eye
• When it is reflected on the object surface, part of the light is typically absorbed, i.e. the light changes its color
• If the light rays hit the eye, receptors on the retina are activated and an image is formed in the brain

### Color Perception: Trichromatic Theory

There are two systems of light sensory cells in humans:

• System 1: rods that only react to light/dark contrasts
• System 2: Three types of color receptors
• L-cones
Wavelength
Normalized absorption
• M-cones
• S-cones
Data source for figure: J. K. Bowmaker, H. J. A. Dartnall: Visual pigments of rods and cones in a human retina., The Journal of Physiology, Volume 298, Issue 1, Jan. 1980

### Color Spaces

RGB color model
• A color space comprises all colors that can be represented within the color model
• In this lecture the additive RGB color space (red, green, blue) is used exclusively
• But there are also numerous other models, such as

## Rendering equation

### Rendering Equation Fundamentals: Solid Angle

$r$
$r^2$
$\Omega=1\,\mathrm{sr}$
• The solid angle $\Omega$ of an arbitrary area $A$ corresponds to the quotient of the area $S$, which results when $A$ is projected onto a sphere of radius $r$, and $r^2$:

$\Omega = \int\limits_{\omega}d\omega = \frac{S}{r^2}$

• Although the solid angle is a dimensionless quantity, it is specified in the unit "steradian" $\mathrm{sr}$
• The solid angle of a surface of constant size decreases quadratically with the distance from the center of the sphere
• Example: A solid angle of $\Omega=1\,\mathrm{sr}$ encloses ​​on a sphere with the radius $1\,\mathrm{m}$ an area of $1\,\mathrm{m}^2$. The same area located at twice the radius results in $\Omega=\frac{1}{4}\,\mathrm{sr}$
• The following relationship exists between the differential solid angle $d\omega$ and the polar angles $\theta$ and $\phi$:

$\Omega = \int\limits_{\omega}d\omega = \int\limits_{\omega}d\theta(\sin \theta \, d\phi)= \int\limits_{\omega}\sin \theta \, d\theta \, d\phi$

### Rendering Equation Fundamentals: Luminous Flux

• Luminous flux $\Phi$
• Luminous flux = Luminous energy per time

$\Phi = \frac{dQ}{dt} \approx \frac{\Delta Q}{\Delta t}$

• Simplified view:
• Every photon has the energy $E_{\small\mathrm{photon}}=\frac{h \, c}{\lambda}$ with
$h$: Planck constant
$c$: Speed ​​of light
$\lambda$: Wavelength
• Luminous flux = Sum of the photon energies that are emitted per time $\Delta t$
• Unit is "lumen": $[\mathrm{lm}]$. Examples:
• Lightbulb: $1000\,\mathrm{lm}$
• Fluorescent lamp: $2000\,\mathrm{lm}$
• Projector: $2500\,\mathrm{lm}$

### Rendering Equation Fundamentals: Luminous Intensity

• Luminous intensity $I$
• Luminous intensity = Luminous flux per solid angle
$I = \frac{d\Phi}{d\omega} \approx \frac{\Delta \Phi}{\Delta \omega}$
• Luminous intensity = Sum of the photon energies that are emitted per time and solid angle
• Unit: Candela $[\mathrm{cd}]$
• Required if the light source does not radiate equally in all directions

### Rendering Equation Fundamentals: Illuminance

• Illuminance $E$
• Illuminance = Luminous flux per area

$E = \frac{d\Phi}{dA} \approx \frac{\Delta \Phi}{\Delta A}$

• The luminous flux comes from all directions within the hemisphere above the surface
• Unit: Lux $[\mathrm{lx}] = [\mathrm{lm}/\mathrm{m}^2]$
• Simplified view: Sum of the photon energies that are received per time and area

### Rendering Equation Fundamentals: Luminance

• Luminance $L$ $[\mathrm{cd}/\mathrm{m}^2]$
• Luminance = Luminous flux per solid angle and visble area

$L = \frac{d^2\Phi}{d\omega\, \cos(\theta) \,dA} \approx \frac{\Delta \Phi}{\Delta \omega\, \cos(\theta) \,\Delta A}$

• The area viewed from direction $\theta$ appears shortened by the factor $\cos(\theta)$
• Application:
• Corresponds to the observed brightness/color
• Luminous flux in the direction of the eye
$\theta$
$\theta$
$\Delta A$
$\cos(\theta) \,dA$
• Simplified view: Sum of the photon energies that are emitted per time, solid angle, and visible area

### Rendering Equation

• The rendering equation calculates the outgoing luminance $L_o(\mathbf{v})$ for the surface point $\mathbf{x}$ with normal $\mathbf{n}$ in the direction $\mathbf{v}$ by integrating over the contributions of all incoming luminances $L_i(\mathbf{l})$ of the hemisphere above the surface

$L_o(\mathbf{v}) = L_e(\mathbf{v}) + \int\limits_\Omega \mathrm{f}_r(\mathbf{v}, \mathbf{l})\, \, \underbrace{L_i(\mathbf{l}) \cos(\theta) \, d\omega}_{dE(\mathbf{l})}$

$\mathbf{x}$
$\theta$
$L_i(\mathbf{l})$
$L_o(\mathbf{v})$
$\Omega$
$\mathbf{n}$
• $L_o(\mathbf{v})$ outgoing luminance
• $L_e(\mathbf{v})$ is the luminance emitted by the surface itself
• $L_i(\mathbf{l})$ incoming luminance
• $E(\mathbf{l})$ illuminance
• $\mathrm{f}_r(\mathbf{v}, \mathbf{l})$ is the so-called "Bidirectional Reflection Distribution Function" (BRDF)
• $\Omega$ is the totality of all angles of the hemisphere above the surface

## BRDF

### BRDF (Bidirectional Reflection Distribution Function)

• The BRDF describes the angle-dependent spectral reflection factor of a surface by the ratio of the outgoing luminance $L_o$ and the incomming illuminance $E$

$\mathrm{f}_r(\mathbf{v}, \mathbf{l}) = \frac{ dL_o(\mathbf{v})} { dE(\mathbf{l})}$

• Incoming direction $\mathbf{l}$ and outgoing direction $\mathbf{v}$ can be parameterized with polar angles $\theta$ und $\phi$. Consequently, the BRFD is a 4-dimensional function.
• By specifying this 4D function, the reflection properties of a surface are described precisely

### BRDF (Bidirectional Reflection Distribution Function)

• The "shape" of the BRDF determines the reflective properties of a surface

### BRDF (Bidirectional Reflection Distribution Function)

• The BRDF of a particular material can be measured and stored in a 4D table
• Such tables can be found in material databases
• 4D tables require a lot of memory and the materials cannot be edited directly
• Therefore, for most cases, parametric BRDF models are used (Phong, Blinn-Phong, Cook-Torrance etc.)

### BRDF Properties

• Positivity:
$\mathrm{f}_r(\mathbf{v}, \mathbf{l}) \ge 0 \quad \forall \, \mathbf{v}, \mathbf{l} \in \Omega$
• Helmholtz reciprocity:
$\mathrm{f}_r(\mathbf{v}, \mathbf{l}) = \mathrm{f}_r(\mathbf{l}, \mathbf{v})$
i.e., incoming and outgoing directions can be swapped
• Energy conservation:
$\int\limits_\Omega \mathrm{f}_r(\mathbf{v}, \mathbf{l})\, \cos(\theta) d\omega \le 1$

### Simplification of the Rendering Equation

• The exact evaluation of the rendering equation is very computationally intensive
• The outgoing luminance $L_o$ of one (infinitely small) surface is incoming luminance $L_i$ bei allen anderen. for all others. Even if all luminance values have been exchanged once, it continues recursively.
• The equation becomes much simpler if the light exchange between surfaces is neglected and only the so-called "direct" light is taken into account, which is emitted from a small number $j$ of light sources
• With the illuminance $E_j$ of light source $j$ the equation becomes a simple sum
$L_o(\mathbf{v}) = L_e(\mathbf{v}) + \sum \limits_j \mathrm{f}_r(\mathbf{v}, \mathbf{l}) \, E_j(\mathbf{l})$
• We will see later how the illuminance $E$ of a light source can be calculated. Until then, we are using a simple directional light source with the illuminance:
$E = E_\perp \cos(\theta)$
• First, we deal with several parametric BRDF models

## Phong BRDF

### Phong BRDF

$\mathbf{x}$
$\theta$
$\alpha$
$\mathbf{v}$
$-\mathbf{l}$
$\mathbf{r}$
$\mathbf{n}$
• Simple non-physical BRDF model [Phong 1975]
• Superposition of diffuse + specular reflection
$\mathrm{f}_r(\mathbf{v}, \mathbf{l}) = \mathrm{f}_d(\mathbf{v}, \mathbf{l}) + \mathrm{f}_s(\mathbf{v}, \mathbf{l})$
• The diffuse reflection creates a constant luminance in all directions
$\mathrm{f}_d(\mathbf{v}, \mathbf{l}) = k_d$
• The specular reflection is approximated by a cosine lobe, the exponent   $n_s$ controls the roughness of the surface
$\mathrm{f}_s(\mathbf{v}, \mathbf{l}) = k_s \cos(\alpha)^{n_s}$
with
$\cos \alpha = \langle \mathbf{v} \cdot \mathbf{r}\rangle$
• The larger the exponent $n_s$, the more the reflected light is bundled (smoother surface)

### Phong BRDF

• According to the law of reflection, the reflection direction has the same angle to the surface normal as the light direction
Angle of incidence = Angle of reflection
• The reflection direction $\mathbf{r}$ is therefore calculated from the surface normal $\mathbf{n}$ and the light direction $\mathbf{l}$ by:
$\mathbf{r} = 2 \,(\mathbf{l}^\top \mathbf{n}) \, \mathbf{n} - \mathbf{l}$
$-\mathbf{l}$
$\mathbf{r}$
$\mathbf{n}$
• GLSL provides the function reflect to calculate the reflection direction  $\mathbf{r}$
vec3 reflectDir = reflect(-lightDir, normal);

### Example: Phong BRDF with a Directional Light Source

• Example: To render a 3D model with one directional light source and the Phong BRDF, the following function must be implemented:
\begin{align} L_o(\mathbf{v}) &= L_e(\mathbf{v}) + \mathrm{f}_r(\mathbf{v}, \mathbf{l}) \,\, E_\perp \cos(\theta) \\ &= L_e(\mathbf{v}) + \left(k_d + k_s \,\cos(\alpha)^{n_s} \right) \,\, E_\perp \cos(\theta)\\ &= L_e(\mathbf{v}) + \left(k_d + k_s \,\,\langle \mathbf{v} \cdot \mathbf{r}\rangle^{n_s} \right) \, E_\perp \,\,\left(\langle \mathbf{l} \cdot \mathbf{n}\rangle\right)_+\\ \end{align}
$\mathbf{x}$
$\theta$
$\alpha$
$\mathbf{v}$
$-\mathbf{l}$
$\mathbf{r}$
$\mathbf{n}$
• There should only be a contribution when the surface faces the light. Hence, $(x)_+$ denotes the ramp function
$(x)_+ = \begin{cases} x & \,\,:\,\, x \ge 0 \\ 0 & \,\,:\,\, 0 < 0 \end{cases}$
this can be implemented in GLSL with
 x = max(x, 0.0);

### Ambient Term

• By simplifying the rendering equation, indirect light is not modeled
• As a result, those parts of the scene that are not directly illuminated are not visible
• Therefore, the missing indirect lighting is approximated by a constant luminance $L_a$
• $L_a$ is the luminance that the ambient light would produce on ideal white surface

### Example: Phong BRDF with a Directional Light Source

• The ambient component $k_a$ can be added to the emitted luminance. If the emitted luminance is zero, this results in:
$L_e = k_a$
• So there are three parts in total:
$\quad \quad \quad k_a \quad \quad \quad + \quad k_d E_\perp \cos(\theta) \quad + k_s \cos(\alpha)^{n_s} E_\perp \cos(\theta) = \quad L_o(\mathbf{v})$
Ambient Diffus Spekular
• Since this is a non-physical model, the user can freely set the parameters $k_a$, $k_d$, $k_s$ and the exponent $n_s$
• The larger the exponent $n_s$, the more the reflected light is bundled (smoother surface)

### Example: Phong BRDF in GLSL

#version 140
in vec3 position;
in vec2 texcoord;
in vec3 normal;

uniform mat4 projection;
uniform mat4 modelview;
uniform mat4 normalMat;

out vec2 tc;
out vec3 fn;
out vec3 vertPos;

void main(){
tc = texcoord;
fn = vec3(normalMat * vec4(normal, 0.0));
vec4 vertPos4 = modelview * vec4(position, 1.0);
vertPos = vec3(vertPos4) / vertPos4.w;
gl_Position = projection * modelview * vec4(position, 1.0);
}

### Example: Phong BRDF in GLSL

#version 140
out vec4 outColor;

in vec2 tc;
in vec3 fn;
in vec3 vertPos;

uniform int mode;
uniform vec3 lightDirection;

const vec4 ambientColor = vec4(0.094, 0.0, 0.0, 1.0);
const vec4 diffuseColor = vec4(0.5, 0.0, 0.0, 1.0);
const vec4 specularColor = vec4(1.0, 1.0, 1.0, 1.0);
const float shininess = 20.0;
const vec4 lightColor = vec4(1.0, 1.0, 1.0, 1.0);
const float illumiPerp = 1.0;

vec3 phongBRDF(vec3 lightDir, vec3 viewDir, vec3 normal,
vec3 phongDiffuseCol, vec3 phongSpecularCol, float phongShininess) {
vec3 color = phongDiffuseCol;
vec3 reflectDir = reflect(-lightDir, normal);
float specDot = max(dot(reflectDir, viewDir), 0.0);
color += pow(specDot, phongShininess) * phongSpecularCol;
return color;
}

void main() {
vec3 lightDir = normalize(-lightDirection);
vec3 viewDir = normalize(-vertPos);
vec3 n = normalize(fn);

vec3 luminance = ambientColor.rgb;

float illuminance = max(dot(lightDir, n), 0.0) * illumiPerp;
if(illuminance > 0.0) {
vec3 brdf = phongBRDF(lightDir, viewDir, n,
diffuseColor.rgb, specularColor.rgb, shininess);
luminance += brdf * illuminance * lightColor.rgb;
}

outColor.rgb = luminance;
outColor.a = 1.0;
}

• The previous example transforms the normals into the camera coordinate system (this corresponds to the approach in the OpenGL Fixed-Function-Pipeline)
• This means that the global light direction must also be available in the camera coordinate system. Therefore, when the camera is moving the direction of light in the host code is dynamically transformed and sent to the shader using a uniform variable (as shown in the previous example)
• As the trend is towards more and more light sources in a scene, it can be advantageous to perform the shading in the global coordinate system
• Instead of transforming many light sources into the camera coordinate system, only a single camera position has to be transformed into the global world coordinate system
• In order to carry out the shading in the world coordinate system, the normals must also be transformed into this space

• In order to calculate normals in the world coordinate system, the model view matrix must be split in the shader:
$\underline{\tilde{\mathbf{P}}} = \mathtt{A} \, \underbrace{\mathtt{T}_{\mathrm{\small cam}}^{-1} \, \mathtt{T}_{\mathrm{\small obj}}}_{\mathtt{T}_{\mathrm{\small modelview}}} \, \underline{\mathbf{P}}$
• In the following example:
• mat4 cameraProjection is the transformation $\mathtt{A}$ from the camera coordinate system into the image plane
• mat4 cameraLookAt is the transformation $\mathtt{T}_{\mathrm{\small cam}}^{-1}$ from the world coordinate system to the camera coordinate system
• mat4 meshTransform is the transformation $\mathtt{T}_{\mathrm{\small obj}}$ from the local coordinate system to the world coordinate system
• mat4 meshTransformTransposedInverse is the transformation $\mathtt{T}_{\mathrm{\small obj}}^{-\top}$ of the normal into the world coordinate system

### Example: Phong Shading in World Space

#version 140
in vec3 position;
in vec2 texcoord;
in vec3 normal;

uniform mat4 cameraLookAt;
uniform mat4 cameraProjection;
uniform mat4 meshTransform;
uniform mat4 meshTransformTransposedInverse;

out vec2 tc;
out vec3 wfn;
out vec3 vertPos;

void main(){
tc = texcoord;
wfn = vec3(meshTransformTransposedInverse * vec4(normal, 0.0));
vec4 vertPos4 = meshTransform * vec4(position, 1.0);
vertPos = vec3(vertPos4) / vertPos4.w;
gl_Position = cameraProjection * cameraLookAt * vertPos4;
}

### Example: Phong Shading in World Space

#version 140
out vec4 outColor;

in vec2 tc;
in vec3 wfn;
in vec3 vertPos;

uniform int mode;
uniform vec3 cameraPosition;

const vec3 lightDirection = vec3(0.0, -1.0, -1.0);
const vec4 ambientColor = vec4(0.094, 0.0, 0.0, 1.0);
const vec4 diffuseColor = vec4(0.5, 0.0, 0.0, 1.0);
const vec4 specularColor = vec4(1.0, 1.0, 1.0, 1.0);
const float shininess = 20.0;
const vec4 lightColor = vec4(1.0, 1.0, 1.0, 1.0);
const float illumiPerp = 1.0;

vec3 phongBRDF(vec3 lightDir, vec3 viewDir, vec3 normal,
vec3 phongDiffuseCol, vec3 phongSpecularCol, float phongShininess) {
vec3 color = phongDiffuseCol;
vec3 reflectDir = reflect(-lightDir, normal);
float specDot = max(dot(reflectDir, viewDir), 0.0);
color += pow(specDot, phongShininess) * phongSpecularCol;
return color;
}

void main() {
vec3 lightDir = normalize(-lightDirection);
vec3 viewDir = normalize(cameraPosition - vertPos);
vec3 n = normalize(wfn);

vec3 luminance = ambientColor.rgb;

float illuminance = max(dot(lightDir, n), 0.0) * illumiPerp;
if(illuminance > 0.0) {
vec3 brdf = phongBRDF(lightDir, viewDir, n,
diffuseColor.rgb, specularColor.rgb, shininess);
luminance += brdf * illuminance * lightColor.rgb;
}

outColor.rgb = luminance;
outColor.a = 1.0;
} 

### Modified Phong BRDF

• One problem with the original Phong BRDF is that the principle of energy conservation is not fulfilled. In reality, it is not possible to reflect more luminance than was received. Thus:
$\int\limits_\Omega \underbrace{\left(\mathrm{f}_d(\mathbf{v}, \mathbf{l}) + \mathrm{f}_s(\mathbf{v}, \mathbf{l})\right)}_{\mathrm{f}_r(\mathbf{v}, \mathbf{l})}\, \cos(\theta) d\omega \le 1$
• Integration over the half-space for the diffuse part:
\begin{align}\int\limits_\Omega \mathrm{f}_d(\mathbf{v}, \mathbf{l})\, \cos(\theta) d\omega = \int\limits_{0}^{2\pi}\, \int\limits_{0}^{\pi/2} k_d \cos(\theta) \sin(\theta) \, d\theta \, d\phi &= 2\pi \, \Bigg[\frac{-\cos^2(\theta)}{2}\Bigg]_{0}^{\pi/2} \\ &= k_d \, \pi = \rho_d \end{align}
• Integration over the half-space for the specular part:
$\int\limits_\Omega \mathrm{f}_s(\mathbf{v}, \mathbf{l})\, \cos(\theta) d\omega = \int\limits_{0}^{2\pi}\, \int\limits_{0}^{\pi/2} k_s \cos(\theta)^{n_s} \cos(\theta) \sin(\theta) \, d\theta \, d\phi = k_s \frac{2 \pi}{n_s+2} = \rho_s$
• If the condition $\rho_d + \rho_s \le 1$ is met, energy conservation is fulfilled

### Modified Phong BRDF

• Inserting $k_d$ and $k_s$ into the original Phong BRDF results in the energy-conserving modified Phong BRDF:
$\mathrm{f}_r(\mathbf{v}, \mathbf{l}) = \rho_d \frac{1}{\pi} + \rho_s \frac{n_s+2}{2 \pi} \,\cos(\alpha)^{n_s}$
with
$\rho_d + \rho_s \le 1$
$\mathrm{f}_s$
Angle in degree

### Modified Phong BRDF in GLSL

#define RECIPROCAL_PI 0.3183098861837907
#define RECIPROCAL_2PI 0.15915494309189535

vec3 modifiedPhongBRDF(vec3 lightDir, vec3 viewDir, vec3 normal,
vec3 phongDiffuseCol, vec3 phongSpecularCol, float phongShininess) {
vec3 color = phongDiffuseCol * RECIPROCAL_PI;
vec3 reflectDir = reflect(-lightDir, normal);
float specDot = max(dot(reflectDir, viewDir), 0.001);
float normalization = (phongShininess + 2.0) * RECIPROCAL_2PI;
color += pow(specDot, phongShininess) * normalization * phongSpecularCol;
return color;
}


## Blinn-Phong BRDF

### Blinn-Phong BRDF

$\mathbf{x}$
$\theta$
$\mathbf{v}$
$-\mathbf{l}$
$\mathbf{h}$
$\mathbf{n}$
• Instead of the reflected direction, the halfway-vector $\mathbf{h}$ is used:
$\mathbf{h} = \frac{\mathbf{l} +\mathbf{v}}{|\mathbf{l} +\mathbf{v}|}$
$\mathrm{f}_r(\mathbf{v}, \mathbf{l}) = k_d + k_s \, \langle\mathbf{h} \cdot \mathbf{n}\rangle^{n_s}$
• Faster, as it avoids the calculation of the reflected direction
• Closer to physics than the original Phong model, because the reciprocity constraint of the BRDF is fulfilled $\mathrm{f}_r(\mathbf{v}, \mathbf{l}) = \mathrm{f}_r(\mathbf{l}, \mathbf{v})$
• Again, the exponent $n_s$ determines the bundling of the light (larger $n_s$ for a smoother surface)
• If there is also an ambient component $k_a$, the approach is called "Blinn–Phong reflection model". This is very widely used and is also supported by the OpenGL Fixed Function Pipeline.

Blinn-Phong
Phong

### Example: Blinn-Phong BRDF in GLSL

vec3 blinnPhongBRDF(vec3 lightDir, vec3 viewDir, vec3 normal,
vec3 phongDiffuseCol, vec3 phongSpecularCol, float phongShininess) {
vec3 color = phongDiffuseCol;
vec3 halfDir = normalize(viewDir + lightDir);
float specDot = max(dot(halfDir, normal), 0.0);
color += pow(specDot, phongShininess) * phongSpecularCol;
return color;
}

## Microfacet BRDF

### Microfacet BRDF

Microfacets
Macroscopic behavior
$\mathbf{v}$
$-\mathbf{l}$
$\mathbf{h}$
$\mathbf{n}$
• Mathematical modeling of the surface by microfacets (much smaller than a pixel). The rougher the surface, the larger is the variation of their orientation [Cook Torrance 1981]
• Basis for many current physics-based rendering approaches ("Physically-Based Rendering", PBR) [Disney 2012] [Unreal Engine 2013] [Frostbite 2014]
• The BRDF of the specular part is:
$\Large \mathrm{f}_s(\mathbf{v}, \mathbf{l}) = \frac{\mathrm{F}(\mathbf{v},\mathbf{h})\,\mathrm{D}(\mathbf{h})\,\mathrm{G}(\mathbf{l},\mathbf{v},\mathbf{h})}{4\,\,\langle\mathbf{n} \cdot \mathbf{l}\rangle\,\,\langle\mathbf{n} \cdot \mathbf{v}\rangle}$
with
• $\mathrm{F}$: Fresnel reflectance
• $\mathrm{D}$: Normal distribution function (NDF)
• $\mathrm{G}$: Geometry term

### Fresnel Reflectance

• The ratio of reflected and transmitted light depends on the angle of incidence of the light rays and the refractive indices of the materials
Image source: Blue Lounger Beside Swimming Pool, CC0, public domain

### Fresnel Reflectance: Dielectrics

• Light is either reflected, transmitted or absorbed with an angle-dependent relative frequency
• The reflected part is scattered on the microfacets. Macroscopically, this creates the specular part of the reflection.
• In opaque materials, the transmitted parted is randomly deflected below the surface, partially absorbed (wavelength dependent) and emitted at different angles. Macroscopically, this creates the diffuse part of the reflection.
• The more light is reflected, the less light is transmitted (and the diffuse part becomes smaller)
Microfacets
Macroscopic behavior
$\mathbf{n}$
Specular part
Diffuse part

### Fresnel Reflectance: Metals

• In metals, the transmitted portion is absorbed, i.e. there is no diffuse reflection
• The reflected part depends on the wavelength, so the specular part is colored
Microfacets
Macroscopic behavior
$\mathbf{n}$
Specular part

### Fresnel Equations

$\eta_1$
$\eta_2$
$\theta_1$
$\theta_1$
$\theta_2$
$\mathrm{F}$
$1-\mathrm{F}$
• Reflected part:
\begin{align} \mathrm{F}_{\tiny\mbox{para}} &= \frac{\eta_2 \cos \theta_1 - \eta_1 \cos \theta_2}{\eta_2 \cos \theta_1 + \eta_1 \cos \theta_2}\\ \mathrm{F}_{\tiny\mbox{perp}} &= \frac{\eta_1 \cos \theta_1 - \eta_2 \cos \theta_2}{\eta_2 \cos \theta_1 + \eta_1 \cos \theta_2}\\ \mathrm{F} &= \frac{1}{2} \left(\mathrm{F}_{\tiny \mbox{para}}^2 + \mathrm{F}_{\tiny\mbox{perp}}^2\right) \end{align}
• Refracted part: $1 - F$
• In case of a transition from an optically thinner to optically denser medium ($\eta_1 < \eta_2$), the ray is deviated towards the normal. In the other case, the ray is deviated away from the normal.
• The mathematical relationship between the angle of incidence $\theta_1$ and the angle of the refracted ray $\theta_2$ is:
$\eta_1 \sin(\theta_1) = \eta_2 \sin(\theta_2)$

### Fresnel Reflectance (Dielectrics)

Material Index of Refraction $\mathrm{F}_0$
Vacuum 1.0 0%
Air 1.000292 ≈ 0%
Water 1.333 2%
Glass 1.5 4%
Plastic 1.5 to 1.58 4% to 5%
Diamond 2.42 17.24%
• $\mathrm{F}_0$ is the reflectance for perpendicular incidence of light $\theta_1 = 0$:
$\mathrm{F}_0 = \frac{(\eta_2 - \eta_1)^2}{(\eta_2 + \eta_1)^2}$

### Fresnel Reflectance (Metals)

Metals $\mathrm{F}_0$ (Linear, Float) $\mathrm{F}_0$ (sRGB, 8-bit) Color
Titanium (0.542, 0.497, 0.449) (194, 187, 179)
Chrome (0.549, 0.556, 0.554) (196, 197, 196)
Iron (0.562, 0.565, 0.578) (198, 198, 200)
Nickel (0.660, 0.609, 0.526) (212, 205, 192)
Platinum (0.673, 0.637, 0.585) (214, 209, 201)
Copper (0.733, 0.697. 0.652) (250, 209, 194)
Palladium (0.733, 0.697, 0.652) (222, 217, 211)
Zinc (0.664, 0.824, 0.850) (213, 234, 237)
Gold (1.022, 0.782, 0.344) (255, 229, 158)
Aluminum (0.913, 0.922, 0.924) (245, 246, 246)
Silver (0.972, 0.960, 0.915) (252, 250, 245)
Source: Naty Hoffman: Physics and Math of Shading, SIGGRAPH 2015 Course: Physically Based Shading in Theory and Practice

### Fresnel Reflectance

• In the microfacet model, the angle $\theta_1$ is the angle between the viewing direction $\mathbf{v}$ and the half-vector $\mathbf{h}$, because only those microfacets, which have the macroscopic half-vector as normal, have a reflection in the viewing direction
• According to [Cook Torrance 1981] the reflectance for $\eta_1 = 1$ is calculated by:
\begin{align}c &= \langle\mathbf{v} \cdot \mathbf{h}\rangle \\ g &= \sqrt{\eta_2^2+ c^2 - 1}\\ F_{\tiny \mbox{Cook-Torrance}}(\mathbf{v}, \mathbf{h}) &= \frac{1}{2} \left( \frac{g - c}{g + c} \right)^2 \left( 1 + \left( \frac{ c\,(g + c) - 1 }{ c\,(g - c)+ 1 } \right)^2 \right) \end{align}
Microfacets
Macroscopic behavior
$\mathbf{v}$
$-\mathbf{l}$
$\mathbf{h}$
$\mathbf{n}$

### Fresnel Reflectance

• Alternatively, the Schlick approximation [Schlick 1994] of the Fresnel reflectance can be used, which is faster to compute:
$F_{\tiny \mbox{Schlick}}(\mathbf{v}, \mathbf{h}) = \mathrm{F}_0 + \left(1.0 − \mathrm{F}_0\right) \left(1.0 − \langle\mathbf{v} \cdot \mathbf{h}\rangle \right)^5$
• The figure shows the comparison for glass with $\mathrm{F}_0 = 0.04$
$F_{\tiny \mbox{Cook-Torrance}}$
$F_{\tiny \mbox{Schlick}}$
Angle in degree
Reflectance

### Normal Distribution Function (NDF)

• The distribution of the microfacet normals changes depending on the roughness of the surface
• For a rougher surface, the distribution around the surface normal is more scattered
• There are several suggestions for the normal distribution in the literature [Walter et al. 1994]:
$\mathrm{D}_{\tiny \mbox{Blinn}}(\mathbf{h}) = \frac{1}{ \pi \alpha^2 } \langle\mathbf{n} \cdot \mathbf{h}\rangle^{n_s}$   with  $n_s = 2\alpha^{-2} - 2$
$\mathrm{D}_{\tiny \mbox{Beckmann}}(\mathbf{h}) = \frac{1}{ \pi \alpha^2 \langle\mathbf{n} \cdot \mathbf{h}\rangle^4 } \exp{ \left( \frac{ \langle\mathbf{n} \cdot \mathbf{h}\rangle^2 - 1}{\alpha^2 \langle\mathbf{n} \cdot \mathbf{h}\rangle^2} \right) }$
$\mathrm{D}_{\tiny \mbox{GGX}}(\mathbf{h}) = \frac{\alpha^2}{\pi \left(\langle\mathbf{n} \cdot \mathbf{h}\rangle^2 (\alpha^2-1)+1\right)^2}$
• where $\alpha = r_p^2$ with the perceived roughness $r_p$ in range [0.0, 1.0]

### Geometry Term

• Depending on the direction of incidence of the light and the viewing direction of the observer, shadowing and masking effects occur at the microfacets
• [Blinn 1977] and [Cook Torrance 1981] assume the microfacets are V-shaped and derive a geometry factor $0 \le G \le 1$ from this model.
No interference
$\mathbf{n}$
$-\mathbf{l}$
$\mathbf{v}$
$\mathbf{h}$
$\mathbf{n}$
$-\mathbf{l}$
$\mathbf{v}$
$\mathbf{h}$
$\mathbf{n}$
$-\mathbf{l}$
$\mathbf{v}$
$\mathbf{h}$
$\mathrm{G}_{\tiny \mbox{Cook-Torrance}}(\mathbf{l},\mathbf{v},\mathbf{h}) = \operatorname{min}\left( 1, \frac{ 2 \langle\mathbf{n} \cdot \mathbf{h}\rangle \langle\mathbf{n} \cdot \mathbf{v}\rangle }{ \langle\mathbf{v} \cdot \mathbf{h}\rangle}, \frac{ 2 \langle\mathbf{n} \cdot \mathbf{h}\rangle \langle\mathbf{n} \cdot \mathbf{l}\rangle }{ \langle\mathbf{v} \cdot \mathbf{h}\rangle} \right)$

### Geometry Term

• Another well-known model from [Smith 1967] combines the geometry factor from a component for light direction and one for the view direction:
$\mathrm{G}_{\tiny \mbox{Smith}}(\mathbf{l},\mathbf{v},\mathbf{h}) = \mathrm{G}_1(\mathbf{l}) \mathrm{G}_1(\mathbf{v})$
• Different $\mathrm{G}_1$ according to [Walter et al. 1994] are:
$\mathrm{G}_{1\ \tiny \mbox{Beckmann}}(\mathbf{v}) =\left\{ \begin{array}{l l} \frac{ 3.535 \,c \,+ \,2.181 \,c^2 }{ 1 \,+ \,2.276 \,c \,+ \,2.577 \,c^2 } & : \,\, c < 1.6\\ 1 & : \,\, c \ge 1.6\\ \end{array} \right.$    mit   $c = \frac{\langle\mathbf{n} \cdot \mathbf{v}\rangle}{ \alpha \sqrt{1 - \langle\mathbf{n} \cdot \mathbf{v}\rangle^2} }$
$\mathrm{G}_{1\ \tiny \mbox{GGX}}(\mathbf{v}) = \frac{ 2 \, \langle\mathbf{n} \cdot \mathbf{v}\rangle }{ \langle\mathbf{n} \cdot \mathbf{v}\rangle + \sqrt{ \alpha^2 + (1 - \alpha^2)\langle\mathbf{n} \cdot \mathbf{v}\rangle^2 } }$
• Fast approximation [Schlick 1994] for the GGX variant:
$\mathrm{G}_{1\ \tiny \mbox{Schlick-GGX}}(\mathbf{v}) =\frac{\langle\mathbf{n} \cdot \mathbf{v}\rangle}{\langle\mathbf{n} \cdot \mathbf{v}\rangle(1 - k) + k }$    mit   $k = \frac{\alpha}{2}$

### Geometry Term

$\mathrm{G}_{1\ \tiny \mbox{Beckmann}}$
$\mathrm{G}_{1\ \tiny \mbox{GGX}}$
$\mathrm{G}_{1\ \tiny \mbox{Schlick-GGX}}$
$r_p = 0.00$
$r_p = 0.25$
$r_p = 0.50$
$r_p = 0.75$
$r_p = 1.00$
$\alpha = r_p^2$

### Example: GGX Microfacet BRDF in GLSL

vec3 fresnelSchlick(float cosTheta, vec3 F0) {
return F0 + (1.0 - F0) * pow(1.0 - cosTheta, 5.0);
}

float D_GGX(float NoH, float roughness) {
float alpha = roughness * roughness;
float alpha2 = alpha * alpha;
float NoH2 = NoH * NoH;
float b = (NoH2 * (alpha2 - 1.0) + 1.0);
return alpha2 / (PI * b * b);
}

float G1_GGX_Schlick(float NdotV, float roughness) {
//float r = roughness; // original
float r = 0.5 + 0.5 * roughness; // Disney remapping
float k = (r * r) / 2.0;
float denom = NdotV * (1.0 - k) + k;
return NdotV / denom;
}

float G_Smith(float NoV, float NoL, float roughness) {
float g1_l = G1_GGX_Schlick(NoL, roughness);
float g1_v = G1_GGX_Schlick(NoV, roughness);
return g1_l * g1_v;
}

vec3 microfacetBRDF(in vec3 L, in vec3 V, in vec3 N,
in vec3 baseColor, in float metallicness,
in float fresnelReflect, in float roughness) {

vec3 H = normalize(V + L); // half vector

// all required dot products
float NoV = clamp(dot(N, V), 0.0, 1.0);
float NoL = clamp(dot(N, L), 0.0, 1.0);
float NoH = clamp(dot(N, H), 0.0, 1.0);
float VoH = clamp(dot(V, H), 0.0, 1.0);

// F0 for dielectics in range [0.0, 0.16]
// default FO is (0.16 * 0.5^2) = 0.04
vec3 f0 = vec3(0.16 * (fresnelReflect * fresnelReflect));
// in case of metals, baseColor contains F0
f0 = mix(f0, baseColor, metallicness);

// specular microfacet (cook-torrance) BRDF
vec3 F = fresnelSchlick(VoH, f0);
float D = D_GGX(NoH, roughness);
float G = G_Smith(NoV, NoL, roughness);
vec3 spec = (D * G * F) / max(4.0 * NoV * NoL, 0.001);

// diffuse
vec3 rhoD = vec3(1.0) - F; // if not specular, use as diffuse
rhoD *= 1.0 - metallicness; // no diffuse for metals
vec3 diff = rhoD * baseColor / PI;

return diff + spec;
}

### Light Sources

Point light source
Spotlight
Directional light source
Environment lighting

### Point Light Source

• Sending evenly in all directions (isotropic)
• No expansion (infinitesimal small)
• Simplified mathematical model, not exactly physical
• Typical parameters
• 3D position
• Luminous flux $\Phi$ in lumen $[\mathrm{lm}]$

### Point Light Source

$\mathbf{n}$
$-\mathbf{l}$
$-\mathbf{l}$
$\cos(\theta)dA$
$\theta$
$\theta$
$E_\perp$
$dA$
$dA$
• For a solid angle element it applies that $d\omega = \frac{dA}{r^2}$.
A point light source with
luminous intensity $I$ at distance $r$ produces a perpendicular illuminance of
$E_\perp = \frac{d\Phi}{dA} = \frac{d\Phi}{d\omega \,r^2} = \frac{I}{r^2}$
• At an angle of incidence $\theta$, the area is reduced by $\cos(\theta)$. Therefore, we have:
$E = E_\perp \cos(\theta) = \frac{I}{r^2} \cos(\theta) = \frac{I}{r^2} \langle\mathbf{n} \cdot \mathbf{l}\rangle$

### Point Light Source

• Since the point light source sends uniformly in all directions, the relationship between the light intensity $I$ and the luminous flux $\Phi$ is given by:
\begin{align} &\Phi = \int\limits_{\Omega} I \, d\omega = \int\limits_{0}^{2\pi}\, \int\limits_{0}^{\pi} I\, \sin(\theta) \, d\theta \, d\phi = I \Bigg[-\cos(\theta)\Bigg]_{0}^{\pi} \left(\int\limits_{0}^{2\pi}d\phi\right) = 4\pi \, I\\ \Leftrightarrow & I = \frac{\Phi}{4\pi} \end{align}
• Consequently, the illuminance from a perpendicular direction at a distance $r$ is:
$E_\perp = \frac{I}{r^2} = \frac{\Phi}{4\pi \,r^2}$
• Or at angle of incidence $\theta$:
$E = E_\perp \cos(\theta) = \frac{\Phi}{4\pi \,r^2} \cos(\theta) = \frac{\Phi}{4\pi \,r^2} \langle\mathbf{n} \cdot \mathbf{l}\rangle$

### Example: Blinn-Phong Shading with a Point Light Source

• The position of the point light source is marked by a white ball
• The illuminance decreases quadratically with the distance from the light source

### Spotlight

• Light propagation is limited to certain solid angle (light cone)
• Luminous intensity decrease from the highest value $I_0$ in the main direction of radiation to the edge according to:
$I = I_0 \cos^n(\beta)$
where $\beta$ is the angle between the considered direction and the main direction
• The exponent $n$ determines how the light is focused

### Spotlight

$\mathbf{d}$
$\mathbf{p}$
• Light intensity:
$I = I_0 \cos^n(\beta)$
with luminous intensity in the main direction $I_0$
• Typical parameters:
• 3D position $\mathbf{p}$
• Main direction $\mathbf{d}$
• Luminous flux $\Phi$ in lumen $[\mathrm{lm}]$
• Maximum angle $\beta_{\tiny \mbox{ max}}$
• Focus exponent $n$

### Spotlight

• The relationship between the light intensity $I$ and the luminous flux $\Phi$ is given by:
\begin{align} &\Phi = \int\limits_{0}^{2\pi}\, \int\limits_{0}^{\beta_{\tiny \mbox{ max}}} I_0\, \cos^{n}(\theta) \sin(\theta) \, d\theta \, d\phi = 2\pi \Bigg[\frac{-\cos^{n+1}(\theta)}{n+1}\Bigg]_{0}^{\beta_{\tiny \mbox{ max}}} \, I_0 \\ & \quad = \frac{2\pi}{n+1} \left(1 - \cos^{n+1}(\beta_{\tiny \mbox{ max}}) \right) \, I_0 \\ \Leftrightarrow & I_0 = \frac{n+1}{2\pi \left(1 - \cos^{n+1}(\beta_{\tiny \mbox{ max}}) \right)} \Phi \end{align}
• For the illuminance at the angle of incidence $\theta$ at a distance $r$ we get:
$E = E_\perp \cos(\theta) = \frac{I}{r^2} \cos(\theta) = \frac{I_0}{r^2} \cos^{n} (\beta)\cos(\theta)= \frac{\Phi}{2\pi r^2}\frac{(n+1) \cos^{n}(\beta)\cos(\theta)}{\left(1 - \cos^{n+1}(\beta_{\tiny \mbox{ max}}) \right)}$
• With $n = 1$ and $\beta_{\tiny \mbox{ max}} = \frac{\pi}{2}$:
$E = \frac{\Phi}{\pi r^2} \cos(\beta)\cos(\theta) =\frac{\Phi}{\pi r^2} \langle-\mathbf{l}\cdot \mathbf{d}\rangle \langle\mathbf{n} \cdot \mathbf{l}\rangle$

### Directional Light Source

$-\mathbf{l}$
• With directional light sources, distant light sources (e.g. the sun) can be simulated
• Parameters:
• Direction of light propagation: $-\mathbf{l}$
• Perpendicular illuminance: $E_\perp$
• All light rays hit the scene in the same direction and generate an illuminance of
$E = E_\perp \cos(\theta) = E_\perp \langle\mathbf{n} \cdot \mathbf{l}\rangle$
• Examples:
• Sun with a clear sky: $E_\perp = 100000 \,\mathrm{lx}$
• Sun with an overcast sky: $E_\perp = 25000 \,\mathrm{lx}$
• Full moon with a clear sky: $E_\perp = 0,3 \,\mathrm{lx}$

### Environment lighting

• Environment lighting considers light from all directions
• Often the emitted luminance $L_i$ of the environment is represented by a spherical environment image (Image-based Lighting)
⟶ see next chapter

### References

• [Phong 1975] Bui-T. Phong: Illumination for computer generated pictures. Communications of the ACM, 18(6):311-317, June 1975
• [Blinn 1977] James F. Blinn: Models of light reflection for computer synthesized pictures. SIGGRAPH 1977, pp. 192-198, July 1977
• [Cook Torrance 1981] R. L. Cook and K. E. Torrance: A reflectance model for computer graphics. TOG 1(1):7-24, Jan. 1981.
• [Disney 2012] Brent Burley: Physically Based Shading at Disney SIGGRAPH 2012 SIGGRAPH 2012 Course: Practical Physically Based Shading in Film and Game Production
• [Unreal Engine 2013] Brian Karis: Real Shading in Unreal Engine 4, SIGGRAPH 2013 Course: Physically Based Shading in Theory and Practice
• [Frostbite 2014] S. Lagarde, C. de Rousiers: Moving Frostbite to PBR, SIGGRAPH 2014 Course: Physically Based Shading in Theory and Practice

### References

• [Schlick 1994] Christophe Schlick: An Inexpensive BRDF Model for Physically-Based Rendering. Computer Graphics Forum, 13 (3), 233–246, 1994.
• [Walter et al. 1994] B. Walter, S. R. Marschner, H. Li, K. E. Torrance: Microfacet Models for Refraction through Rough Surfaces. Eurographics Symposium on Rendering, 2007.
• [Smith 1967] B. Smith: Geometrical shadowing of a random rough surface. IEEE Transactions on Antennas and Propagation 15(5):668-671, Sep. 1967

### Are there any questions?

Please notify me by e-mail if you have questions, suggestions for improvement, or found typos: Contact