Project 5B: Ruoyu Fan

[WindyDarian]

• Repo Link

• ruof

• Deferred Blinn-Phong shading with normal mapping

  • Using clamp(1.0 - light_distance * light_distance / (u_lightRad * u_lightRad), 0.0, 1.0) as attenuation model for point lights

• Bloom post-processing effect with two-pass Gaussian blur using three steps:

  • First extract bright areas with a threshold
  • Then do a two-pass Gaussian blur using separable convolution (vertical then horizontal)
    • Use menu option to control blur size (which changes uniform variable u_scale passing to bloom.frag.glsl)
  • Finally combine the blurred image to the original output

• Scissor test for lighting: when accumulating shading from each point light source, only render in a rectangle around the light.

  • Use debugScissor option to toggle scissor visual, or select 6 Light scissors to show scissor only.
  • This is used to compare with my light proxy implementation

• Light proxy: instead of rendering a scissored full-screen quad for every light, I render proxy geometry which covers the part of the screen affected by a light (using spheres for point lights), thus reducing wasted fragments in lighting pass.

  • Using inverted depth test with front-face culling to avoid lighting geometries that are far behind the light, thus further reducing wasted fragments
  • This feature requires WebGL's EXT_frag_depth extension to write depth data into frame buffer at defered shading stage in order to do the depth test
  • Use useLightProxy option to toggle on/off and use useInvertedDepthTestForLightProxy option to toggle depth test and front face culling for lighting pass

• Optimized g-buffer from 4vec4 to 2vec4 by compressing normal to two floats, increasing framerate to 167%