程序代写 COMP5822M – High Perf. Graphics

Lecture 13:
Deferred Shading & Postproc
COMP5822M – High Perf. Graphics

– Shading – BRDF
– Common models – Techniques
– SSAO, VPLs, IBL, …
COMP5822M – High Perf. Graphics

– “Render to texture”
– Deferred shading
– Post-processing effects
COMP5822M – High Perf. Graphics

Vertex data Uniform data …
Depth buffer
Renderpass
Graphics Pipeline
Graphics Pipeline
COMP5822M – High Perf. Graphics

Vertex data Uniform data …
Uniform data
Renderpass
Graphics Pipeline
Graphics Pipeline
Renderpass
Graphics Pipeline
COMP5822M – High Perf. Graphics
Framebuffer Color buffer 0
Color buffer 1 … Depth buffer
Textures (Uniforms)

– Transformrenderedimages – “Post processing”
– Examples:
– Color mapping
– Anti-aliasing
– Motion blur
– Depth of field
COMP5822M – High Perf. Graphics
– Ambient Occlusion
– Godrays / shafts of light
– Screen space reflections
– Deferred shading

Deferred Shading
– Nextup:DeferredShading
– Problems with the “Forward Pipeline”
– Other post-proc logically comes after
– May not require deferred shading
– May sometimes require additional data
COMP5822M – High Perf. Graphics

The Forward Pipeline
– “Traditional Projective Graphics”
– Process all geometry in submission order
– Rasterize
– (Early Depth Tests)
– Compute shading for resulting fragments
– If in front: store results in framebuffer
COMP5822M – High Perf. Graphics

The Forward Pipeline
COMP5822M – High Perf. Graphics

Overdraw and Overshading
– Overdraw
– Write to each pixel multiple times
– Overshading
– Evaluating shading for a pixel
multiple times
– Note: focusing on opaque geometry for now.
COMP5822M – High Perf. Graphics

Overdraw and Overshading
– Overdraw is difficult to solve
– Mitigations: EarlyZ+front-to-back,
occlusion culling, …
– Overshading?
– Prime depth buffer with pre-Z-pass
– Deferred Shading
COMP5822M – High Perf. Graphics

Pre-Z pass
– Draw geometry once, writing only to depth buffer
– This primes the depth buffer
– Similar to rendering a shadow map!
– Second“normal”passforcomputingshading
– Early-Z will discard occluded fragments before fragment shader!
– (Except with e.g. blending/masking/…)
– Downside:twogeometrypasses.
COMP5822M – High Perf. Graphics

Many lights
– Naïve approach:
– Fragment shader loops over all lights,
accumulates shading
COMP5822M – High Perf. Graphics

Many lights
– Naïve approach:
– Fragment shader loops over all lights,
accumulates shading
– Small objects, few large lights: OK-ish
COMP5822M – High Perf. Graphics
Src: , Many Light Management…

Many lights
– Naïve approach:
– Fragment shader loops over all lights,
accumulates shading
– Small objects, few large lights: OK-ish
– Few large objects, many small lights: – Problem
COMP5822M – High Perf. Graphics
Src: , Many Light Management…

Deferred Shading
– Alternative solution.
– Don’tcomputeshadingimmediately
– Defer it.
COMP5822M – High Perf. Graphics

Deferred Shading
– Also two passes, but only one geometry pass
– Firstpass:
– Geometry pass (i.e., draw meshes/triangles)
– Fragment shader: store data needed for shading in each pixel
– Multiple render targets
– Secondpass:
– Fullscreen pass, no geometry
– For each pixel: read shading data, compute shading, store results.
COMP5822M – High Perf. Graphics

Position(Z)
COMP5822M – High Perf. Graphics
Src: , Many Light Management…

– Multiple color targets store shading data:
– Position (implicit – get from depth buffer)
– Shading normal
– Albedo (“color”)
– Specularity, …
– (Other shading data?)
– Referred to as G-Buffer
COMP5822M – High Perf. Graphics
Src: , Many Light Management…

– Careful with formats
– G-Buffers can get quite “heavy” in terms of memory use
COMP5822M – High Perf. Graphics

G-Buffer – Simple (but bad?)
– Bad example (seen in real life)
– Depth buffer: 4 bytes
– Position: RGB(A)_32F: 16 bytes
– Normal: RGB(A)_32F: 16 bytes
– Albedo: RGB(A)_32F: 16 bytes
– Specularity (encode in albedo’s alpha channel)
– Total: 52 bytes per pixel. At 1920×1080: >100MB of data!
Reconstruct position from pixel coordinates (i,j) and depth buffer value!
COMP5822M – High Perf. Graphics

