PBR Materials & Lighting

01What PBR buys

An artist tunes a shiny exponent until a crate looks right in daylight, then the crate looks waxy in the night level and someone tunes it again. Physically based shading models the surface response to light with quantities grounded in physics (energy conservation, the Fresnel effect, a microfacet distribution), so a material authored once holds up across lighting setups, and artists author physically meaningful properties (base color, metallic, roughness) instead of tuning a specular exponent per scene.

The canonical chart is a grid of spheres across roughness and metallic, under a moving light. The highlight tightens at low roughness and the diffuse vanishes as metallic rises:

02The rendering equation

Every lighting model, from a game shader to a film renderer, is an approximation of one equation, and knowing it tells you what your shader leaves out. Everything traces back to Kajiya's rendering equation: the radiance leaving a point toward the viewer is the emitted radiance plus the integral, over the hemisphere of incoming directions, of the BRDF times the incoming radiance times the cosine term^[1].

In words: the light leaving a point toward your eye (L_o) is whatever the surface emits (L_e, usually zero) plus a sum over every incoming direction. The ∫_Ω is that sum: it sweeps the hemisphere of directions ω_i above the surface. For each one, take the incoming light L_i, multiply by the BRDF (the fraction reflected toward the view direction ω_o), and weight by n · ω_i, the cosine that dims light arriving at a slant. Hover any symbol to see what it stands for.

L_o is outgoing radiance (power per projected area per solid angle) toward the viewer; L_e is emitted (nonzero only for emissive surfaces); f_r is the BRDF; L_i is incoming radiance; (n · ω_i) is the Lambert cosine foreshortening; the integral sweeps the hemisphere above the surface.

03The microfacet BRDF

A polished floor shows a sharp highlight and a worn one a broad, dim glow, though both are the same material at a large scale. The difference is at the microscopic scale, so the model describes the surface as a statistical distribution of microscopic mirror facets; roughness controls how spread out their orientations are. The Cook-Torrance specular term is

