Computer Graphics

Real-time Cloth Simulation in WebGL

I implemented two different cloth models (constraint-based and mass-spring) and combined them with different integrators (explicit Euler and position Verlet), exposing different variables to show the effect on the simulation. For example, we can uncheck the bend constraints in the cloth to see what it will look like without them.

For more about this project, read about it on my blog here!


Inverse Kinematics in Maya (Jacobian Transpose Method)

For my class in Technical Animation, I implemented Jacobian Transpose algorithm for Inverse Kinematics. Here is a video of the demo below, where the end effector follows the position of a cube. I implemented a simple check for points that are unreachable because they are too far by snapping the target to a radius of maximum joint chain length.

I calculated the Jacobian analytically by calculating the rotation axis needed for the effector to reach the target. I made a mistake normalizing the vector from joint to end-effector; that vector should not be normalized as the distance to the end-effector is important. I did all computations in world space up until the Jacobian. However, when applying the rotations, I converted the rotation axis to object space and applied the rotation in object space.

alpha value needs to be changed depending on the length of joints. In this tentacle example, I used alpha = 0.001, but in another test that I did with smaller joints, the alpha needed was larger.

There is a tendency for a rig to become twisted, as shown in the video.

For the future, I want to try to extend this for multi-effector, as well as to use pseudo-inverse and inverse methods, and explore damping. I will also implement FABRIK in my free time and explore different behaviours of both!

For more about the project and download demo files, click here.


Space Bar: Procedural Modeling and Animation in Maya

Shown above: I used Python in Maya to generate an alien-like light fixture for the bar as I was thinking of a futuristic anemone-like structure.

Below: I scripted the rig and animation for the tentacle of one of the monsters in the game. Because of the fluid nature of the tentacle, I needed many bones that would behave in a similar way, and could easily do it with a script.

The tentacle monster is shown in game below:


Soda Stream Shader in GLSL/Unity

I also wrote a simple UV-panning shader for a soda-stream effect that can be seen from the perspective below. The soda-stream effect was implemented with a simple Bezier curve and cylinder model that was rigged to follow the curve points. The distance of the curve was tied to the trigger button value of the controller.

For more about the Space Bar project, click here.


Real-time Rendering – OpenGL Shaders

In my undergraduate studies, I took a course on real-time rendering that taught me modern OpenGL. Here are some of the assignments I did in the course:

Drawing a skybox, performing normal mapping, procedural bump mapping, and reflection mapping:

Using shadow map (depth texture attached to FBO) to create a scene as if it is lit by an image from a projector. Also using PCF (Percentage Closer Filtering) to reduce jaggies at shadow boundaries:

Writing a simple image bloom shader:

Using OpenGL’s tessellation control shader and tessellation evaluation shader to implement view-dependent tessellation and displacing vertices in the mirror region:

Writing a real-time ray-tracer in Shadertoy:


Legacy OpenGL: Parametric Flower Drawing

Done for an introductory Computer Graphics course by creating parametric surfaces for petals and procedurally generating flowers.