Computação GráficaComputer GraphicsEngenharia Informática (11569) – 3º ano, 2º semestre

Chap. 10 – Shaders in GLSL

http://di.ubi.pt/~agomes/cg/10-shaders.pdf

T09 Shading

Outline

…:

– Shader: a definition

– What are we targetting?

– Vertex processor: inputs and outputs

– Fragment processor: inputs and outputs

– What happens when you install a shader?

– Gouraud shader

– Phong shader

– Summary

Based on slides due to: Alex Benton, University of Cambridge – A.Benton@damtp.cam.ac.uk“Advanced Graphics Lecture Eight”

T09 Shading

What is… a shader?

World space

Viewing space

3D screen space

2D display space

Local space

in the semester beginning …

World space

Viewing space

3D screen space

Process vertices

Local space

Clipping, projection, backface culling

Process pixels

2D display space – plot pixels

now... closer to the truth (but still a terrible oversimplification)

T09 Shading

What is… the shader?

World space

Viewing space

3D screen space

2D display space

Local space

in the semester beginning …

World space

Viewing space

3D screen space

Process vertices

Local space

Clipping, projection, backface culling

Process pixels

2D display space – plot pixels

now... closer to the truth (but still a terrible oversimplification)

Ex: computing diffuse shading color per

vertex; transforming vertex position;

transforming texture co-ordinates

Ex: interpolating texture coordinates across the polygon;

interpolating the normal for specular

lighting; textured normal-mapping

“Wouldn’t it be great if the user could install their

own code into the hardware

to choose these effects?”

T09 Shading

Notions:

– Shaders are small programs that execute in parallel on the GPU (which possesses multiple processing units).

– Shaders can replace the “fixed” functionality of OpenGL with user-generated code.

– By installing custom shaders, the user can now completely override the existing implementation of core per-vertex and per-pixel behavior.

What is… the shader?

Left: product demo of Microsoft’s XNA game platformMid: product demo by nvidiaRight: product demo by Radeon

T09 Shading

How everything happens on graphics card?:

– OpenGL shaders give the user control over each vertex and each fragment (each pixel or partial pixel) interpolated between vertices.

– After vertices are processed, polygons are rasterized. During rasterization, values like position, color, depth, and others are interpolated across the polygon. The interpolated values are passed to each pixel fragment.

What can you override?:

– OpenGL shaders give the user control over each vertex and each fragment (each pixel or partial pixel) interpolated between vertices.

What are we targeting?

Per vertex:

• Vertex transformation• Normal transformation and normalization• Texture coordinate generation• Texture coordinate transformation• Lighting• Color material application

Per fragment (pixel):

• Operations on interpolated values• Texture access• Texture application• Fog• Color summation• Optionally:

a) Pixel zoomb) Scale and biasc) Color table lookupd) Convolution

T09 Shading

Vertex processor: inputs and outputs

ColorNormalPositionTexture coordetc…

Texture data

Modelview matrixMaterialLightingetc…

Custom variables

ColorPosition

Custom variables

VertexProcessorPer-vertex attributes

T09 Shading

Fragment processor: inputs and outputs

Recall that new graphics hardware makes programmable shading per pixel!

ColorTexture coordsFragment coordsFront facing

Custom variables

Modelview matrixMaterialLightingetc…

Texture data

Fragment colorFragment depthFragment

Processor

T09 Shading

What happens when you install a shader?

– All the fixed functionality is overridden.

– It’s up to you to replace it!

§ You’ll have to transform each vertex into viewing coordinates manually.

§ You’ll have to light each vertex manually.

§ You’ll have to apply the current interpolated color to each fragment manually.

– The installed shader replaces all OpenGL fixed functionality for all renders until you remove it.

Above: Kevin Boulanger (PhD thesis, “Real-Time Realistic Rendering of Nature Scenes with Dynamic Lighting”, 2005)

Above: Ben Cloward(“Car paint shader”)

T09 Shading

GLSL shader sample #2 – Gouraud shading

