# GLSL v1.20. Scott MacHaffie Schrödinger, Inc.

Save this PDF as:

Size: px
Start display at page:

Download "GLSL v1.20. Scott MacHaffie Schrödinger, Inc."

## Transcription

1 1 GLSL v1.20 Scott MacHaffie Schrödinger, Inc. Table of Contents Introduction...2 Example 01: Trivial shader...2 Syntax...3 Types of variables...3 Example 02: Materials vertex shader...4 Example 02: Materials fragment shader...5 Geometry transformations...7 Example 03: Sphere vertex shader...7 Example 03: Sphere fragment shader...9 if statements and the mix() function...11 Passing data...11 Variable lights...12 Example 04: Variable lights fragment shader...12 Debugging...13 Effects...15 Example 01: Outlines...17 Example 02: X...20 Example 03: Yellow X on red atoms...24 Example 04: Transparent atoms...25 Resources...28

5 5 multiplied by the input position. We are also setting both the front and back colors from the predefined variable gl_color (which was set via the equivalent of glcolor3d() or by using a vertex array), although technically we probably only need to set the front color. OpenGL will convert the correct one of these (depending on whether the fragment is front-facing or back-facing) into the fragment shader predefined variable gl_color. Local variables are the same as in C or Python. There are int and float types, as well as vectors: vec2, vec3, and vec4. To access the elements of a vector, you can use either the syntax: v.xyzw or v.rgba. You can also access a partial set: vec4 v = vec4(1., 2., 3., 4.); vec2 v2 = v.xy; code: There is also a matrix type. Unlike C, GLSL has no implicit type casting. See the following int i; float f; // This code is wrong. It may compile on some cards / drivers and // fail on others f = i; // This is the correct way f = float(i); Function parameters can be any of the data types, but all function parameters take an additional keyword: in, out, or inout. in or inout means the variable can be read from. out or inout means the variable can be written to. Example 02: Materials fragment shader Putting all of that together, here is the fragment shader for handling materials and lighting on a per-pixel basis. It performs the basic lighting calculations to generate an output color based on two

6 6 lights (OpenGL lights 0 and 1), together with the ambient, diffuse, specular, emission, and shininess properties of the current (front) material. The lighting calculations are the same ones that OpenGL does when using the standard non-shader code, except that the shader does this for each pixel, and the standard pipeline only does this for each vertex. /* This is the corresponding fragment shader for materials */ // Note that this comes from the vertex shader and has been interpolated to // the correct value for this pixel. varying vec3 normal; void getlight(in int light, in vec3 N, inout vec4 ambient, inout vec4 diffuse, inout vec4 specular) vec3 L = normalize(gl_lightsource[light].position.xyz); vec3 H = normalize(gl_lightsource[light].halfvector.xyz); diffuse += max(0.0, dot(n, L)) * gl_frontlightproduct[light].diffuse; specular += pow(max(0.0, dot(n, H)), gl_frontmaterial.shininess) * gl_frontlightproduct[light].specular; ambient += gl_frontlightproduct[light].ambient; void main() vec3 N = normalize(normal); vec4 ambient = vec4(0, 0, 0, 1); vec4 diffuse = vec4(0, 0, 0, 1); vec4 specular = vec4(0, 0, 0, 1); getlight(0, N, ambient, diffuse, specular); getlight(1, N, ambient, diffuse, specular); ambient.w = 1.; diffuse.w = 1.; specular.w = 1.; gl_fragcolor = gl_color * (diffuse + ambient + gl_frontmaterial.emission) + specular; /* Need to copy over alpha */ gl_fragcolor.a = gl_color.a; Example 02: Materials fragment shader This shader makes use of a number of built-in variables. gl_lightsource is an array of

8 8 // is the following distance: // float corner_distance = sqrt(2.0 * radius2); // but since we need to normalize the corner vector computed below // which has length sqrt(2.0), we can simply use radius as corner distance // to compute vertex position of screen-oriented quad. // Compute corner vector vec3 corner_direction = up * up_vector + right * right_vector; // Calculate vertex of screen-oriented quad (billboard) vec4 vertex = vec4(gl_vertex.xyz + radius * corner_direction, gl_vertex.w); // Calculate vertex position in modelview space vec4 eye_space_pos = gl_modelviewmatrix * vertex; // Compute sphere position in modelview space vec4 tmppos = gl_modelviewmatrix * gl_vertex; sphere_center = vec3(tmppos) / tmppos.w; // Compute ray direction and origin point point = vec3(eye_space_pos) / eye_space_pos.w; view_direction = normalize(point); // Pass fog coordinate gl_fogfragcoord = abs(sphere_center.z); // Pass the transformed vertex for clipping plane calculations gl_clipvertex = eye_space_pos; // Pass color color = gl_color; // Pass transformed vertex gl_position = gl_modelviewprojectionmatrix * vertex; Example 03: Sphere vertex shader In this example, the up and right directions are passed as part of the texture for the vertex. These variables are passed in as all combinations of 1 and -1 (e.g. 1, 1; -1, 1). Then, vertex is set to the center plus the up and right vectors. We also pass in some other useful variables (e.g. radius2) to the fragment shader to avoid repetitive computations at the fragment level (which will be called for each pixel). We also set gl_clipvertex to let OpenGL know that we've changed the vertex. It will

9 9 use this modified vertex as the basis for the interpolation for the data sent into the fragment shader. Example 03: Sphere fragment shader The vertex shader produces a quad bounding the sphere, but we still have to draw an actual sphere. The fragment shader takes the data that is passed in and calculates a sphere-ray intersection to determine which points are actually part of the sphere. // Fragment shader // 0 is no fog, 1 is linear, 2 is exp, 3 is exp2 uniform float fogging[4]; uniform float perspective; varying vec4 color; varying vec3 view_direction; varying vec3 sphere_center; varying float radius2; varying vec3 point; const float INV_LOG2 = ; void getlight(in int light, in vec3 N, inout vec4 ambient, inout vec4 diffuse, inout vec4 specular) vec3 L = normalize(gl_lightsource[light].position.xyz); vec3 H = normalize(gl_lightsource[light].halfvector.xyz); diffuse += max(0.0, dot(n, L)) * gl_frontlightproduct[light].diffuse; specular += pow(max(0.0, dot(n, H)), gl_frontmaterial.shininess) * gl_frontlightproduct[light].specular; ambient += gl_frontlightproduct[light].ambient; void main(void) vec3 ray_origin = mix(point, vec3(0., 0., 0.), perspective); vec3 ray_direction = mix(vec3(0., 0., 1.), normalize(view_direction), perspective); vec3 sphere_direction = mix(ray_origin - sphere_center, sphere_center, perspective); // Calculate sphere-ray intersection float b = mix(dot(sphere_direction, ray_direction), dot(ray_direction, sphere_direction), perspective);

