Friday, April 12, 2013

Week 7 - NPR Shader

This week I completed my toon shader in GLSL, which was a lot easier than I thought. Below is a short clip of the toon shader in action.


Cel-shading

This was the part I perceived to be most difficult before I began writing the shader. It actually turned out to be quite simple. We simply do our compute our lighting as we normally would, then using the intensity at that point, we sample from a ramp to the diffuse to set of intensities in the map:

We use the sampled black-white intensity here and multiply it by the current geometry's color like we would with a regular diffuse. This achieves the cel-shading affect

Edge Detection

To complete the toon shading effect there is an edge pass. To do this we use a Sobel filter.

A Sobel filter essentially takes an image and using a convolution kernel, it detects differences in color in an image. Simply it detects edges. To do this, before we render our geometry we bind an FBO that has two color render targets, and one depth target. We render our scene to the FBO, passing the color to the first color target, and the normals to the second color target. Then, we use our edge detection program and pass all three render targets to our shader. We then use the sobel filter on the normals render target, and the depth render target and add the edges found in both together to get perfect outlines around all of our geometry.

A good example of toon shading in games, and also happens to be one of my favourites, is the Borderlands franchise. The toon shading in Borderlands is cel-shaded and uses edge detection, however the team at Gearbox took it a step further by creating their textures in such a way that it made it look like it was indeed a comic book. Their characters are also modeled in a non-realistic way which makes the use of the edge detection less obvious while not detracting from the toon effect. There are also some post-processing effects to bring out the richness of the colors, and when playing it the game really does feel like you are in a semi-realistic cartoon world.


No comments:

Post a Comment