Shady Webcam Application

The Mac OS X application can be downloaded here. To run it double click on ShadyWebcam.app.
The Source code for my application can be downloaded here.
To compile from source you will also need my QT Graphics Library. It can be downloaded here.

The lite brite shader was the first one I worked on. It helped me learn the basics of the fragment shader and how to access different pixel values across the texture. After locating the correct fragment to use as the current lites color, the next part was to make it into a circle instead of a square. This was not too bad except when making every other line offset from the on above it. Once that was figured out the final touch was to make the light radially shade outwards so it looked like it was dimmer at the edges.

The Horror Film Shader is a fragment shader. To do this shader I had to take into acount pixel locations relative to the center of the screen. That way they could be darkened based on how far away they were from the center. They changed darkness using a sin wave over time so the dark blur would encroach and recede from the center. The distance didn't change very frame to make it look more realistic. After that, a noise filter was placed over the entire screen and change every couple of frames as well.

The Toon Shading was done in three steps. The first one was to blur the current pixel. Originally I used a gaussian blur and after realizing I needed a normalized blur across all the pixels instead of weighted to reduce the high amount of noise from the camera. The blur could have been even better if multiple passes were made over it. After the even blur across the entire screen, a second and third blur were done to the pixel left of the current and below the current. Then all the pixels were averaged to their respective toon coloring. If the current pixel was a different color then the left or bottom pixel that meant there was an edge so we needed to make the current pixel black. That was how the blur and edges were created. Finally if the pixels were all the same we used to average color pixel.

The lens distortion was created fo my own algorithm inside the fragment shader. Since all of the textures were known to be 800x600 pixels. I knew the center was 400, 300. Based on the pixels distance away from the center we replaced its value with a pixel further away from the center. The second step was to implement chromatic abberation. It isn't so much as chromatic abberation as it is a slight shadow of the current image. With more time it could have been ironed out to have deeper colors.

The normal mapped shader uses the vertex and fragment shader. We need to calculate the eye direction to the vertex and the light direction to the vertex inside the vertex shader so once those values are passed to the fragment shader it can calculate the normal at that position. When it does that, we use the webcam source image as the normal mapping and a base yellow color for the canvas. To have the image change over time, we are sendin values from the opengl application about where the light position is, which changes over time.

The crazy mirror effect is done inside of the fragment shader. It is quite a simple shader, it is just tweaking the size of the pixel offsets to get a decent effect. The distorted image changes over time using a sin wave. Other than that, the values are multiplied or divied by an arbitrary value I decided that made the shader look "cool".

The waving flag effect was created inside the vertex shader. The main thing thing that allowed for this to work was dividing the single quad into lots of little quads or triangles. Then the vertices z values were changed based on the magnitude of the vertex over time using a sin wave. After completing the flag effect I had to make it maximize correctly. Calls to glTranslate and glScale no longer worked so I passed the scale and translation values to the vertex shader and did the calculations in there. This affect also used the pass through geometry shader.

The water rippling effect was done inside the fragment shader. It is very similar to the fun mirror effect which changes using a sin wave over time. Except the equation for the distortion is based on the distance from the mouse point. That way you can make the ripple appear where ever you move the mouse. This affect also used the pass through geometry shader.

The final shader was done solely in the geometry shader. The code from the CS525 site was adapted to fit my QT program. I had to split my quads into triangles since the geometry shader does not accept GL_QUADS. After that I had to make sure it also passed through values that didn't need not be distorted. Finally I used the expanding triangle geometry shader. The main thing I changed was the boom factor and the shrink factor. The boom factor was constant so it filled up the entire bottom right portion of the screen and maximized correctly. The shrink factor changed so it went inside out until the edges touched. All in all simple yet very cool. The biggest problem was getting the opengl code correct.