10 10 float position = b * b + radius2 - dot(sphere_direction, sphere_direction); // Check if the ray missed the sphere if (position < 0.0) discard; // Calculate nearest point of intersection float nearest = mix(sqrt(position) - b, b - sqrt(position), perspective); // Calculate intersection point on the sphere surface. The ray // origin is at the quad (center point), so we need to project // back towards the user to get the front face. vec3 ipoint = nearest * ray_direction + ray_origin; // Calculate normal at the intersection point vec3 N = normalize(ipoint - sphere_center); // Calculate depth in fragment space vec2 clipzw = ipoint.z * gl_projectionmatrix[2].zw + gl_projectionmatrix[3].zw; gl_fragdepth = * clipzw.x / clipzw.y; // Calculate lighting vec4 diffuse = vec4(0, 0, 0, 1); vec4 ambient = vec4(0, 0, 0, 1); vec4 specular = vec4(0, 0, 0, 1); getlight(0, N, ambient, diffuse, specular); getlight(1, N, ambient, diffuse, specular); ambient.w = 1.; diffuse.w = 1.; specular.w = 1.; // Calculate fog // No fogging float fog = fogging[0]; // Linear fog fog += mix(0.0, clamp((gl_fog.end - gl_fogfragcoord) * gl_fog.scale, 0.0, 1.0), fogging[1]); // Exp fog fog += mix(0.0, clamp(exp(-gl_fog.density * gl_fogfragcoord), 0.0, 1.0), fogging[2]); // Exp^2 fog: exp(x) = 2^(x/log(2)) fog += mix(0.0, clamp(exp2(-gl_fog.density * gl_fog.density * gl_fogfragcoord * gl_fogfragcoord *

11 11 INV_LOG2), 0.0, 1.0), fogging[3]); // Calculate final color gl_fragcolor = mix(gl_fog.color, color * (diffuse + ambient + gl_frontmaterial.emission) + specular, fog); Example 03: Sphere fragment shader The getlight() function is the same as in the materials shader. For spheres, we add in fogging. The fog code we have replicates the fogging modes in the fixed pipeline. if statements and the mix() function In graphics cards, if statements are typically very slow. On the other hand, the mix() function is very fast. To handle perspective versus orthogonal drawing, we use the perspective variable in combination with mix(). The mix() statement works as an if statement when you restrict your conditional values to 0 and 1. Basically: result = mix(x, y, condition) sets result to y if condition is 1 and x if condition is 0. Passing data You can pass data which doesn't vary across vertices (e.g. a highlight color) by using uniform variables. However, when you need to pass distinct data on a per-vertex basis, that won't work. Instead, you need to make full use of the variables which do vary on a per-vertex basis: Coordinate data (4 floats): you can use the fourth component of the coordinates to pass data, but you need to reset the fourth coordinate to 1 before operating on it. Color data (4 floats): if you have a fixed alpha, then you can use the color's alpha value to pass in different information. Texture data (4 floats): this is arbitrary data you can use for what you want.

12 12 Normals (3 floats): if you don't need the normal data, you can pass in your own values. Variable lights In Maestro, by default we enable only lights 0 and 1. Through the GUI, the user can turn off either one of those lights. Through commands, the user can turn on any combination of the eight OpenGL lights. We optimize the default case (as shown in the previous examples). For any other combination of lights, we fall back to a generalized lighting mechanism. Example 04: Variable lights fragment shader To handle the lights, we pass in an array indicating whether or not each light is on (1 for on, 0 for off). In GLSL, if statements are typically slow. Therefore, we want to minimize if statements. Specifically, we want to avoid doing eight if statements in a row. To do that, we make heavy use of the mix() statement. We do a straight multiply against enabled, and we use mix() to generate valid vectors. /* This is the corresponding fragment shader for materials */ uniform float light_enabled[8]; varying vec3 normal; const vec3 UNIT_VEC3 = vec3(1.0, 0.0, 0.0); void getlight(in int light, in float enabled, in vec3 N, inout vec4 ambient, inout vec4 diffuse, inout vec4 specular) vec3 L = normalize(mix(unit_vec3, gl_lightsource[light].position.xyz, enabled)); vec3 H = normalize(mix(unit_vec3, gl_lightsource[light].halfvector.xyz, enabled)); diffuse += enabled * max(0.0, dot(n, L)) * gl_frontlightproduct[light].diffuse; specular += enabled * pow(max(0.0, dot(n, H)), gl_frontmaterial.shininess) * gl_frontlightproduct[light].specular; ambient += enabled * gl_frontlightproduct[light].ambient;

