I am running a small survey to be able to improve the series further this year.
If you have two minutes to spare, please fill out the survey https://goo.gl/forms/nNPzrRpiMERIgtBl2
This week also contains articles that have been published during my vacation since issue 67
- start of series for programmers with D3D11 experience starting to learn D3D12
- explains what command queues are, how they express different GPU execution timelines and how fences allow synchronization between CPU and GPU
![d3d12.jpg](https://www.jendrikillner.com/img/posts/graphics-programming-weekly-68/d3d12.jpg&key=2473766c3141684647a45bac54e019c782896e3d2b5ffea4cd238856666c807d)
- explains how to render water using WebGL, Rust, and WebAssembly
- water supports reflection and refraction
- reflections are rendered using a reflection plane technique, that mirrors the world and clips fragments if they are below the water plane
![WebGL_Rust_Basic_Water_Tutorial.png](https://www.jendrikillner.com/img/posts/graphics-programming-weekly-68/WebGL_Rust_Basic_Water_Tutorial.png&key=9877d6fba0c1037059d1ceb46c126d5ca7b25ae79a124c5f8864756e56c8bf83)
- shows how to use screen space derivatives to create hard edges on a mesh in the pixel shader
- how to calculate greyscale from colors
![hard_edges.png](https://www.jendrikillner.com/img/posts/graphics-programming-weekly-68/hard_edges.png&key=b34dcaf7ee8a6b12522ebfe2816d595ac71fdeb6318ec0cdd4aa22d921a41515)
- video explaining the rendering equation in an easy to understand and visual way
![rendering_equation.png](https://www.jendrikillner.com/img/posts/graphics-programming-weekly-68/rendering_equation.png&key=c2fce73b542d3fdc6a678da741ab0380b069d44e129cee44eff9d9981193358e)
- list of common patterns for shadertoy programming
- included are: normalizing screen coordinates, color management (hue, sRGB), line drawing, antialiasing, blending, vector math, and random value generation
![shadertoy.png](https://www.jendrikillner.com/img/posts/graphics-programming-weekly-68/shadertoy.png&key=d01221f6087b3d3ffa145e80457ec0eb8da1988b6ad8440a7d799500d657506c)
- preprint of the article to appear in GPU Zen 2 talking about the implementation details (C++ and GLSL)
- replaces the 3D histogram transformation with three 1D histogram transformations
- improves quality of the result under mipmapping and shows how to generate correct results with compressed texture formats
![hpn2018_teaser.png](https://www.jendrikillner.com/img/posts/graphics-programming-weekly-68/hpn2018_teaser.png&key=7e53c06078476a413fbaa428a5fc7d3d263c89bb169453c0b2fa899e093b4c62)
- walkthrough of steps to learn graphics programming
- recommends starting that beginners start with a raytracer/rasterizer from scratch before starting to use any graphics API
- list of project ideas for beginners
![first_triangle.jpg](https://www.jendrikillner.com/img/posts/graphics-programming-weekly-68/first_triangle.jpg&key=d9465749f8bfbce7daf1dc2a05011c5c29999ade6d93d8ff520b013e6ca7d3bd)
- explains how to rasterize the glyphs from a font into a texture. Providing the coverage information that is required by the technique discussed in part 1 and 2
- includes code for the OpenGL compute shader
- overview of typography terms and explain how to correctly position the glyphs to form the final text on the screen
![Outline_Sorting.png](https://www.jendrikillner.com/img/posts/graphics-programming-weekly-68/Outline_Sorting.png&key=22d993206e6f5a86d89d804f2913feba3e3f5943b74bb28ddf6f8eef0a770f07)
- presents what vertex attributes are and how they are interpolated to deal with perspective distortions correctly
- uses this knowledge to interpolate normals and UV coordinates for the sponza model
![rasterizer.png](https://www.jendrikillner.com/img/posts/graphics-programming-weekly-68/rasterizer.png&key=95955780ec6c0f9d7152aed52d0c1b0000e35bed3bc1533e5f1be83484d463d7)
Part 1 of the article:
- explains how classical forward/deferred pipelines work and how tiled and clustered algorithms can be used to extend these ideas
- includes animations to show the concepts in a more visual way
- presents strengths and weaknesses for each technique
Part 2 of the article:
- presents the clustered forward shading implementation
- how to subdivide the camera frustum into clusters and implement light culling
- provides links to further information sources
![clustered_shading.png](https://www.jendrikillner.com/img/posts/graphics-programming-weekly-68/clustered_shading.png&key=723d98002d826bb73bd02a59c89514614274d35091015ba2e347ecdc19593c2d)
- frame breakdown of the Rise of the Tomb Raider with D3D12 on PC
- uses a light pre-pass architecture
- lens flares don’t use a visibility query but instead use the depth buffer to calculate visibility
- talks about shadow mapping, ambient occlusion, depth-aware upscaling, reflections, hair rendering, volumetrics, and tone mapping
![ROTR-Final-Frame.jpg](https://www.jendrikillner.com/img/posts/graphics-programming-weekly-68/ROTR-Final-Frame.jpg&key=9e8627f22b03c57b55c445b0a666c7c662b021fd5ba755c98c30cd1108aa879c)
- explains how to apply an expanding color effect that converts the world from greyscale back to color as post-processing effect using Unity scriptable render pipeline
- presents how to reconstruct world space position from the depth buffer
![color_spread.png](https://www.jendrikillner.com/img/posts/graphics-programming-weekly-68/color_spread.png&key=fc61f334afd508b13249aca3e94b7aefac8b68e28968d9b922040351d39b2786)
- shows how to set up a Docker container image that is able to run shader compilers
- supported are: DXC, FXC, GLSLang, AMD Radeon Graphics Analyzer, DXIL signing, SMOL/V and Vulkan SDK
![docker_shader_1.png](https://www.jendrikillner.com/img/posts/graphics-programming-weekly-68/docker_shader_1.png&key=97073a27e162712aafc9ea8a727469ae052c4d1df8a9596fdff5ac0e0036524b)
If you are enjoying the series and getting value from it, please consider supporting this blog.
Support this blog