G-Buffer – Simple (but bad?)
Reconstruct position from pixel coordinates (i,j) and depth buffer value!
– Bad example (seen in real life)
– Depth buffer: 4 bytes
– Position: RGB(A)_32F: 16 bytes
– Normal: RGB(A)_32F: 16 bytes
– Albedo: RGB(A)_32F: 16 bytes
– Specularity (encode in albedo’s alpha channel)
– Total: 52 bytes per pixel. At 1920×1080: >100MB of data!
COMP5822M – High Perf. Graphics

G-Buffer – Simple (but bad?)
Reconstruct position from pixel coordinates (i,j) and depth buffer value!
More tricky. May actually want the
– Bad example (seen in real life)
– Depth buffer: 4 bytes
– Position: RGB(A)_32F: 16 bytes
– Normal: RGB(A)_32F: 16 bytes
– Albedo: RGB(A)_32F: 16 bytes
– Specularity (encode in albedo’s alpha channel)
– Total: 52 bytes per pixel. At 1920×1080: >100MB of data!
COMP5822M – High Perf. Graphics
extra dynamic range

G-Buffer – Simple (but bad?)
– Bad example (seen in real life)
– Depth buffer: 4 bytes
– Position: RGB(A)_32F: 16 bytes
– Normal: RGB(A)_32F: 16 bytes
– Albedo: RGB(A)_32F: 16 bytes More tricky. May
– Specularity (encode in albedo’s alpha channel) actually want the
– Total: 52 bytes per pixel. At 1920×1080: >100MB of deaxtar!a dynamic range
24 bytes per pixel; Full HD: ~48MB
COMP5822M – High Perf. Graphics
Reconstruct position from pixel coordinates (i,j) and depth buffer value!
RGB10_A2? 4 bytes.

– Is that the only right format?
– Other data may be needed (separate diffuse + specular colors?)
– But: think about what you actually need.
– Larger G-Buffer: more memory use,
more memory bandwidth
– We never have enough memory bandwidth…
COMP5822M – High Perf. Graphics

Shading Pass
– Have G-Buffer with data for shading – Shading!
COMP5822M – High Perf. Graphics

Shading Pass – Naive
– Singlefullscreenpass
– For each pixel:
– Read G-Buffer
– For each light:
– Compute shading and accumulate – Store resulting color value
COMP5822M – High Perf. Graphics

Shading Pass – Naive
– Singlefullscreenpass
– For each pixel:
– Read G-Buffer
– For each light:
– Compute shading and accumulate – Store resulting color value
Src: , Many Light Management…
COMP5822M – High Perf. Graphics

Interlude – Fullscreen Passes
– Essentially:
– For each pixel:
– Do thing;
– Store result in color output;
COMP5822M – High Perf. Graphics

Interlude – Fullscreen Passes
– Twochoices
– Projective Graphics Pipeline (i.e., fragment shader)
– Compute Shader Pipeline
COMP5822M – High Perf. Graphics

Fullscreen Pass: Projective Graphics
– Drawone(ortwo?)trianglesthat
cover the whole screen
– Fragment shader is run once per
pixel in output color buffer
– Run computations in fragment shader
COMP5822M – High Perf. Graphics

One vs Two triangles
COMP5822M – High Perf. Graphics

One vs Two triangles
Discarded efficiently
COMP5822M – High Perf. Graphics
Diagonal boundary less efficient due to SIMD grouping.
Discarded efficiently

gl_VertexIndex = 0
One vs Two triangles
COMP5822M – High Perf. Graphics
gl_VertexIndex = 2
gl_VertexIndex = 1

gl_VertexIndex = 0
One vs Two triangles
Clip space = (-1,-1,0,1)
Clip space = (1,-1,0,1)
gl_VertexIndex = 1
Clip space = (-1,1,0,1)
Clip space = (1,1,0,1)
COMP5822M – High Perf. Graphics
gl_VertexIndex = 2

Clip space = (-1,-1,0,1)
Clip space = (1,-1,0,1)
gl_VertexIndex = 1 Clip space = (3,-1,0,1)
Clip space = (1,1,0,1)
gl_VertexIndex = 2
COMP5822M – High Perf. Graphics Clip space = (-1,3,0,1)
gl_VertexIndex = 0
One vs Two triangles
Clip space = (-1,1,0,1)