14 14 There are some OpenGL debuggers available, but I haven't used any of them so, I can't comment on their quality. The other way of debugging is to set specific colors to catch specific things (e.g. red for error #1, blue for error #2, yellow for error #3, white for no error). I have used this technique to identify when a calculation was not producing the expected result. If you are specifically trying to debug a vertex shader which rewrites the vertices, you can temporarily switch the fragment shader to simply pass through the input color. That will show you specifically where the vertices are, which might be useful.

15 15 Effects There are a number of effects which are possible using shaders. For reference, here is an image using the standard shader:

16 16 Example 01: Outlines This shader produces an outline around the outside of the structure. The idea with this shader is to set the interior of each sphere to black without adjusting the Z value, so that the spheres erase each other. Given the standard atom sphere fragment shader, the basic changes are to check if we're on the border (position < 0.1), and only then do we adjust the Z value and do the lighting calculations. Otherwise, we set the color to black. // Fragment shader // 0 is no fog, 1 is linear, 2 is exp, 3 is exp2 uniform float fogging[4]; uniform float perspective; varying vec4 color; varying vec3 view_direction; varying vec3 sphere_center; varying float radius2;

17 17 varying vec3 point; const float INV_LOG2 = ; void getlight(in int light, in vec3 N, inout vec4 ambient, inout vec4 diffuse, inout vec4 specular) vec3 L = normalize(gl_lightsource[light].position.xyz); vec3 H = normalize(gl_lightsource[light].halfvector.xyz); diffuse += max(0.0, dot(n, L)) * gl_frontlightproduct[light].diffuse; specular += pow(max(0.0, dot(n, H)), gl_frontmaterial.shininess) * gl_frontlightproduct[light].specular; ambient += gl_frontlightproduct[light].ambient; void main(void) vec3 ray_origin = mix(point, vec3(0., 0., 0.), perspective); vec3 ray_direction = mix(vec3(0., 0., 1.), normalize(view_direction), perspective); vec3 sphere_direction = mix(ray_origin - sphere_center, sphere_center, perspective); // Calculate sphere-ray intersection float b = mix(dot(sphere_direction, ray_direction), dot(ray_direction, sphere_direction), perspective); float position = b * b + radius2 - dot(sphere_direction, sphere_direction); // Check if the ray missed the sphere if (position < 0.0) discard; if (position < 0.1) // Calculate nearest point of intersection float nearest = mix(sqrt(position) - b, b - sqrt(position), perspective); // Calculate intersection point on the sphere surface. The ray // origin is at the quad (center point), so we need to project // back towards the user to get the front face. vec3 ipoint = nearest * ray_direction + ray_origin; // Calculate normal at the intersection point vec3 N = normalize(ipoint - sphere_center); // Calculate depth in fragment space vec2 clipzw = ipoint.z * gl_projectionmatrix[2].zw + gl_projectionmatrix[3].zw; gl_fragdepth = * clipzw.x / clipzw.y;

18 18 // Calculate lighting vec4 diffuse = vec4(0, 0, 0, 1); vec4 ambient = vec4(0, 0, 0, 1); vec4 specular = vec4(0, 0, 0, 1); getlight(0, N, ambient, diffuse, specular); getlight(1, N, ambient, diffuse, specular); ambient.w = 1.; diffuse.w = 1.; specular.w = 1.; // Calculate fog // No fogging float fog = fogging[0]; // Linear fog fog += mix(0.0, clamp((gl_fog.end - gl_fogfragcoord) * gl_fog.scale, 0.0, 1.0), fogging[1]); // Exp fog fog += mix(0.0, clamp(exp(-gl_fog.density * gl_fogfragcoord), 0.0, 1.0), fogging[2]); // Exp^2 fog: exp(x) = 2^(x/log(2)) fog += mix(0.0, clamp(exp2(-gl_fog.density * gl_fog.density * gl_fogfragcoord * gl_fogfragcoord * INV_LOG2), 0.0, 1.0), fogging[3]); // Calculate final color gl_fragcolor = mix(gl_fog.color, color * (diffuse + ambient + gl_frontmaterial.emission) + specular, fog); else gl_fragcolor = vec4(0., 0., 0., 1.); Example 01: Outline fragment shader

19 19 Example 02: X This example puts an X on all of the spheres. This shader makes use of the up and right data which is passed into the vertex shader. Since these values are not exported from the vertex shader in the standard shaders, this shader requires both a new vertex shader and a new fragment shader. // Vertex shader uniform vec3 right_vector; uniform vec3 up_vector; varying vec4 color; varying vec3 view_direction; varying vec3 sphere_center; varying float radius2; varying vec3 point; varying float u1; varying float r1;

20 20 void main(void) // Get billboard attributes float right = gl_multitexcoord0.x; float up = gl_multitexcoord0.y; float radius = gl_multitexcoord0.z; radius2 = radius * radius; // compute squared radius u1 = up; r1 = right; // We need to project the vertex out to the edge of the square, which // is the following distance: // float corner_distance = sqrt(2.0 * radius2); // but since we need to normalize the corner vector computed below // which has length sqrt(2.0), we can simply use radius as corner distance // to compute vertex position of screen-oriented quad. // Compute corner vector vec3 corner_direction = up * up_vector + right * right_vector; // Calculate vertex of screen-oriented quad (billboard) vec4 vertex = vec4(gl_vertex.xyz + radius * corner_direction, gl_vertex.w); // Calculate vertex position in modelview space vec4 eye_space_pos = gl_modelviewmatrix * vertex; // Compute sphere position in modelview space vec4 tmppos = gl_modelviewmatrix * gl_vertex; sphere_center = vec3(tmppos) / tmppos.w; // Compute ray direction and origin point point = vec3(eye_space_pos) / eye_space_pos.w; view_direction = normalize(point); // Pass fog coordinate gl_fogfragcoord = abs(sphere_center.z); // Pass the transformed vertex for clipping plane calculations gl_clipvertex = eye_space_pos; // Pass color color = gl_color; // Pass transformed vertex gl_position = gl_modelviewprojectionmatrix * vertex;

21 21 Example 02: X vertex shader Notice that we are simply copying the up and right variables to u1 and r1. In the fragment shader, we produce a cheap unlighted effect for the X by inverting the normal. // Fragment shader // 0 is no fog, 1 is linear, 2 is exp, 3 is exp2 uniform float fogging[4]; uniform float perspective; varying vec4 color; varying vec3 view_direction; varying vec3 sphere_center; varying float radius2; varying vec3 point; varying float u1; varying float r1; const float INV_LOG2 = ; void getlight(in int light, in vec3 N, inout vec4 ambient, inout vec4 diffuse, inout vec4 specular) vec3 L = normalize(gl_lightsource[light].position.xyz); vec3 H = normalize(gl_lightsource[light].halfvector.xyz); diffuse += max(0.0, dot(n, L)) * gl_frontlightproduct[light].diffuse; specular += pow(max(0.0, dot(n, H)), gl_frontmaterial.shininess) * gl_frontlightproduct[light].specular; ambient += gl_frontlightproduct[light].ambient; void main(void) vec3 ray_origin = mix(point, vec3(0., 0., 0.), perspective); vec3 ray_direction = mix(vec3(0., 0., 1.), normalize(view_direction), perspective); vec3 sphere_direction = mix(ray_origin - sphere_center, sphere_center, perspective); // Calculate sphere-ray intersection float b = mix(dot(sphere_direction, ray_direction), dot(ray_direction, sphere_direction), perspective); float position = b * b + radius2 - dot(sphere_direction, sphere_direction);

22 22 // Check if the ray missed the sphere if (position < 0.0) discard; // Calculate nearest point of intersection float nearest = mix(sqrt(position) - b, b - sqrt(position), perspective); // Calculate intersection point on the sphere surface. The ray // origin is at the quad (center point), so we need to project // back towards the user to get the front face. vec3 ipoint = nearest * ray_direction + ray_origin; // Calculate normal at the intersection point vec3 N = normalize(ipoint - sphere_center); if (abs(abs(u1) - abs(r1)) < 0.1) N = -N; // Calculate depth in fragment space vec2 clipzw = ipoint.z * gl_projectionmatrix[2].zw + gl_projectionmatrix[3].zw; gl_fragdepth = * clipzw.x / clipzw.y; // Calculate lighting vec4 diffuse = vec4(0, 0, 0, 1); vec4 ambient = vec4(0, 0, 0, 1); vec4 specular = vec4(0, 0, 0, 1); getlight(0, N, ambient, diffuse, specular); getlight(1, N, ambient, diffuse, specular); ambient.w = 1.; diffuse.w = 1.; specular.w = 1.; // Calculate fog // No fogging float fog = fogging[0]; // Linear fog fog += mix(0.0, clamp((gl_fog.end - gl_fogfragcoord) * gl_fog.scale, 0.0, 1.0), fogging[1]); // Exp fog fog += mix(0.0, clamp(exp(-gl_fog.density * gl_fogfragcoord), 0.0, 1.0), fogging[2]); // Exp^2 fog: exp(x) = 2^(x/log(2)) fog += mix(0.0, clamp(exp2(-gl_fog.density * gl_fog.density *

23 23 gl_fogfragcoord * gl_fogfragcoord * INV_LOG2), 0.0, 1.0), fogging[3]); // Calculate final color gl_fragcolor = mix(gl_fog.color, color * (diffuse + ambient + gl_frontmaterial.emission) + specular, fog); Example 02: X fragment shader Example 03: Yellow X on red atoms The next example is the same as the previous example, except that the X only appears on red atoms (e.g. oxygen with the element coloring scheme). We just expand the "X" test to include a color check. Instead of: vec4 color2 = color; if (abs(abs(u1) - abs(r1)) < 0.1) float factor = abs(abs(u1) - abs(r1)) * 10.; // Set the color to yellow color2 = mix(vec4(1., 1., 0., 1.), color, factor);