In words: specular reflection is three statistical terms over a normalizing denominator. D says how many microfacets face the right way to bounce this light to your eye (it sets the highlight's tightness), F is the Fresnel reflectance at those facets, and G discounts facets blocked by their neighbors at grazing angles. The denominator 4 · (n·v) · (n·l) converts the facet statistics back into a per-surface reflectance. Multiply the three on top, divide, and you have the specular lobe.

with the half-vector h = normalize(v + l). The three terms: D is the fraction of facets aligned with h (the normal distribution), F is the Fresnel reflectance at those facets, and G is the fraction not masked or shadowed by neighbors. The choices below (GGX, Smith, Schlick) are the ones Karis adopted for Unreal Engine 4, and they became the common real-time default^[3].

• D, GGX/Trowbridge-Reitz: α² / (π·((n·h)²(α²−1)+1)²), with α = roughness². The long tail gives a bright core with a soft falloff.
• G, Smith with Schlick-GGX: masking times shadowing, G₁(v)·G₁(l); the k remap differs for direct lights versus IBL.
• F, Schlick: F₀ + (1−F₀)(1−(v·h))⁵. Reflectance rises to 1 at grazing angles (the rim).

The teaching form below is the textbook D·F·G/(4·NdotV·NdotL) (matching LearnOpenGL); production often folds G and the denominator into a single visibility term V so specular is D·V·F (Filament's height-correlated V_SmithGGXCorrelated)^[4]:

const float PI = 3.14159265359;

// D: GGX normal distribution. `alpha` is roughness SQUARED.
float distributionGGX(float NdotH, float alpha) {
    float a2 = alpha * alpha;
    float denom = NdotH * NdotH * (a2 - 1.0) + 1.0;
    return a2 / (PI * denom * denom);
}
// G1: Schlick-GGX for one direction. `k` is remapped from PERCEPTUAL roughness (direct-light form).
float geometrySchlickGGX(float NdotX, float k) {
    return NdotX / (NdotX * (1.0 - k) + k);
}
float geometrySmith(float NdotV, float NdotL, float k) {
    return geometrySchlickGGX(NdotV, k) * geometrySchlickGGX(NdotL, k);  // masking * shadowing
}
// F: Schlick Fresnel. F0 = normal-incidence reflectance (0.04 dielectric, baseColor metal).
vec3 fresnelSchlick(float cosTheta, vec3 F0) {
    return F0 + (1.0 - F0) * pow(clamp(1.0 - cosTheta, 0.0, 1.0), 5.0);
}

vec3 shade(vec3 N, vec3 V, vec3 L, vec3 radiance,
            vec3 albedo, float metallic, float perceptualRoughness) {
    vec3  H = normalize(V + L);
    float NdotV = max(dot(N, V), 1e-4);  // floor at 1e-4, not 0: interpolated or normal-mapped normals can push dot(N, V) to 0 or below, which blacks out silhouette pixels; Filament guards the same way (abs + 1e-5)
    float NdotL = max(dot(N, L), 0.0);   // 0 is fine here: the final *NdotL factor already zeroes the output for back-facing light
    float NdotH = max(dot(N, H), 0.0);
    float alpha = perceptualRoughness * perceptualRoughness;            // THE squaring
    float k = (perceptualRoughness + 1.0) * (perceptualRoughness + 1.0) / 8.0;  // direct-light k
    vec3  F0 = mix(vec3(0.04), albedo, metallic);                   // dielectric 0.04, metal = baseColor

    float D = distributionGGX(NdotH, alpha);
    float G = geometrySmith(NdotV, NdotL, k);
    vec3  F = fresnelSchlick(max(dot(H, V), 0.0), F0);
    vec3  specular = (D * G * F) / (4.0 * NdotV * NdotL + 0.0001);  // Cook-Torrance

    vec3 kD = (vec3(1.0) - F) * (1.0 - metallic);                   // energy split; metals: 0
    vec3 diffuse = kD * albedo / PI;                                   // Lambert
    return (diffuse + specular) * radiance * NdotL;                    // cosine OUTSIDE the BRDF
}

The widget shades one sphere with the shader above:

04Diffuse & energy conservation

A surface can't reflect more light than it receives, and a shader that adds a full diffuse and a full specular term on top of each other does exactly that, so materials glow. The diffuse term is Lambert, albedo / π (albedo is the diffuse base color). Energy conservation splits the budget: specular keeps the Fresnel weight, diffuse gets the rest, k_d = (1−F)·(1−metallic). The (1−metallic) factor is why metals have zero diffuse. Reflected diffuse plus specular must not exceed the incoming light.

05Metallic-roughness

An artist hands you a glTF material with a base color, a metallic value and a roughness, and the shader needs F₀, a diffuse color and α. The glTF 2.0 workflow has three core inputs: baseColor, metallic, and roughness. The derived shading quantities^[2]:

• F₀ = lerp(0.04, baseColor, metallic): dielectrics reflect 0.04 at normal incidence, metals reflect their base color.
• c_diff = lerp(baseColor, black, metallic); the spec's diffuse term is (1−F)·c_diff/π, the shader's k_d path in §3.
• α = roughness².

#include <glm/glm.hpp>

// std140-friendly: vec4s keep 16-byte alignment (cross-ref Going 3D). Textures via descriptors.
struct MaterialFactors {
    glm::vec4 baseColorFactor;   // rgba
    float     metallicFactor;
    float     roughnessFactor;
    float     normalScale;
    float     occlusionStrength;
    glm::vec4 emissiveFactor;    // rgb + pad
};
// Guards the memcpy into the UBO: a reordered field or stray padding would
// silently skew every material, and this fails the build instead.
static_assert(sizeof(MaterialFactors) == 48, "must match the std140 block in the shader");

#[repr(C)]
#[derive(Clone, Copy)]
struct MaterialFactors {
    base_color_factor: [f32; 4],
    metallic_factor:   f32,
    roughness_factor:  f32,
    normal_scale:      f32,
    occlusion_strength: f32,
    emissive_factor:   [f32; 4],     // rgb + pad for std140
}
// Guards the byte copy into the UBO, same check as the C++ static_assert. For the
// actual upload, derive bytemuck::Pod + Zeroable to cast &MaterialFactors to bytes safely.
const _: () = assert!(std::mem::size_of::<MaterialFactors>() == 48);

06Normal mapping

Modeling every rivet and brick seam as geometry would cost millions of triangles; a normal map fakes them on a flat surface by telling the lighting which way each texel faces. A normal map stores per-texel surface normals in tangent space (the surface's local frame). The TBN matrix (tangent, bitangent, normal) transforms a sampled normal into world space for lighting. Stored values are a direction, not a color, hence linear; the [−1,1]→[0,1] encode maps a flat normal (0, 0, 1) to (0.5, 0.5, 1.0), the characteristic light-blue cast.

// from a LINEAR/UNORM texture, not sRGB. [0,1] -> [-1,1]
vec3 sampledNormal = texture(normalMap, uv).xyz * 2.0 - 1.0;
// OpenGL (+Y) assumed, which is glTF's convention; for a DirectX (-Y) map: sampledNormal.y = -sampledNormal.y;

vec3 N = normalize(inNormalWS);
vec3 T = normalize(inTangentWS.xyz);
T = normalize(T - dot(T, N) * N);            // Gram-Schmidt re-orthogonalize
vec3 B = cross(N, T) * inTangentWS.w;        // handedness sign from the glTF tangent
mat3 TBN = mat3(T, B, N);
vec3 normalWS = normalize(TBN * sampledNormal);  // tangent space -> world space

The widget lights a flat quad through a normal map:

07Punctual lights

A torch on a wall should light the floor near it brightly and the far corner barely at all, and the sun should light everything the same. Point, directional, and spot lights are punctual: a delta with zero solid angle, so the hemisphere integral collapses to a single BRDF evaluation per light, Lo += shade(...) summed over lights. Point lights fall off as inverse-square (1/d²) in the irradiance they deliver; directional lights deliver constant irradiance; spots add an angular cone.

08HDR & tone mapping

A sunlit wall and the inside of a cave can differ in brightness by a factor of thousands, but the display only shows values from 0 to 1. Lighting results are unbounded (a bright light times albedo easily exceeds 1.0), so you render to a float/HDR target, apply exposure, then a tone-mapping operator that compresses [0,∞) into [0,1], then sRGB-encode for the display.

vec3 color = hdrColor * exposure;         // HDR scene radiance, exposure-scaled
color = color / (color + vec3(1.0));    // Reinhard; many engines use a filmic curve such as an ACES fit instead
// Approximate sRGB encode (gamma 1/2.2; the real sRGB OETF is piecewise) for a
// UNORM swapchain. If the swapchain is an sRGB format, DROP this (hardware
// encodes) -- doing both is the double-correction bug.
color = pow(color, vec3(1.0 / 2.2));

09IBL overview

A chrome sphere in a sunset scene should reflect the orange sky, and a few point lights can't produce that. Punctual lights cover direct light; ambient/environment light comes from image-based lighting. Diffuse IBL uses an irradiance map (the environment convolved with the cosine lobe). For specular, Karis's split-sum splits the reflection integral into two precomputed pieces^[3]: a prefiltered environment map (the specular environment pre-blurred per roughness into mips) and a BRDF integration LUT (a 2D table on NdotV and roughness giving a scale and bias on F0). Specular IBL is then prefiltered · (F₀·scale + bias).

10Pitfalls

11What's next

The surface shades like a real material under direct light. It's still missing the thing that grounds objects in a scene: shadows. The next module, Shadow Mapping, builds it (rendering depth from the light, the bias problem, PCF, and cascades), then deferred rendering and global illumination. The full 3D path is on the series hub.

1. James T. Kajiya. "The Rendering Equation." SIGGRAPH 1986. overview. The integral form real-time rendering approximates.
2. The Khronos Group. glTF 2.0 Specification (metallic-roughness material, Appendix B). registry.khronos.org. F0 = 0.04 dielectric, α = roughness², the texture channels and color spaces.
3. Brian Karis. "Real Shading in Unreal Engine 4." SIGGRAPH 2013. selfshadow.com. The GGX/Smith/Schlick choices, windowed lights, and the split-sum IBL.
4. Google. "Physically Based Rendering in Filament." google.github.io/filament. The most rigorous free reference: the BRDF GLSL, the roughness remap, and multi-scatter compensation.
5. Joey de Vries. LearnOpenGL, "PBR" (Theory / Lighting / IBL). learnopengl.com. The canonical tutorial GLSL and the reflectance loop.
6. Tomas Akenine-Möller, Eric Haines, Naty Hoffman, et al. Real-Time Rendering, 4th ed., ch. 9. realtimerendering.com. Microfacet theory and the physically-based (not correct) framing.
7. Sébastien Lagarde. "Memo on Fresnel equations." seblagarde.wordpress.com. F0 from IOR (1.5 → 0.04) and the dielectric F0 range.
8. Christopher Kulla and Alejandro Conty. "Revisiting Physically Based Shading at Imageworks." SIGGRAPH 2017. selfshadow.com. Multi-scatter energy loss at high roughness and the compensation fix.
9. Erik Reinhard et al. "Photographic Tone Reproduction for Digital Images." SIGGRAPH 2002. cs.utah.edu. The L/(1+L) operator.
10. Krzysztof Narkowicz. "ACES Filmic Tone Mapping Curve." knarkowicz.wordpress.com. The simple ACES fit and its caveat that the luminance-only fit "over saturates brights" (ACES is a look, not ground truth).
11. Marmoset. "Tangent Space & Handedness." docs.marmoset.co. The OpenGL +Y vs DirectX −Y green-channel convention and the tangent handedness sign.