Lesson 6
HDR: Tone Mapping, Bloom effect
PV227 – GPU Rendering
Jiˇrí Chmelík, Jan ˇCejka
Fakulta informatiky Masarykovy univerzity
05. 11. 2019
PV227 – GPU Rendering (FI MUNI) Lesson 6 – HDR 05. 11. 2019 1 / 31
HDR – Theory Basics
High Dynamic Range
HDRI (“high dynamic range imaging”)
HDRR (“high dynamic range rendering”)
Developed to make on-screeen rendering more natural
(human-eye like)
Range of intensities:
software: often only 8 bits ⇒ only 256 steps
hardware: quite limited (black is not black, bright white is much less
brighter than sun light)
human eye. . .
PV227 – GPU Rendering (FI MUNI) Lesson 6 – HDR 05. 11. 2019 2 / 31
Human Eye – Range of perceptible intensities
illumination condition illuminance (lux)
Full moon 1
Street lighting 10
Home lighting 30 to 300
Office desk lighting 100 to 1 000
Surgery lighting 10 000
Direct sunlight 100 000
Vast range of perceptible intensities. But not concurrently!
PV227 – GPU Rendering (FI MUNI) Lesson 6 – HDR 05. 11. 2019 3 / 31
Human Eye Perception Imperfection
What are the colors of marked fields?
PV227 – GPU Rendering (FI MUNI) Lesson 6 – HDR 05. 11. 2019 4 / 31
Human Eye Perception Imperfection
What are the colors of marked fields? The SAME!
PV227 – GPU Rendering (FI MUNI) Lesson 6 – HDR 05. 11. 2019 5 / 31
Capturing, Rendering
We can capture (or model) and “realistically” render both the dark
scenes and the bright scenes without HDR.
The problem is with scenes with high dynamic range...
PV227 – GPU Rendering (FI MUNI) Lesson 6 – HDR 05. 11. 2019 6 / 31
Capturing HDR Content
To capture HDR content with LDR camera:
1 capture more shots with different exposure settings
2 Compose final image with “tone mapping” technique
EV -4 EV -1 EV +1 EV +4
Source: https://en.wikipedia.org/wiki/High-dynamic-range_imaging
PV227 – GPU Rendering (FI MUNI) Lesson 6 – HDR 05. 11. 2019 7 / 31
Rendering HDR Content
Various methods to convert HDR content into LDR image exists:
Contrast reduction Local tone mapping
PV227 – GPU Rendering (FI MUNI) Lesson 6 – HDR 05. 11. 2019 8 / 31
HDR Effects
Bloom (blooming, glow) – “overflowing” of light to surrounding
objects
Other buffers, techniques:
light maps,
skybox,
. . .
Advanced technique: “Temporally Coherent Local Tone Mapping”:
https://youtu.be/6yItM8UB7k4
PV227 – GPU Rendering (FI MUNI) Lesson 6 – HDR 05. 11. 2019 9 / 31
Implemantation of HDR Rendering
Common color buffer format: R8G8B8
Don’t forget: values are clamped to range < 0.0, 1.0 >
We need high dynamic range buffer
We can simply switch to R16G16B16A16F
No clamping of values
glTexImage2D(GL_TEXTURE_2D, 0, GL_RGBA16F, win_width,
win_height, 0, GL_RGBA, GL_FLOAT, nullptr);
PV227 – GPU Rendering (FI MUNI) Lesson 6 – HDR 05. 11. 2019 10 / 31
HDR Tone Mapping – Overview
Set-up HDR buffer (TASK 1)
First pass: compute lighting of scene into HDR buffer
The SAME computations, just no clamping of values
Second pass: use one of algorithms to tone map HDR buffer to
(LDR) frame-buffer (TASK 2)
Following passes: reuse existing HDR buffer to other effects. . .
PV227 – GPU Rendering (FI MUNI) Lesson 6 – HDR 05. 11. 2019 11 / 31
Tone Mapping – “Reinhard” technique
Among the simplest tone mapping techniques – simple remapping of
HDR values to range < 0.0, 1.0 > by division.
// read color from HDR texture
vec3 hdrColor = texture(hdrBuffer, TexCoords).rgb;
// simple reinhard mapping
vec3 result = hdrColor / (hdrColor + vec3(1.0));
PV227 – GPU Rendering (FI MUNI) Lesson 6 – HDR 05. 11. 2019 12 / 31
Tone Mapping – “Adjustable Exposure” technique
Allow us to render scene with different exposures:
rgb = 1 − 2−hdr∗exposure
// read color from HDR texture
vec3 hdrColor = texture(hdrBuffer, TexCoords).rgb;
// Exposure tone mapping
vec3 mapped = vec3(1.0) - exp2(-hdrColor * exposure);
PV227 – GPU Rendering (FI MUNI) Lesson 6 – HDR 05. 11. 2019 13 / 31
Tone Mapping – Gamma Correction
Could be combined with all tone mapping techniques.
// read from texture
// Do a tone mapping
vec3 mapped = ...
// Gamma correction
mapped = pow(mapped, vec3(1.0 / gamma));
PV227 – GPU Rendering (FI MUNI) Lesson 6 – HDR 05. 11. 2019 14 / 31
Tone Mapping – Results
Tone mapping: none
PV227 – GPU Rendering (FI MUNI) Lesson 6 – HDR 05. 11. 2019 15 / 31
Tone Mapping – Results
Tone mapping: “Reinhard” technique
PV227 – GPU Rendering (FI MUNI) Lesson 6 – HDR 05. 11. 2019 16 / 31
Tone Mapping – Results
Tone mapping with exposure: 0.25
PV227 – GPU Rendering (FI MUNI) Lesson 6 – HDR 05. 11. 2019 17 / 31
Tone Mapping – Results
Tone mapping with exposure: 1.0
PV227 – GPU Rendering (FI MUNI) Lesson 6 – HDR 05. 11. 2019 18 / 31
Tone Mapping – Results
Tone mapping with exposure: 100
PV227 – GPU Rendering (FI MUNI) Lesson 6 – HDR 05. 11. 2019 19 / 31
Bloom Effect (Blooming, Glow)
Imperfection of human eye (or camera
sensor) which is overwhelmed by bright
light. Light is “overflowing” to surrounding
cells (pixels).
In CG – added artificially to increase
realism.
Bloom can be used also in LDR, but with
HDR make more sense.
Figure Source: http://www.nationalgeographic.com/photography/photo-tips/overexposure-on-purpose-richardson/
PV227 – GPU Rendering (FI MUNI) Lesson 6 – HDR 05. 11. 2019 20 / 31
Bloom Effect – CG example
Source: http://learnopengl.com/#!Advanced-Lighting/Bloom
PV227 – GPU Rendering (FI MUNI) Lesson 6 – HDR 05. 11. 2019 21 / 31
Bloom Effect – Implementation Overview
1 Lit the scene (as always)
2 Fill buffer of pixels with high brightness (highlights) (TASK 3)
3 Blur the highlights buffer to simulate glow effect (TASK 4)
4 Compose original rendering with blurred highlights (TASK 5)
How many passes we need?
Do we need deffered shading? Can we exploit it? How?
Where is HDR in this?
PV227 – GPU Rendering (FI MUNI) Lesson 6 – HDR 05. 11. 2019 22 / 31
Bloom – Highlights Filtering (TASK3)
In what shader?
Compare fragment brightness to some threshold
We are working with HDR buffers, treshold could be simply 1.0f
Hint: brightness of pixel. . . vec3(0.299f, 0.587f, 0.114f)
PV227 – GPU Rendering (FI MUNI) Lesson 6 – HDR 05. 11. 2019 23 / 31
Bloom – Blurring (TASK4)
Blurring shader
What is difference from blur_SSAO shader?
Blur possibilities:
Simple average
Gaussian
Repeated blurring – later
Separable kernels
. . .
Think about effectiveness
PV227 – GPU Rendering (FI MUNI) Lesson 6 – HDR 05. 11. 2019 24 / 31
Bloom – Composition (TASK5)
Could be complicated in LDR, pretty easy with HDR buffers:
1 Simply add values of lit scene and blurred highlights
2 Use tone mapping as before
PV227 – GPU Rendering (FI MUNI) Lesson 6 – HDR 05. 11. 2019 25 / 31
Bloom – Results
Rendering without bloom
PV227 – GPU Rendering (FI MUNI) Lesson 6 – HDR 05. 11. 2019 26 / 31
Bloom – Results
Debug: highlights buffer
PV227 – GPU Rendering (FI MUNI) Lesson 6 – HDR 05. 11. 2019 27 / 31
Bloom – Results
Debug: blurred buffer
PV227 – GPU Rendering (FI MUNI) Lesson 6 – HDR 05. 11. 2019 28 / 31
Bloom – Results
Final image with bloom effect
PV227 – GPU Rendering (FI MUNI) Lesson 6 – HDR 05. 11. 2019 29 / 31
What Next?
How to combine effects?
We can have: SSAO, HDR (Tone mapping + Bloom), DoF, Grain,
Flares, etc.
Lots of buffers needed – lots of memory needed
Lots of “logic” needed to do it effectively
Post-effect double buffering trick:
For combining various post-process effects
“Double buffer” for blurring – bonus task (TASK4b)
Is it faster than separable kernels blurring?
Assignment 1
PV227 – GPU Rendering (FI MUNI) Lesson 6 – HDR 05. 11. 2019 30 / 31
Further Reading
John Hable: Uncharted 2: HDR lighting
Extensive desciption of HDR in context of AAA game:
gamma,
linear space,
filmic tone mapping,
A lot more
http://www.slideshare.net/ozlael/hable-john-uncharted2-hdr-lighting
About convolution computing
https://cg.ivd.kit.edu/downloads/GPUComputing_assignment_3.pdf
PV227 – GPU Rendering (FI MUNI) Lesson 6 – HDR 05. 11. 2019 31 / 31