![Welcome to Hogwarts - Intro to Shaders
● Shaders are little scriptlets which are executed in the GPU to
render the content to the screen [Framebuffer]
● Primarily intended to manipulate the input/output pixels (colors),
vertex, surface (tessellate)
● 2D Shaders (Image), 3D Shaders (Geometry)
● Unlike CPU, GPU executes shaders scripts in its array of parallel
pipelines
● A 2018 Macbook Pro’s GPU contains 1024 cores where as CPU
contains only 6 cores.
● Shaders are perfect candidates for Image processing and
computer vision
● Many variants of Shader programming languages available such as
GLSL, HLSL and others
● Unity uses a variant of HLSL
2© 2020 ThoughtWorks](https://image.slidesharecdn.com/shadersandtheblackmagic-200427040607/85/Shaders-and-the-black-magic-2-320.jpg)
Shaders and the black magic
- 1. GLOBAL SOFTWARE CONSULTANCY Shaders and the Black Magic Raju Kandaswamy 1© 2020 ThoughtWorks
- 2. Welcome to Hogwarts - Intro to Shaders ● Shaders are little scriptlets which are executed in the GPU to render the content to the screen [Framebuffer] ● Primarily intended to manipulate the input/output pixels (colors), vertex, surface (tessellate) ● 2D Shaders (Image), 3D Shaders (Geometry) ● Unlike CPU, GPU executes shaders scripts in its array of parallel pipelines ● A 2018 Macbook Pro’s GPU contains 1024 cores where as CPU contains only 6 cores. ● Shaders are perfect candidates for Image processing and computer vision ● Many variants of Shader programming languages available such as GLSL, HLSL and others ● Unity uses a variant of HLSL 2© 2020 ThoughtWorks
- 3. The Book of shaders ● The Vertex ● The Geometry / Primitives ● The Fragment ● The Colored Pixel 3© 2020 ThoughtWorks
- 4. House of Colors at Hogwarts 4 RGB(A) HSV YUV ● All color components are represented between 0 to 1 ● Fragments deal with pixel colors ● Shader scripts manipulate color components ● Need to convert to different house of colors for some operations ● Final output must be in RGB 0 1
- 5. Interpolations for the magic wand 5 0 1 0.3 0.6
- 6. Shader primitives for effective Spells ● Color (RGB, RGBA) - float3, float4 ● Vertex - float3 ● UV - float2 ● tex2D - Sampler ● Arithmetic primitives - + - * / % ● Math primitives - max, min, sin, cos ● Matrix - float2x2, float3x3 6© 2020 ThoughtWorks U V
- 7. Shader Graph - The art of making potions 7© 2020 ThoughtWorks ● LWRP & HDRP projects in Unity ● Graph ● Node ● Slots ● Binding ● Function ● Material ● Input Parameters ● Custom Nodes
- 8. Lifting the Invisible Cloak 8© 2020 ThoughtWorks ● 3x3 Filter Kernels ○ Gaussian Blur ○ Sharpen ○ Edge detection ■ Sobel ■ Canny
- 9. Tone mapping and Transfiguration 9© 2020 ThoughtWorks ● Transform one set of Colors to Other ○ Simple Reinhard ○ Adaptive Reinhard ○ Filmic
- 10. Potion Mixing Room of Hogwarts 10© 2020 ThoughtWorks ● www.shadertoy.com
- 11. Render Script & Mystery of performance 11© 2020 ThoughtWorks
- 12. Android’s Sibling of Shaders ● Get the images processed by CPU/GPU/DSP in Java / Kotlin code ● No NDK ot JNI pain ● .rs gets compiled into Java Classes ● ForEach and Fragments ● uchar4 ● rsUnpackColor8888 -> float4 ● rsPackColor8888 -> uchar4 12© 2020 ThoughtWorks
- 13. Thank You 13