<style> code { max-height: 800px !important; } sup { opacity: 50%; font-size: .7em !important; } </style> Shaders === --- ## Was ist ein `Shader`? ---- Ein `Shader` ist ein sehr kurzes Programm ---- `Shader` laufen auf der Grafikkarte also hoch parallelisiert ----  Note: auf so einem Gerät --- ## Pipeline DirectX (hlsl) & OpenGL (glsl) Note: hlsl is z.B. Unity, Monogame glsl is z.B. OpenGl ---- <img src="https://i.imgur.com/4n4XeN5.png" style="background: white"> Note: Compute Shader ---- ### Vertex Shader im kern $${\rm I\!R}^3 \mapsto {\rm I\!R}^3$$ im genauen $$\text{vertex} \mapsto \text{vtf}$$ Note: vtf = Vertex to Fragment ---- ### Fragment Shader im kern $$\emptyset \mapsto {\rm I\!R}^4$$ im genauen $$\text{vtf} \mapsto \text{color}$$ ---- ### Warum das ganze mit dem $\text{vtf}$? Interpolation von $\text{vtf}$ $$\text{vertex} \mapsto \text{pixel}$$ ```hlsl struct VertToFrag { vec4 color; vec2 uv; float lod; }; ``` ^{in hlsl} ---- ### Uniforms Werden an die Graphikkarte weiter gerreicht wie zusätzliche Argumente <br> ```glsl uniform mat4 MVP; uniform vec3 Color; uniform sampler2D Texture; ``` ^{in glsl} --- ## Beispiel an GLSL *(OpenGL Shading Language)* <br> ```glsl void main(void) { gl_FrontColor = gl_Color; gl_Position = gl_ModelViewProjectionMatrix * gl_Vertex; } ``` ^{vertex shader} ```glsl void main(void) { gl_FragColor = vec4(1.0, 0.0, 0.0, 1.0); } ``` ^{fragment shader} ---- ```glsl uniform mat4 World; uniform mat4 View; uniform mat4 Projection; uniform mat4 MVP; in vec3 Position; in vec2 UV; out vec3 outPosition; out vec2 uv; void main() { gl_Position = MVP * vec4(Position, 1); outPosition = gl_Position.xyz; uv = UV; } ``` ^{vertex shader} Note: custom vertex shader ---- ```glsl in vec3 outPosition; in vec2 uv; out vec4 outColor; uniform vec4 funkyColor; uniform sampler2D funkyTex; void main() { vec3 c = texture(funkyTex, uv).rgb; c = mix(c, vec3(uv, 1), .5); outColor = vec4(funkyColor.xyz * c, 1); } ``` ^{fragment shader} Note: .xyz & .rgb vec3 1 1.0 .5 outColor is custom ----  ^Ergebnis --- # Demo Time! --- noch fragen? github.com/janekx21