24 24 Clip from example 02 We do: vec4 color2 = color; // If the sphere is mostly red, then draw an X on it if (abs(abs(u1) - abs(r1)) < 0.1 && color.r > 0.7 && color.g < 0.3 && color.b < 0.3) float factor = abs(abs(u1) - abs(r1)) * 10.; // Set the color to yellow color2 = mix(vec4(1., 1., 0., 1.), color, factor); Example 03: Yellow X for red atoms fragment shader Example 04: Transparent atoms This effect produces a cheesy transparency (50% transparency) on red atoms. We simply discard every other pixel for red atoms. This example uses the standard vertex

25 25 shader, so only the fragment shader is shown. // Fragment shader // 0 is no fog, 1 is linear, 2 is exp, 3 is exp2 uniform float fogging[4]; uniform float perspective; varying vec4 color; varying vec3 view_direction; varying vec3 sphere_center; varying float radius2; varying float depth_level; varying vec3 point; const float INV_LOG2 = ; void getlight(in int light, in vec3 N, inout vec4 ambient, inout vec4 diffuse, inout vec4 specular) vec3 L = normalize(gl_lightsource[light].position.xyz); vec3 H = normalize(gl_lightsource[light].halfvector.xyz); diffuse += max(0.0, dot(n, L)) * gl_frontlightproduct[light].diffuse; specular += pow(max(0.0, dot(n, H)), gl_frontmaterial.shininess) * gl_frontlightproduct[light].specular; ambient += gl_frontlightproduct[light].ambient; void main(void) vec3 ray_origin = mix(point, vec3(0., 0., 0.), perspective); vec3 ray_direction = mix(vec3(0., 0., 1.), normalize(view_direction), perspective); vec3 sphere_direction = mix(ray_origin - sphere_center, sphere_center, perspective); // Calculate sphere-ray intersection float b = mix(dot(sphere_direction, ray_direction), dot(ray_direction, sphere_direction), perspective); float position = b * b + radius2 - dot(sphere_direction, sphere_direction); // Check if the ray missed the sphere if (position < 0.0) discard; // Draw a 50% cheesy transparency effect on red (oxygen) atoms if (color.r > 0.7 && color.g < 0.3 && color.b < 0.3 && (int(abs(gl_fragcoord.x + gl_fragcoord.y)) % 2) == 1)

26 26 discard; // Calculate nearest point of intersection float nearest = mix(sqrt(position) - b, b - sqrt(position), perspective); // Calculate intersection point on the sphere surface. The ray // origin is at the quad (center point), so we need to project // back towards the user to get the front face. vec3 ipoint = nearest * ray_direction + ray_origin; // Calculate normal at the intersection point vec3 N = normalize(ipoint - sphere_center); // Calculate depth in fragment space vec2 clipzw = ipoint.z * gl_projectionmatrix[2].zw + gl_projectionmatrix[3].zw; gl_fragdepth = * clipzw.x / clipzw.y; // Calculate lighting vec4 diffuse = vec4(0, 0, 0, 1); vec4 ambient = vec4(0, 0, 0, 1); vec4 specular = vec4(0, 0, 0, 1); getlight(0, N, ambient, diffuse, specular); getlight(1, N, ambient, diffuse, specular); ambient.w = 1.; diffuse.w = 1.; specular.w = 1.; // Calculate fog // No fogging float fog = fogging[0]; // Linear fog fog += mix(0.0, clamp((gl_fog.end - gl_fogfragcoord) * gl_fog.scale, 0.0, 1.0), fogging[1]); // Exp fog fog += mix(0.0, clamp(exp(-gl_fog.density * gl_fogfragcoord), 0.0, 1.0), fogging[2]); // Exp^2 fog: exp(x) = 2^(x/log(2)) fog += mix(0.0, clamp(exp2(-gl_fog.density * gl_fog.density * gl_fogfragcoord * gl_fogfragcoord * INV_LOG2), 0.0, 1.0), fogging[3]); // Calculate final color gl_fragcolor = mix(gl_fog.color, color * (diffuse + ambient +

27 27 gl_frontmaterial.emission) + specular, fog); Example 04: Transparent red atom fragment shader Resources This is a list of useful resources for GLSL. OpenGL v3.2 (GLSL 1.5) quick reference card: GLSL v1.20 quick reference card: Shader Toy (allows experimenting with different shaders in very recent web browsers):

### Shader Programs. Lecture 30 Subsections 2.8.2, Robb T. Koether. Hampden-Sydney College. Wed, Nov 16, 2011

Shader Programs Lecture 30 Subsections 2.8.2, 2.8.3 Robb T. Koether Hampden-Sydney College Wed, Nov 16, 2011 Robb T. Koether (Hampden-Sydney College) Shader Programs Wed, Nov 16, 2011 1 / 43 Outline 1

### Programming shaders & GPUs Christian Miller CS Fall 2011

Programming shaders & GPUs Christian Miller CS 354 - Fall 2011 Fixed-function vs. programmable Up until 2001, graphics cards implemented the whole pipeline for you Fixed functionality but configurable

### Supplement to Lecture 22

Supplement to Lecture 22 Programmable GPUs Programmable Pipelines Introduce programmable pipelines - Vertex shaders - Fragment shaders Introduce shading languages - Needed to describe shaders - RenderMan

### Programmable Graphics Hardware

CSCI 420 Computer Graphics Lecture 14 Programmable Graphics Hardware OpenGL Extensions Shading Languages Vertex Program Fragment Program [Angel Ch. 9] Jernej Barbic University of Southern California 1

### Programmable Graphics Hardware

CSCI 480 Computer Graphics Lecture 14 Programmable Graphics Hardware [Ch. 9] March 2, 2011 Jernej Barbic University of Southern California OpenGL Extensions Shading Languages Vertex Program Fragment Program

### 12.2 Programmable Graphics Hardware

Fall 2018 CSCI 420: Computer Graphics 12.2 Programmable Graphics Hardware Kyle Morgenroth http://cs420.hao-li.com 1 Introduction Recent major advance in real time graphics is the programmable pipeline:

### GLSL Introduction. Fu-Chung Huang. Thanks for materials from many other people

GLSL Introduction Fu-Chung Huang Thanks for materials from many other people Shader Languages Currently 3 major shader languages Cg (Nvidia) HLSL (Microsoft) Derived from Cg GLSL (OpenGL) Main influences

