Workshop 3 #

Exercises #

1. Figure it out the js code of the above sketches.
2. Implement other blending modes. Take this reference as starting point.

Exercise #

Redefine the shape texture coordinates to turn the above image upside down.

Exercises #

1. Include the blue channel in the uv visualization (e.g., use blue with red or green channels).
2. Use other shapes different than the quad as screen filters.

Exercises #

1. Implement other coloring brightness tools such as HSV value V, HSL lightness L or Component average.
2. Implement texture tinting by mixing color and texel interpolated data.

Exercise #

Implement an image / video processing app supporting different masks, including other kernel sizes different than 3x3, and:

• A region-of-interest base tool to selectively apply a given mask.Hint: circular regions around the mouse pointer are handy and quite simple to implement by means of glsl distance.
• A magnifier tool. Requires a bit of research. For instance, look for it in shadertoy.
• Integrate luma and other coloring brightness tools.

What other shader tools would you implement?

Exercise #

Adapt other patterns from the book of shaders (refer also to the shadertoy collection) and map them as textures onto other 3D shapes.

Exercises #

1. Figure out the fragment shader code. Hint: the key to properly sample the texture is to observe that the tepotTex, the near plane and screen space are all isomorphic, i.e., they simply differ by a scaling factor:

2. Complete the other cube faces.

3. Use other platonic solids.

What other non-euclidean geometries applications would you like to implement?

Exercises #

1. Implement your own source dataset and a mechanism to select different images from it.
2. Implement a pixelator in software that doesn’t use spatial coherence and compare the results with those obtained here.

Exercise #

Implement a mosaic (or/and ascii art) visual application.

Exercise #

Implement a scene having the following lighting equation: a=ambient ambient4a=ambientambient4, where ambient4ambient4 is the ambient light color. It should produce something like the sketch below:

Exercise #

Tweak the above diffuse shader to implement a toon shading scene. It should produce something like the sketch below:

Exercise #

Implement a specular reflection scene producing a result like the sketch below:

Exercises #

1. Implement a scene combining ambient, diffuse and specular lights (see the local lighting equation). Consider supporting several point light sources, with attenuation factors and Phong exponents which controls the apparent smoothness of the surface.
2. Study and implement bump mapping. See also normal mapping and parallax mapping.
3. Study and implement reflection mapping.