teaching machines

CS 455 Lecture 20 – Environment Mapping

April 23, 2015 by . Filed under cs455, lectures, spring 2015.



As a lab exercise:

  1. Sync with the class repo to get the environment starter project.
  2. Run the project to find a scene with three models hovering over a terrain and nestled in a skybox. Use the cursor keys to rotate the models. We want to these models to reflect their environment, like they’re made out of chrome.
  3. We need a shader that colors a fragment by shooting a ray from the eye to the fragment and then bouncing off to hit the skybox. Whatever pixel that reflected vector hits is the color we want. We can start by using the skybox shader, which doesn’t do any reflection, but it does the texture lookup that we’ll ultimately want. In OnInitialize, switch shader_programs[2] to draw from skybox.v.glsl and skybox.f.glsl. Run it to see what happens.
  4. Now let’s tackle the reflection problem. Switch the vertex shader to environment.v.glsl and open it for editing. Because we consider the cube map as a box surrounding our world, it’s easiest to compute the reflection vector using world coordinates. We will need three things:
    1. The vertex’s position in world space.
    2. The vertex’s normal in world space.
    3. The camera’s position in world space.

    This shader already receives the vertex’s position in model space. Add an attribute for the normal in model space, a uniform for the camera’s position in world space (which you can get from the Camera class), and a uniform for the transformation matrix that takes us from model space to world space. We’ll use the matrix to turn our model space coordinates to world space coordinates.

  5. Upload the two uniforms in OnDraw. The normal attribute has already been uploaded; it just went unused.
  6. In the vertex shader, transform the vertex’s position and normal to world space.
  7. Compute a world space vector from the camera to the vertex. Let’s call this the incident vector.
  8. Reflect the incident vector about the world space normal:
    vec3 reflection = reflect(incident, normal_world);
  9. This vector points to our skybox! Send it along to the fragment shader (which is still skybox.f.glsl) to do your texture lookup. Run your code and walk close to an object. Do the surfaces facing you reflect what’s behind you? Do the top faces reflect the sky? What do the bottom faces reflect?
  10. Email me a screenshot of your chrome-y surfaces.


Leave a Reply

Your email address will not be published. Required fields are marked *