### Programmable GPUs. Real Time Graphics 11/13/2013. Nalu 2004 (NVIDIA Corporation) GeForce 6. Virtua Fighter 1995 (SEGA Corporation) NV1

Programmable GPUs Real Time Graphics Virtua Fighter 1995 (SEGA Corporation) NV1 Dead or Alive 3 2001 (Tecmo Corporation) Xbox (NV2A) Nalu 2004 (NVIDIA Corporation) GeForce 6 Human Head 2006 (NVIDIA Corporation)

### CS 4620 Program 3: Pipeline

CS 4620 Program 3: Pipeline out: Saturday 18 October 2008 due: Tuesday 28 October 2008 1 Introduction In this assignment, you will implement several types of shading in a simple software graphics pipeline.

### CSE 167: Lecture #8: GLSL. Jürgen P. Schulze, Ph.D. University of California, San Diego Fall Quarter 2012

CSE 167: Introduction to Computer Graphics Lecture #8: GLSL Jürgen P. Schulze, Ph.D. University of California, San Diego Fall Quarter 2012 Announcements Homework project #4 due Friday, November 2 nd Introduction:

### The Graphics Pipeline and OpenGL III: OpenGL Shading Language (GLSL 1.10)!

! The Graphics Pipeline and OpenGL III: OpenGL Shading Language (GLSL 1.10)! Gordon Wetzstein! Stanford University! EE 267 Virtual Reality! Lecture 4! stanford.edu/class/ee267/! Updates! for 24h lab access:

### GLSL Introduction. Fu-Chung Huang. Thanks for materials from many other people

GLSL Introduction Fu-Chung Huang Thanks for materials from many other people Programmable Shaders //per vertex inputs from main attribute aposition; attribute anormal; //outputs to frag. program varying

### Today. Rendering - III. Outline. Texturing: The 10,000m View. Texture Coordinates. Specifying Texture Coordinates in GL

Today Rendering - III CS148, Summer 2010 Graphics Pipeline and Programmable Shaders Artist Workflow Siddhartha Chaudhuri 1 2 Outline Texturing: The 10,000m View Intro to textures The fixed-function graphics

### CS 4620 Program 3: Pipeline

CS 4620 Program 3: Pipeline out: Wednesday 14 October 2009 due: Friday 30 October 2009 1 Introduction In this assignment, you will implement several types of shading in a simple software graphics pipeline.

### The Transition from RenderMan to the OpenGL Shading Language (GLSL)

1 The Transition from RenderMan to the OpenGL Shading Language (GLSL) Mike Bailey mjb@cs.oregonstate.edu This work is licensed under a Creative Commons Attribution-NonCommercial- NoDerivatives 4.0 International

### TSBK03 Screen-Space Ambient Occlusion

TSBK03 Screen-Space Ambient Occlusion Joakim Gebart, Jimmy Liikala December 15, 2013 Contents 1 Abstract 1 2 History 2 2.1 Crysis method..................................... 2 3 Chosen method 2 3.1 Algorithm

### Lecture 17: Shading in OpenGL. CITS3003 Graphics & Animation

Lecture 17: Shading in OpenGL CITS3003 Graphics & Animation E. Angel and D. Shreiner: Interactive Computer Graphics 6E Addison-Wesley 2012 Objectives Introduce the OpenGL shading methods - per vertex shading

### Shader Programming. Daniel Wesslén, Stefan Seipel, Examples

Shader Programming Daniel Wesslén, dwn@hig.se Stefan Seipel, ssl@hig.se Examples 1 Per-pixel lighting Texture convolution filtering 2 Post-processing, animated procedural textures Vertex displacement mapping

Sign up for crits! Announcments Reading for Next Week FvD 16.1-16.3 local lighting models GL 5 lighting GL 9 (skim) texture mapping Modern Game Techniques CS248 Lecture Nov 13 Andrew Adams Overview The

### Introduction to Shaders for Visualization. The Basic Computer Graphics Pipeline

Introduction to Shaders for Visualization Mike Bailey The Basic Computer Graphics Pipeline Model Transform View Transform Per-vertex Lighting Projection Transform Homogeneous Division Viewport Transform

### Introduction to the OpenGL Shading Language (GLSL)

1 Introduction to the OpenGL Shading Language (GLSL) This work is licensed under a Creative Commons Attribution-NonCommercial- NoDerivatives 4.0 International License Mike Bailey mjb@cs.oregonstate.edu

### Introduction to Shaders.

Introduction to Shaders Marco Benvegnù hiforce@gmx.it www.benve.org Summer 2005 Overview Rendering pipeline Shaders concepts Shading Languages Shading Tools Effects showcase Setup of a Shader in OpenGL

### Lets assume each object has a defined colour. Hence our illumination model is looks unrealistic.

Shading Models There are two main types of rendering that we cover, polygon rendering ray tracing Polygon rendering is used to apply illumination models to polygons, whereas ray tracing applies to arbitrary

### CS 130 Final. Fall 2015

CS 130 Final Fall 2015 Name Student ID Signature You may not ask any questions during the test. If you believe that there is something wrong with a question, write down what you think the question is trying

### The Basic Computer Graphics Pipeline, OpenGL-style. Introduction to the OpenGL Shading Language (GLSL)

Introduction to the OpenGL Shading Language (GLSL) 1 The Basic Pipeline, OpenGL-style Vertex, Normal, Color ModelViewMatrix, ProjectionMatrix, ModelViewProjectionMatrix 2 MC Model WC View Per-vertex Projection

### CS 130 Final. Fall 2015

CS 130 Final Fall 2015 Name Student ID Signature You may not ask any questions during the test. If you believe that there is something wrong with a question, write down what you think the question is trying

### Pipeline Operations. CS 4620 Lecture Steve Marschner. Cornell CS4620 Spring 2018 Lecture 11

Pipeline Operations CS 4620 Lecture 11 1 Pipeline you are here APPLICATION COMMAND STREAM 3D transformations; shading VERTEX PROCESSING TRANSFORMED GEOMETRY conversion of primitives to pixels RASTERIZATION

### Lab 9 - Metal and Glass

Lab 9 - Metal and Glass Let the form of an object be what it may, light, shade, and perspective will always make it beautiful. -John Constable Prologue Support code: /course/cs1230/src/labs/lab09 This

### Introduction to the OpenGL Shading Language

Introduction to the OpenGL Shading Language Randi Rost Director of Developer Relations, 3Dlabs 08-Dec-2005 1 Why use graphics programmability? Graphics hardware has changed radically Fixed functionality

### Objectives Shading in OpenGL. Front and Back Faces. OpenGL shading. Introduce the OpenGL shading methods. Discuss polygonal shading

Objectives Shading in OpenGL Introduce the OpenGL shading methods - per vertex shading vs per fragment shading - Where to carry out Discuss polygonal shading - Flat - Smooth - Gouraud CITS3003 Graphics