Fullscreen Pass: Projective Graphics
#version 450
layout( location = 0 ) out vec2 v2fUV; //…
void main()
v2fUV = vec2(
(gl_VertexIndex << 1) & 2, // either 0 or 2 gl_VertexIndex & 2 // either 0 or 2 ); gl_Position = vec4( v2fUV * 2.0f + -1.0f, 0.0f, 1.0f ); See: https://www.saschawillems.de/blog/2016/08/13/vulkan- COMP5822M – High Perf. Graphics tutorial-on-rendering-a-fullscreen-quad-without-buffers/ Fullscreen Pass: Compute shader - Usecomputeshader - Just launch one thread per pixel - Need to figure out grouping of threads yourself - 4x8? 8x4? 16x16? 32x32? Depends on hardware. - More control, more chances to mess up. COMP5822M – High Perf. Graphics Shading Pass – Naive - Singlefullscreenpass - For each pixel: - Read G-Buffer - For each light: - Compute shading and accumulate - Store resulting color value Src: , Many Light Management... COMP5822M – High Perf. Graphics Shading Pass – Naive - This is not the traditional approach COMP5822M – High Perf. Graphics Shading Pass – Traditional Deferred - For each light: - Draw the light bounding volume (example: rectangle) - In fragment shader: - Read G-Buffer - Compute shading - Accumulate (additive blending!) into frame buffer COMP5822M – High Perf. Graphics Shading Pass – Traditional Deferred COMP5822M – High Perf. Graphics Src: , Many Light Management... Shading Pass – Traditional Deferred COMP5822M – High Perf. Graphics Src: , Many Light Management... Shading Pass – Traditional Deferred COMP5822M – High Perf. Graphics Src: , Many Light Management... Shading Pass – Traditional Deferred COMP5822M – High Perf. Graphics Src: , Many Light Management... Shading Pass – Traditional Deferred COMP5822M – High Perf. Graphics Src: , Many Light Management... Shading Pass – Traditional Deferred COMP5822M – High Perf. Graphics Src: , Many Light Management... Shading Pass – Traditional Deferred not the whole image! Fragment shader only runs for fragments inside of the rectangle, COMP5822M – High Perf. Graphics Src: , Many Light Management... Shading Pass – Traditional Deferred - Handles many lights better - Less compute / shading operations. COMP5822M – High Perf. Graphics Shading Pass – Traditional Deferred - Betterboundingvolumesreduce unnecessary work further - But:manyreadsfromG-Buffer - Expensive, lots of data - Also many writes to output color buffer COMP5822M – High Perf. Graphics Shading Pass – Traditional Deferred - Betterboundingvolumesreduce unnecessary work further - But:manyreadsfromG-Buffer - Expensive, lots of data - Also many writes to output color buffer - No longer that common. - Compute used to be bottleneck - Now: memory bandwidth. COMP5822M – High Perf. Graphics Shading Pass – Modern Approaches - Tiled shading, clustered shading, Forward+ COMP5822M – High Perf. Graphics Shading Pass – Modern Approaches - Will talk your ear off regarding this stuff if you let me. COMP5822M – High Perf. Graphics Shading Pass – Modern Approaches - High level overview: COMP5822M – High Perf. Graphics Src: , Many Light Management... Shading Pass – Modern Approaches - High level overview: COMP5822M – High Perf. Graphics Src: , Many Light Management... Shading Pass – Modern Approaches - High level overview: Contains two lights: - “Orange light” - “Green light” Contains one light: - “Orange light” COMP5822M – High Perf. Graphics Src: , Many Light Management... Shading Pass – Modern Approaches - Do this for each tile before shading - “Light assignment” - Shading: Single full screen pass - For each pixel: - Read G-Buffer - Read Tile-data (#lights, light data) - For each light in tile: - Compute shading and accumulate - Store results in color buffer COMP5822M – High Perf. Graphics Shading Pass – Modern Approaches - Back to single read of G-Buffer data - Saves a bunch of memory bandwidth - Fewerlightingcomputationsthan naïve approach - Naïve: O( numPixels * numLights ) - Tiled: Depends, but typically less than that. - Note: treat large lights (sun...) as special case COMP5822M – High Perf. Graphics Shading Pass – Modern Approaches - ClusteredShading: - Roughly same idea - Replace 2D tiles with 3D “clusters” (“froxels”?) - Slightly more work, but less lights/cluster and more robust COMP5822M – High Perf. Graphics Deferred Shading – The Ugly - Opaquegeometry. - Single depth buffer = single surface - No transparency - MSAAetal.getsveryexpensive - All components of the G-Buffer grow - Plus, tricky to get right - Essentially becomes just super sampling COMP5822M – High Perf. Graphics Hybrid / Modern Forward - Hybridapproaches: - Render opaque stuff using Deferred - Render transparent stuff using Forward - Forwardpassusestile/cluster information for lighting! COMP5822M – High Perf. Graphics Hybrid / Modern Forward - Hybridapproaches: - Render opaque stuff using Deferred - Render transparent stuff using Forward - Forwardpassusestile/cluster information for lighting! - “Pure” forward making a bit of a comeback - Doom Eternal (2020) is fully forward again. - Pre-Z pass!!! COMP5822M – High Perf. Graphics Deferred Shading COMP5822M – High Perf. Graphics Uncharted 4 Deferred Shading + Clustered Uncharted 4 COMP5822M – High Perf. Graphics Just Cause 3 Deferred Shading + Clustered COMP5822M – High Perf. Graphics Doom (2017) Just Cause 3 Uncharted 4 Back to Forward Shading? Doom Eternal COMP5822M – High Perf. Graphics Doom (2017) Just Cause 3 Uncharted 4 Fun exercise (voluntary of course): - LoadupDoomEternal - Lookforshadows. - What objects do cast shadows? - Does the player? - Do the monsters? - Does static geometry? COMP5822M – High Perf. Graphics Fun exercise (voluntary of course): - LoadupDoomEternal - Lookforshadows. - What objects do cast shadows? - Does the player? - Does static geometry? Tricky part of this exercise. - Do the monsters? - PS: The game will still be trying to kill you, even when you’re just trying to study the graphics - Lowering difficulty level is cheating. 😉 COMP5822M – High Perf. Graphics Anti-aliasing? - MSAA not really applicable - So what do we do? COMP5822M – High Perf. Graphics Anti-aliasing - As a post process - MLAA, FXAA, TXAA, TAA, DLSS, other 3-4 letter codes - “Smart blur” around edges, high frequency - Keep “flat” regions unchanged. COMP5822M – High Perf. Graphics - Steps(clockwise) - Detectedges - Revectorize edges with blur - Blendpixels COMP5822M – High Perf. Graphics From http://www.iryoku.com/aacourse/ COMP5822M – High Perf. Graphics Temporal techniques - TXAA, TAA, ... - Realize: - Previous frames show roughly same image - Can find additional information there COMP5822M – High Perf. Graphics Temporal techniques - Essentially:reprojectprevious frame pixels to current - Using old transforms - Filter using data from current and previous frame(s) - More complex filter COMP5822M – High Perf. Graphics Temporal techniques - Downside: - Fast motion, jumps, lag ... COMP5822M – High Perf. Graphics Temporal techniques - Downside: - Fast motion, jumps, lag ... COMP5822M – High Perf. Graphics https://www.youtube.com/watch?v=Fv-jStEsCpE Motion blur - Whenstuffdoes move fast. COMP5822M – High Perf. Graphics Post processing effects COMP5822M – High Perf. Graphics Motion blur - Addextrasamplesintime - Integrate over time - Basicsolution: - Render multiple frames at different steps - Accumulate + average results COMP5822M – High Perf. Graphics Motion blur - Expensive - Especially with large amounts of geometry - (But actually gives good results) - Alternative: post-processing COMP5822M – High Perf. Graphics Motion blur - Render color + depth buffer - Possibly: per-pixel motion vectors - Otherwise compute from camera motion - Use motion vectors to blur image - Tricky cases COMP5822M – High Perf. Graphics Motion blur COMP5822M – High Perf. Graphics Depth of field - “Defocusblur” - Eyes focus on a fixed distance COMP5822M – High Perf. Graphics Depth of field - “Defocusblur” - Eyes focus on a fixed distance - If at a difference distance, - Out of focus - => blurred
COMP5822M – High Perf. Graphics

Depth of field
– Simplesolution:
– Render multiple times,
jitter viewpoint
– Accumulate & average
COMP5822M – High Perf. Graphics

Depth of field
– Sameproblem:expensive
– Samesolution:
– Render color + depth
– Blur based on depth value
– “Same difference”: Faster, but tricky cases
COMP5822M – High Perf. Graphics

COMP5822M – High Perf. Graphics

Bonus Slide
“ By Night”
COMP5822M – High Perf. Graphics

程序代写 CS代考加微信: powcoder QQ: 1823890830 Email: powcoder@163.com

Related Posts