// Vertex Shader#version 330 core layout (location = 0) in vec3 aPos; layout (location = 1) in vec3 aNormal; out vec3 LightingColor; // resulting color from lighting calculations

uniform vec3 lightPos; uniform vec3 objectColor; uniform vec3 lightColor;

uniform mat4 model; uniform mat4 view; uniform mat4 projection;

void main() { vec3 Position = vec3(model * vec4(aPos, 1.0)); vec3 Normal = mat3(transpose(inverse(model))) * aNormal;

float ambientStrength = 0.1; // ambient vec3 ambient = ambientStrength * lightColor; // Ka * I

vec3 norm = normalize(Normal); // diffuse vec3 lightDir = normalize(lightPos - Position); float diff = max(dot(norm, lightDir), 0.0); vec3 diffuse = diff * lightColor;

float specularStrength = 1.0; // specular vec3 viewDir = normalize(viewPos - Position); vec3 reflectDir = reflect(-lightDir, norm); float spec = pow(max(dot(viewDir, reflectDir), 0.0), 32); vec3 specular = specularStrength * spec * lightColor;

LightingColor = (ambient + diffuse + specular) * objectColor; }

Vertex shader:- Why is this vertex shader designed for Gouraud shading?- Why are we calculating vertex positions and normals in world space (i.e. model space)?

T09 Shading

GLSL shader sample #2 – Gouraud shading

// Fragment Shader#version 330 core

in vec3 LightingColor; out vec4 FragColor;

void main() { FragColor = vec4(LightingColor, 1.0);

}

Fragment shader:- LightingColor is automatically linearly interpolated between across every rasterized polygon.

T09 Shading

GLSL shader sample #1 – Phong shading

// Vertex Shader#version 330 core layout (location = 0) in vec3 aPos; layout (location = 1) in vec3 aNormal;

out vec3 FragPos; out vec3 Normal; out vec3 LightPos; // we now define the uniform in the vertex shader and pass the 'view space' lightPos to the fragment shader. lightPos is currently in world space.uniform vec3 lightPos;

uniform mat4 model; uniform mat4 view; uniform mat4 projection;

void main() { gl_Position = projection * view * model * vec4(aPos, 1.0); FragPos = vec3(view * model * vec4(aPos, 1.0)); Normal = mat3(transpose(inverse(view * model))) * aNormal;

// Transform world-space light position to view-space light positionLightPos = vec3(view * vec4(lightPos, 1.0));

}

Vertex shader:- Why is this vertex shader designed for Phong shading?- Why do we need to calculate vertex positions and normals in view space?- Why are we not using the model matrix to calculate the light position in view coordinates?

T09 Shading

GLSL shader sample #1 – Phong shading

// Fragment Shader#version 330 core out vec4 FragColor; in vec3 FragPos; in vec3 Normal; in vec3 LightPos; uniform vec3 lightColor; uniform vec3 objectColor;

void main() { float ambientStrength = 0.1; vec3 ambient = ambientStrength * lightColor; // ambient

vec3 norm = normalize(Normal); vec3 lightDir = normalize(LightPos - FragPos); float diff = max(dot(norm, lightDir), 0.0); vec3 diffuse = diff * lightColor; // diffuse

float specularStrength = 0.5; // the viewer at (0,0,0) in view-space, so viewDir is (0,0,0) - Position => -Positionvec3 viewDir = normalize(-FragPos); vec3 reflectDir = reflect(-lightDir, norm); float spec = pow(max(dot(viewDir, reflectDir), 0.0), 32); vec3 specular = specularStrength * spec * lightColor; // specular

vec3 result = (ambient + diffuse + specular) * objectColor; FragColor = vec4(result, 1.0);

}

Fragment shader:- FragPos, Normal, and LightPos are automatically linearly interpolated between vertices across every polygon in the vertex shader.

T09 Shading

Summary:

…:

– Shader: a definition

– What are we targetting?

– Vertex processor: inputs and outputs

– Fragment processor: inputs and outputs

– What happens when you install a shader?

– Gouraud shader

– Phong shader

– Summary