### Pipeline Operations. CS 4620 Lecture 14

Pipeline Operations CS 4620 Lecture 14 2014 Steve Marschner 1 Pipeline you are here APPLICATION COMMAND STREAM 3D transformations; shading VERTEX PROCESSING TRANSFORMED GEOMETRY conversion of primitives

### CSE 167: Introduction to Computer Graphics Lecture #13: GLSL. Jürgen P. Schulze, Ph.D. University of California, San Diego Fall Quarter 2015

CSE 167: Introduction to Computer Graphics Lecture #13: GLSL Jürgen P. Schulze, Ph.D. University of California, San Diego Fall Quarter 2015 Announcements Project 6 due Friday Next Thursday: Midterm #2

### MXwendler Fragment Shader Development Reference Version 1.0

MXwendler Fragment Shader Development Reference Version 1.0 This document describes the MXwendler fragmentshader interface. You will learn how to write shaders using the GLSL language standards and the

### CMPS160 Shader-based OpenGL Programming. All slides originally from Prabath Gunawardane, et al. unless noted otherwise

CMPS160 Shader-based OpenGL Programming All slides originally from Prabath Gunawardane, et al. unless noted otherwise Shader gallery I Above: Demo of Microsoft s XNA game platform Right: Product demos

### Information Coding / Computer Graphics, ISY, LiTH GLSL. OpenGL Shading Language. Language with syntax similar to C

GLSL OpenGL Shading Language Language with syntax similar to C Syntax somewhere between C och C++ No classes. Straight ans simple code. Remarkably understandable and obvious! Avoids most of the bad things

### Methodology for Lecture. Importance of Lighting. Outline. Shading Models. Brief primer on Color. Foundations of Computer Graphics (Spring 2010)

Foundations of Computer Graphics (Spring 2010) CS 184, Lecture 11: OpenGL 3 http://inst.eecs.berkeley.edu/~cs184 Methodology for Lecture Lecture deals with lighting (teapot shaded as in HW1) Some Nate

### Shaders. Slide credit to Prof. Zwicker

Shaders Slide credit to Prof. Zwicker 2 Today Shader programming 3 Complete model Blinn model with several light sources i diffuse specular ambient How is this implemented on the graphics processor (GPU)?

### CS 130 Exam I. Fall 2015

S 3 Exam I Fall 25 Name Student ID Signature You may not ask any questions during the test. If you believe that there is something wrong with a question, write down what you think the question is trying

### OpenGL shaders and programming models that provide object persistence

OpenGL shaders and programming models that provide object persistence COSC342 Lecture 22 19 May 2016 OpenGL shaders We discussed forms of local illumination in the ray tracing lectures. We also saw that

### WebGL and GLSL Basics. CS559 Fall 2015 Lecture 10 October 6, 2015

WebGL and GLSL Basics CS559 Fall 2015 Lecture 10 October 6, 2015 Last time Hardware Rasterization For each point: Compute barycentric coords Decide if in or out.7,.7, -.4 1.1, 0, -.1.9,.05,.05.33,.33,.33

### Shaders CSCI 4239/5239 Advanced Computer Graphics Spring 2014

Shaders CSCI 4239/5239 Advanced Computer Graphics Spring 2014 What is a Shader? Wikipedia: A shader is a computer program used in 3D computer graphics to determine the final surface properties of an object

### CS559 Computer Graphics Fall 2015

CS559 Computer Graphics Fall 2015 Practice Midterm Exam Time: 2 hrs 1. [XX Y Y % = ZZ%] MULTIPLE CHOICE SECTION. Circle or underline the correct answer (or answers). You do not need to provide a justification

### Programming with OpenGL Part 3: Shaders. Ed Angel Professor of Emeritus of Computer Science University of New Mexico

Programming with OpenGL Part 3: Shaders Ed Angel Professor of Emeritus of Computer Science University of New Mexico 1 Objectives Simple Shaders - Vertex shader - Fragment shaders Programming shaders with

### Lecture 09: Shaders (Part 1)

Lecture 09: Shaders (Part 1) CSE 40166 Computer Graphics Peter Bui University of Notre Dame, IN, USA November 9, 2010 OpenGL Rendering Pipeline OpenGL Rendering Pipeline (Pseudo-Code) 1 f o r gl_vertex

### Programmable Graphics Hardware

Programmable Graphics Hardware Outline 2/ 49 A brief Introduction into Programmable Graphics Hardware Hardware Graphics Pipeline Shading Languages Tools GPGPU Resources Hardware Graphics Pipeline 3/ 49

### CS 381 Computer Graphics, Fall 2012 Midterm Exam Solutions. The Midterm Exam was given in class on Tuesday, October 16, 2012.

CS 381 Computer Graphics, Fall 2012 Midterm Exam Solutions The Midterm Exam was given in class on Tuesday, October 16, 2012. 1. [7 pts] Synthetic-Camera Model. Describe the Synthetic-Camera Model : how

### Deferred Rendering Due: Wednesday November 15 at 10pm

CMSC 23700 Autumn 2017 Introduction to Computer Graphics Project 4 November 2, 2017 Deferred Rendering Due: Wednesday November 15 at 10pm 1 Summary This assignment uses the same application architecture

### Levy: Constraint Texture Mapping, SIGGRAPH, CS 148, Summer 2012 Introduction to Computer Graphics and Imaging Justin Solomon

Levy: Constraint Texture Mapping, SIGGRAPH, 2001 CS 148, Summer 2012 Introduction to Computer Graphics and Imaging Justin Solomon Instructor: Justin Solomon Email: justin.solomon@stanford.edu Office: Clark

### SHADER PROGRAMMING. Based on Jian Huang s lecture on Shader Programming

SHADER PROGRAMMING Based on Jian Huang s lecture on Shader Programming What OpenGL 15 years ago could do http://www.neilturner.me.uk/shots/opengl-big.jpg What OpenGL can do now What s Changed? 15 years

### GLSL 1: Basics. J.Tumblin-Modified SLIDES from:

GLSL 1: Basics J.Tumblin-Modified SLIDES from: Ed Angel Professor of Computer Science, Electrical and Computer Engineering, and Media Arts Director, Arts Technology Center University of New Mexico and

### Shaders CSCI 4229/5229 Computer Graphics Fall 2017

Shaders CSCI 4229/5229 Computer Graphics Fall 2017 What is a Shader? A shader is a computer program that runs on the GPU to calculate the properties of vertexes, pixels and other graphical processing Examples:

### EDAF80 Introduction to Computer Graphics. Seminar 3. Shaders. Michael Doggett. Slides by Carl Johan Gribel,

EDAF80 Introduction to Computer Graphics Seminar 3 Shaders Michael Doggett 2017 Slides by Carl Johan Gribel, 2010-13 Today OpenGL Shader Language (GLSL) Shading theory Assignment 3: (you guessed it) writing

### Adaptive Point Cloud Rendering

