- Due Tuesday November 1
Initial Setup
Base your work in this lab on
handout/matsuda-lea/extra/Sin{Cube,Tri}.{js,html}
Create a new directory lab4 in your labs repository.
Make yet another copy of handout/matsuda-lea/lib in your lab4 directory and commit it.
Adjust paths in the example files as necessary to pick up your local copy of the library
This lab is about writing shaders. You may find it useful/neccessary to refer to
Most of the marks in the lab will be for the
a
parts; if you're short of time consider skipping1b
and moving on to2a
.
Part 1a: 2D procedural textures
Generate a 2D circle pattern in the fragment shader using
gl_FragCoord
to control the pattern.Draw your pattern on the faces of a cube.
Put your answer in Q1a.{js,html}.
Part 1b: smoothing
Figure out how to smooth the edges of the circles.
Draw your (smoothed) pattern on the faces of a cube.
Put your answer in Q1b.{js,html}
Part 2a: 3D procedural textures
- Passing the the model coordinates through to the fragment shader as in the SinCube example, generate a circle pattern on each face of the cube, using the model coordinates to control the pattern.
Put your answer in Q2a.{js,html}
Part 2b: Face coloring
- Modify your example so that the (visible) faces get different colors.
- You can do this either purely in the fragment shader or by passing colors in to the fragment shader.
- Put your answer in Q2b.{js,html}