Monday, March 8, 2010

Transparent Water: Mission Complete

Success! The water is transparent, the blocks show through, and everything draws in the correct order. I even put in a ground plane to give something for the puzzle blocks to rest on. Now the caustics actually look like caustics on the ground plane.

But, you fix one problem and see a dozen others. There are no shadows, so the blocks still look a little floaty. I should put in some kind of shadow mapping. The caustics don't bend where they overlay the sides of the blocks, which looks a little odd. I could fix that by actually projecting the caustics textures, but I don't think that's a high priority. Also, now that the caustics look like caustics and not highlights on the water, the water looks like it's missing lighting. I wonder if I can use the caustics texture, which I'm already passing into the shader, as a height map to generate normal mapping. Then my water would have ripples!

2 comments:

  1. That's really good given the time frame you implemented all this in!

    I'm interested in getting some water in my game's background myself; would love to hear more about exactly what you've gone through to get it working and what little details make the difference.

    ReplyDelete
  2. Here are the steps to do what I did:
    1. Get the caustics generator program.
    2. Generate bitmaps for each frame of the caustics animation using the caustics generator.
    3. Convert them to PNGs using Sam2P (a free command line tool).
    4. Load all the PNGs into your game.
    5. Use whatever frame rate controller you have to switch frames of the animation at the rate you want.
    6. Send only the current frame of the animation into your shader.
    7. Make a plane to render the caustics texture on.
    8. Turn on alpha blending to make sure you can make your water plane transparent.
    9. Make sure your water plane is being rendered after anything that's supposed to be behind it and before anything that's supposed to be in front of it.
    10. In the shader for the water plane, use the caustics animation frame as the texture, and set the alpha to whatever you want to make it transparent.

    The only other little thing I did was I made the caustics animation black and white and blended it in the shader with a color so I could adjust the color really easily. I used 70% caustics texture and 30% color. The transparency I used was 50%.

    I hope that helps!

    ReplyDelete