1 Adaptive Point Cloud Rendering Project Plan Final Group: May13-11 Christopher Jeffers Eric Jensen Joel Rausch Client: Siemens PLM Software Client Contact: Michael Carter Adviser: Simanta Mitra 4/29/13

### LSU EE Homework 5 Solution Due: 27 November 2017

LSU EE 4702 1 Homework 5 Solution Due: 27 November 2017 The solution code is in the repository in file hw05-shdr-sol.cc. Running the makefile will generate an executable for the solution named hw05-sol.

### WebGL and GLSL Basics. CS559 Fall 2016 Lecture 14 October

WebGL and GLSL Basics CS559 Fall 2016 Lecture 14 October 24 2016 Review Hardware Rasterization For each point: Compute barycentric coords Decide if in or out.7,.7, -.4 1.1, 0, -.1.9,.05,.05.33,.33,.33

### GPU Programming EE Midterm Examination

Name Solution GPU Programming EE 4702- Midterm Examination Wednesday, 2 November 204 9:30 0:20 CST Alias Phylæ has landed! Problem Problem 2 Problem 3 Problem 4 Problem 5 Problem 6 Exam Total (8 pts) (2

### 1 of 5 9/10/ :11 PM

Shader programs Summary: This tutorial shows how to write a simple shader in X3D. Shader program definition Keywords: tutorial, X3D, world, rendering Author(s): Yvonne Jung Date: 2007-02-05 First an example

### Lecture 5 Vertex and Fragment Shaders-1. CITS3003 Graphics & Animation

Lecture 5 Vertex and Fragment Shaders-1 CITS3003 Graphics & Animation E. Angel and D. Shreiner: Interactive Computer Graphics 6E Addison-Wesley 2012 Objectives The rendering pipeline and the shaders Data

### Computer Graphics Coursework 1

Computer Graphics Coursework 1 Deadline Deadline: 4pm, 24/10/2016 4pm 23/10/2015 Outline The aim of the coursework is to modify the vertex and fragment shaders in the provided OpenGL framework to implement

### Today s Agenda. Basic design of a graphics system. Introduction to OpenGL

Today s Agenda Basic design of a graphics system Introduction to OpenGL Image Compositing Compositing one image over another is most common choice can think of each image drawn on a transparent plastic

### CMPS160 Shader-based OpenGL Programming

CMPS160 Shader-based OpenGL Programming Shader gallery I Above: Demo of Microsoft s XNA game platform Right: Product demos by nvidia (top) and Radeon (bottom) Shader gallery II Above: Kevin Boulanger (PhD

### Graphics Programming. Computer Graphics, VT 2016 Lecture 2, Chapter 2. Fredrik Nysjö Centre for Image analysis Uppsala University

Graphics Programming Computer Graphics, VT 2016 Lecture 2, Chapter 2 Fredrik Nysjö Centre for Image analysis Uppsala University Graphics programming Typically deals with How to define a 3D scene with a

### Programming with OpenGL Shaders I. Adapted From: Ed Angel Professor of Emeritus of Computer Science University of New Mexico

Programming with OpenGL Shaders I Adapted From: Ed Angel Professor of Emeritus of Computer Science University of New Mexico 0 Objectives Shader Basics Simple Shaders Vertex shader Fragment shaders 1 Vertex

### Zeyang Li Carnegie Mellon University

Zeyang Li Carnegie Mellon University Recap: Texture Mapping Programmable Graphics Pipeline Bump Mapping Displacement Mapping Environment Mapping GLSL Overview Perlin Noise GPGPU Map reflectance over a

### Computergrafik. Matthias Zwicker. Herbst 2010

Computergrafik Matthias Zwicker Universität Bern Herbst 2010 Today Bump mapping Shadows Shadow mapping Shadow mapping in OpenGL Bump mapping Surface detail is often the result of small perturbations in

### Technical Game Development II. Reference: Rost, OpenGL Shading Language, 2nd Ed., AW, 2006 The Orange Book Also take CS 4731 Computer Graphics

Shader Programming Technical Game Development II Professor Charles Rich Computer Science Department rich@wpi.edu Reference: Rost, OpenGL Shading Language, 2nd Ed., AW, 2006 The Orange Book Also take CS

### GPU Programming EE Final Examination

Name Solution GPU Programming EE 4702-1 Final Examination Friday, 11 December 2015 15:00 17:00 CST Alias Methane? Problem 1 Problem 2 Problem 3 Problem 4 Problem 5 Problem 6 Exam Total (20 pts) (15 pts)

### CS 130 Exam I. Fall 2015

CS 130 Exam I Fall 2015 Name Student ID Signature You may not ask any questions during the test. If you believe that there is something wrong with a question, write down what you think the question is

### Understanding M3G 2.0 and its Effect on Producing Exceptional 3D Java-Based Graphics. Sean Ellis Consultant Graphics Engineer ARM, Maidenhead

Understanding M3G 2.0 and its Effect on Producing Exceptional 3D Java-Based Graphics Sean Ellis Consultant Graphics Engineer ARM, Maidenhead Introduction M3G 1.x Recap ARM M3G Integration M3G 2.0 Update

### C P S C 314 S H A D E R S, O P E N G L, & J S RENDERING PIPELINE. Mikhail Bessmeltsev

C P S C 314 S H A D E R S, O P E N G L, & J S RENDERING PIPELINE UGRAD.CS.UBC.C A/~CS314 Mikhail Bessmeltsev 1 WHAT IS RENDERING? Generating image from a 3D scene 2 WHAT IS RENDERING? Generating image

### Programmable shader. Hanyang University

Programmable shader Hanyang University Objective API references (will be skipped) Examples Simple shader Phong shading shader INTRODUCTION GLSL(OPENGL SHADING LANGUAGE) Scalar Data types Structure Structures

### The Graphics Pipeline and OpenGL III: OpenGL Shading Language (GLSL 1.10)!

! The Graphics Pipeline and OpenGL III: OpenGL Shading Language (GLSL 1.10)! Gordon Wetzstein! Stanford University! EE 267 Virtual Reality! Lecture 4! stanford.edu/class/ee267/! Lecture Overview! Review

### [175 points] The purpose of this assignment is to give you practice with shaders in OpenGL.

CPSC 441 Computer Graphics Assignment 5 due 11/20/18 (11:59 p.m.) [175 points] The purpose of this assignment is to give you practice with shaders in OpenGL. Part 1: First, download and get the code itself

### Some advantages come from the limited environment! No classes. Stranight ans simple code. Remarkably. Avoids most of the bad things with C/C++.

GLSL OpenGL Shading Language Language with syntax similar to C Syntax somewhere between C och C++ No classes. Stranight ans simple code. Remarkably understandable and obvious! Avoids most of the bad things

### CS452/552; EE465/505. Intro to Lighting

CS452/552; EE465/505 Intro to Lighting 2-10 15 Outline! Projection Normalization! Introduction to Lighting (and Shading) Read: Angel Chapter 5., sections 5.4-5.7 Parallel Projections Chapter 6, sections

### Computer Graphics (CS 543) Lecture 8a: Per-Vertex lighting, Shading and Per-Fragment lighting

Computer Graphics (CS 543) Lecture 8a: Per-Vertex lighting, Shading and Per-Fragment lighting Prof Emmanuel Agu Computer Science Dept. Worcester Polytechnic Institute (WPI) Computation of Vectors To calculate

### GPU Programming EE Final Examination

Name GPU Programming EE 4702-1 Final Examination Tuesday, 5 December 2017 12:30 14:30 CST Alias Problem 1 Problem 2 Problem 3 Problem 4 Exam Total (15 pts) (20 pts) (30 pts) (35 pts) (100 pts) Good Luck!

### Shaders. Introduction. OpenGL Grows via Extensions. OpenGL Extensions. OpenGL 2.0 Added Shaders. Shaders Enable Many New Effects

CSCI 420 Computer Graphics Lecture 4 Shaders Jernej Barbic University of Southern California Shading Languages GLSL Vertex Array Objects Vertex Shader Fragment Shader [Angel Ch. 1, 2, A] Introduction The

### Computergrafik. Matthias Zwicker Universität Bern Herbst 2016

Computergrafik Matthias Zwicker Universität Bern Herbst 2016 Today More shading Environment maps Reflection mapping Irradiance environment maps Ambient occlusion Reflection and refraction Toon shading

### OPENGL RENDERING PIPELINE

CPSC 314 03 SHADERS, OPENGL, & JS UGRAD.CS.UBC.CA/~CS314 Textbook: Appendix A* (helpful, but different version of OpenGL) Alla Sheffer Sep 2016 OPENGL RENDERING PIPELINE 1 OPENGL RENDERING PIPELINE Javascript

### Waves, Displacement, Reflections. Arun Rao CS 594

Waves, Displacement, Reflections Arun Rao CS 594 Goals Simple looking waves Waves displace and change orientation of things on top Reflections on surface Partially see through How do we create the Waves?

### Real-Time Rendering (Echtzeitgraphik) Michael Wimmer

Real-Time Rendering (Echtzeitgraphik) Michael Wimmer wimmer@cg.tuwien.ac.at Walking down the graphics pipeline Application Geometry Rasterizer What for? Understanding the rendering pipeline is the key

### Orthogonal Projection Matrices. Angel and Shreiner: Interactive Computer Graphics 7E Addison-Wesley 2015

Orthogonal Projection Matrices 1 Objectives Derive the projection matrices used for standard orthogonal projections Introduce oblique projections Introduce projection normalization 2 Normalization Rather

### OUTLINE. Learn the basic design of a graphics system Introduce pipeline architecture Examine software components for a graphics system

GRAPHICS PIPELINE 1 OUTLINE Learn the basic design of a graphics system Introduce pipeline architecture Examine software components for a graphics system 2 IMAGE FORMATION REVISITED Can we mimic the synthetic

### CS4621/5621 Fall Computer Graphics Practicum Intro to OpenGL/GLSL

CS4621/5621 Fall 2015 Computer Graphics Practicum Intro to OpenGL/GLSL Professor: Kavita Bala Instructor: Nicolas Savva with slides from Balazs Kovacs, Eston Schweickart, Daniel Schroeder, Jiang Huang

### Lecture 2. Shaders, GLSL and GPGPU

Lecture 2 Shaders, GLSL and GPGPU Is it interesting to do GPU computing with graphics APIs today? Lecture overview Why care about shaders for computing? Shaders for graphics GLSL Computing with shaders

### Lecture 13: OpenGL Shading Language (GLSL)

Lecture 13: OpenGL Shading Language (GLSL) COMP 175: Computer Graphics April 18, 2018 1/56 Motivation } Last week, we discussed the many of the new tricks in Graphics require low-level access to the Graphics

### INF3320 Computer Graphics and Discrete Geometry

INF3320 Computer Graphics and Discrete Geometry Texturing Christopher Dyken Martin Reimers 06.10.2010 Page 1 Texturing Linear interpolation Real Time Rendering: Chapter 5: Visual Appearance Chapter 6:

### Shadows. Prof. George Wolberg Dept. of Computer Science City College of New York

Shadows Prof. George Wolberg Dept. of Computer Science City College of New York Objectives Introduce Shadow Algorithms Expand to projective textures 2 Flashlight in the Eye Graphics When do we not see

### CS770/870 Spring 2017 Open GL Shader Language GLSL

Preview CS770/870 Spring 2017 Open GL Shader Language GLSL Review traditional graphics pipeline CPU/GPU mixed pipeline issues Shaders GLSL graphics pipeline Based on material from Angel and Shreiner, Interactive

### CS770/870 Spring 2017 Open GL Shader Language GLSL

CS770/870 Spring 2017 Open GL Shader Language GLSL Based on material from Angel and Shreiner, Interactive Computer Graphics, 6 th Edition, Addison-Wesley, 2011 Bailey and Cunningham, Graphics Shaders 2

### Technical Game Development II. Reference: Rost, OpenGL Shading Language, 2nd Ed., AW, 2006 The Orange Book Also take CS 4731 Computer Graphics

Shader Programming Technical Game Development II Professor Charles Rich Computer Science Department rich@wpi.edu Reference: Rost, OpenGL Shading Language, 2nd Ed., AW, 2006 The Orange Book Also take CS

### BCA611 Video Oyunları için 3B Grafik

BCA611 Video Oyunları için 3B Grafik WebGL - Shader Programming Zümra Kavafoğlu Canvas element The HTML element is used to draw graphics on a web page. Create canvas with id, width and height

### Intro to GPU Programming (OpenGL Shading Language) Cliff Lindsay Ph.D. Student CS WPI

Intro to GPU Programming (OpenGL Shading Language) Cliff Lindsay Ph.D. Student CS WPI Talk Summary Topic Coverage Define Shading Languages (loosely) High Level View of GPU Functional Aspects of GPU Example

### Problem Set 4 Part 1 CMSC 427 Distributed: Thursday, November 1, 2007 Due: Tuesday, November 20, 2007

Problem Set 4 Part 1 CMSC 427 Distributed: Thursday, November 1, 2007 Due: Tuesday, November 20, 2007 Programming For this assignment you will write a simple ray tracer. It will be written in C++ without

### Computer Graphics Fundamentals. Jon Macey

Computer Graphics Fundamentals Jon Macey jmacey@bournemouth.ac.uk http://nccastaff.bournemouth.ac.uk/jmacey/ 1 1 What is CG Fundamentals Looking at how Images (and Animations) are actually produced in

### Graphics Hardware. Instructor Stephen J. Guy

Instructor Stephen J. Guy Overview What is a GPU Evolution of GPU GPU Design Modern Features Programmability! Programming Examples Overview What is a GPU Evolution of GPU GPU Design Modern Features Programmability!