Practical 3 Introduction Paul Scharf Tom Rijnbeek Practical 3 - - PowerPoint PPT Presentation

▶
practical 3 introduction
SMART_READER_LITE
LIVE PREVIEW

Practical 3 Introduction Paul Scharf Tom Rijnbeek Practical 3 - - PowerPoint PPT Presentation

Apr 09, 2023 236 likes •624 views

Practical 3 Introduction Paul Scharf Tom Rijnbeek Practical 3 Advanced Shader Programming 18 tasks: 6 easy; 7 medium; 5 hard Easy exercises: choose 4 out of 6 Maximum grade: 8 Two more points by doing either: Two medium tasks

slide-1
SLIDE 1

Practical 3 Introduction

Paul Scharf Tom Rijnbeek

slide-2
SLIDE 2

Practical 3

  • 18 tasks: 6 easy; 7 medium; 5 hard
  • Easy exercises: choose 4 out of 6

– Maximum grade: 8

  • Two more points by doing either:

– Two medium tasks – One hard task

  • Deadline: Thursday June 26, 23:59

Advanced Shader Programming

slide-3
SLIDE 3

EASY TASKS

slide-4
SLIDE 4

[E1] Multiple light sources

  • Repeat light calculations for every source
slide-5
SLIDE 5

[E2] Spotlight

slide-6
SLIDE 6

[E3] Cel shading

  • Discretised shading

smooth

slide-7
SLIDE 7

[E3] Cel shading

  • Easy solution: use texture for spectrum
  • More complicated:

– Discretise mathematically – Use gradients for smoothing

slide-8
SLIDE 8

[E4] Frustrum culling

  • Only draw visible models
  • Calculated on the CPU
slide-9
SLIDE 9

[E4] Frustrum culling

  • Frustrum bounded by six planes
  • Don’t draw models on the wrong side of

planes

  • Or use XNA’s BoundingFrustrum class...
slide-10
SLIDE 10

Post-processing basics

  • 1. Render scene to texture (rendertarget)
  • 2. Render screen-filling quad sampling from

texture in pixel shader

  • XNA: draw texture with Spritebatch

using pixel shader

slide-11
SLIDE 11

[E5] Simple colour filter

  • Apply grey-scale filter to every pixel
  • Use weighted sum:

𝑍 = 0.3𝑆 + 0.59𝐻 + 0.11𝐶

slide-12
SLIDE 12

[E6] Gaussian blur

  • Box blur: average pixels in a square area

around target pixel

  • Calculate by applying a convolution kernel
  • n the image

1/9 1/9 1/9 1/9 1/9 1/9 1/9 1/9 1/9

slide-13
SLIDE 13

[E6] Gaussian blur

  • Gaussian blur: average pixels in a

(roughly) circular area around target pixel

  • Use normal distribution to build kernel
slide-14
SLIDE 14

[E6] Gaussian blur

0.00000067 0.00002292 0.00019117 0.00038771 0.00019117 0.00002292 0.00000067 0.00002292 0.00078633 0.00655965 0.01330373 0.00655965 0.00078633 0.00002292 0.00019117 0.00655965 0.05472157 0.11098164 0.05472157 0.00655965 0.00019117 0.00038771 0.01330373 0.11098164 0.22508352 0.11098164 0.01330373 0.00038771 0.00019117 0.00655965 0.05472157 0.11098164 0.05472157 0.00655965 0.00019117 0.00002292 0.00078633 0.00655965 0.01330373 0.00655965 0.00078633 0.00002292 0.00000067 0.00002292 0.00019117 0.00038771 0.00019117 0.00002292 0.00000067

slide-15
SLIDE 15

[E6] Gaussian blur

  • Convolution can be heavily optimised
  • Split in vertical and horizontal pass

1 3 1 3 1 3 ∗ 1 3 1 3 1 3 = 1 9 1 9 1 9 1 9 1 9 1 9 1 9 1 9 1 9

slide-16
SLIDE 16

MEDIUM TASKS

slide-17
SLIDE 17

[M1] Textured light

  • Create view & projection matrix for light
  • Transform vertex position twice
slide-18
SLIDE 18

[M2] Shadow mapping

  • Render depth texture from light
  • Render scene normally

– Compare pixel’s distance to light with value from depth texture

slide-19
SLIDE 19

[M2] Shadow mapping

depth from light from camera compare

distance to light pictures from: http://en.wikipedia.org/wiki/Shadow_mapping

slide-20
SLIDE 20

[M3] Reflection

  • Render scene from reflected camera
  • Render to texture

– Render mirror with texture

  • Or: use stencil buffer

– Mask mirror pixels, to only render reflection there

slide-21
SLIDE 21

[M4] Cube mapping

  • Cube map: texture

represting lighting from all directions

slide-22
SLIDE 22

[M4] Cube mapping

  • Calculate reflection vector
  • Use cube texture lookup to find reflected

colour

slide-23
SLIDE 23

[H5] Advanced cube mapping

  • Precomputed diffuse light map
  • Stronger reflections at shallow

reflection angles

slide-24
SLIDE 24

[M5] Transparency

  • Render transparent objects after opaque
  • nes
  • Sort transparent objects back-to-front
slide-25
SLIDE 25

[M6] Post-processing: Bloom

  • Render scene
  • Threshold bright pixels
  • Downscale and blur repeatedly
  • Add up all scales
slide-26
SLIDE 26

[M6] Post-processing: Bloom

threshold scale down and blur all added up

slide-27
SLIDE 27

[M7] Post-processing: God rays

  • Volumetric light scattering through

dust/mist

  • Approximate in screen-space
slide-28
SLIDE 28

HARD TASKS

slide-29
SLIDE 29

[H1] HDR Lighting & Tone Mapping

  • Simulate adaption of human eye to

changing brightness

  • LDR vs. HDR

– LDR [0, 1] – HDR [0, ∞)

  • Tone Mapping: HDR  LDR
slide-30
SLIDE 30

[H2] Deferred Shading

  • Earlier lighting methods inefficient with

many lights

  • Render geometry information to multiple

rendertargets (G-buffers)

  • Calculate lighting per light for affected

pixels

slide-31
SLIDE 31

[H2] Deferred Shading

Diffuse Colour Depth/Position Normal Tons of lights

slide-32
SLIDE 32

[H3] Parallax Mapping

  • Use height map to

displace diffuse texture

slide-33
SLIDE 33

[H4] Post-processing: SSAO

slide-34
SLIDE 34

[H4] Post-processing: SSAO

  • Crude approximation of

full global illumination

  • Calculate in screen-

space

  • First real-time

implementation: Crysis

slide-35
SLIDE 35

Final words

  • Try focusing on doing few tasks well rather

than lots of exercises poorly

  • Finish the easy tasks first
  • Start in time!
slide-36
SLIDE 36

Recap

  • Finish 4 easy tasks for an 8
  • Finish 2 medium tasks or 1 hard task for 2

points

  • Additional tasks don’t improve grade
  • Start in time!
slide-37
SLIDE 37

Questions?