Projects
Master’s Thesis: Real-Time Grass
Grass is the most prevalent form of vegetation on the Earth’s surface. Thus, it is an essential element in rendering realistic outdoor scenes. But due to the geometric complexity of grass, rendering it realistically in real-time can be difficult and computationally expensive. Furthermore, to produce life-like representations of grass requires faithful physical simulations of movement provided by wind currents. My master’s thesis is all about discovering and implementing real-time grass.
[ Video | Thesis Paper | Download (DX10 Req) | More Info ]
Navier-Stokes Particle System
The Navier-Stokes equations are really quite groovy because they describe the physical properties behind fluid substances, from water and air currents to the motion of stars swirling inside a galaxy. Navier-Stokes is also used as the basis for weather forecasts. If you are interested in this learning more about this physics trickery, Jos Stam gave a great GDC talk about it.
The particle system application is coded in C++ and uses OpenGL/GLUT to render 40,000 particles. Given the vast amount of particles, I decided to take a multi-threaded approach to fork the work into several threads, with each thread handling a block of particles.
[ Video | Source Code ]
Water & Procedural Terrain
Real-time simulation of water and procedurally generated terrain. Coded in my own personal C++/OpenGL 3d engine. This visual features terrain which is produced by 2D-Perlin; its ambient occlusion is pre-calculated per vertex by analyzing surface normals. Shader effects include: Gooch shading, ambient occlusion, fog, reflections, refractions, fresnel, and phong lighting.
OpenCL Perlin Particles
This is one of my first visual applications which uses OpenCL. This video features two-million particles running in realtime at 60hz. Perlin noise is used as a vector field for the particles to travel through. This was coded in C++ using my own personal graphics engine.
Fast Fourier Transform
Real-time animated Fast Fourier Transform based on Tessendorf’s paper. It uses statistical models which decompose the wave height field as a sum of sinusoidal waves. This technique is great for rendering real-time water, but my implementation uses a Fresnel-based lighting model to achieve the nice red-silky texture.
Coded in C++/OpenGL.
Black Star
This piece draws inspiration from two concepts: the black hole and the neutron star. Its gravity absorbs nearby matter, causing the system to be perturbed from its dynamical equilibrium. The particle effects uses a modified boids algorithm and the light rays are rendered by sampling a 2D Perlin noise function. Coded in C++ using the Cinder library.
This piece was being shown at the TRANSMUTATION exhibit at GAFTA, located in San Francisco.
[ More Info | Video | Download (.exe) | Exhibition Description ]
Digital Star
This piece is a stylized abstraction of a star undergoing nuclear fusion. Fusion reactions power the stars and produces all natural elements in the world, including the elements that make up the human body. Real-time simulation that uses 3D cellular automata to generate the boxes. The circles on the bottom right represent the current time in binary. Coded in C++ using the Cinder library.
This piece was being shown at the TRANSMUTATION exhibit at GAFTA, located in San Francisco.
[ More Info | Video | Download (.exe) ]
Magenta Beat
The beat shatters the sphere and ripples the vertices in hues of magenta and cyan. Fragments on screen become audio-reactive and dance to the music of Rei Harakami. This visualizer was developed in my own personal 3d engine. It is coded in C++ and uses OpenGL and fmod.
Funky Flowers
The funkiest flower species discovered by intergalactic scientists! Uses Fast Fourier Transform for beat detection. Each tentacle is controlled by Verlet integration using constraints. This real-time audio-reactive simulation coded in C++ using Cinder library.
[ Video ]
Isometric Frequency
Real-time audioreactive visualizer coded in my personal engine which uses C++ with OpenGL and Fmod libs. I applied some Greeble tech to render the shattered aesthetic and applied simple vertex shading for the spread effect and post-processing for the glitchy aesthetic.
Music by Otograph.
[ Video | Download | Screenshot | Screenshot ]
The Flower Ritual
Real-time audioreactive simulation which uses OpenGL for the rendering and Fmod for the sound. The Flower petal’s vertices and normals are procedurally generated every frame using bezier patches. Water reflection is done in the pixel shader using basic fresnel and normal map warping.
[ Video ]
Pixel Sun
I wanted to capture the beauty of a sunrise within the aesthetic of pixel art. This audio-reactive visualizer was coded in my personal engine (C++) and uses fmod for FFT analysis. It features 3D perlin noise for the rendering of the pixelated clouds and of the water. The music is by Broke for Free.
[ Video | Download (.exe) ]
OpenCL Ray-Marching
This visual uses the ray-marching algorithm upon mathematical distance fields to collect pixel color data. My ray-tracing algorithm uses OpenCL to trace phong lighting, shadows, specular highlights, ambient occlusion and reflection. Ray-marching is used to decrease the number of steps required in the kernel.
Cloth Simulation (Verlet Integration)
Cloth simulated through classical Verlet Integration as explained in this paper. In this simulation, the cloth is being represented by vertices that are connected by line segments. Every line is a constraint and every vertex is a point mass (an object with no dimension, just location and mass). Gravity and other forces are applied to the system while the constraints keep the system intact. Each vertex is updated every frame in accordance to Verlet. This video shows cloth as well as other Verlet simulations.
[ Video | Source Code ]
Terrain (Dynamic LOD)
I implemented a patch based level-of-detail scheme that renders terrain dynamically. It uses a stitching algorithm to blend the different LOD patches together to avoid discontinuity and gaps in the surface mesh. Furthermore, I implemented frustum culling with a quad tree to eliminate unneeded rendering when the geometry is unable to be seen.
[ Video ]
High Dynamic Range
High Dynamic Range (HDR) is just a fancy term for “storing color values much greater than the usual 0.0f to 1.0f used in graphics”. Unlike conventional colors used in graphics, where color values are bound to the range [0.0, 1.0], the color values in HDR has a greater range. It uses tone-mapping to map high-ranged values to the low-range of the monitor. The advantage of HDR is that your scenes appear more realistic than traditional methods.
[ Video ]
Lichtenstein Shader
I wanted to reproduce the aesthetic that was popularized by Roy Lichtenstein in the 1960s. However, I wanted to do it procedurally in real-time using actual 3D models. The shader processes the frame buffer and applies hatching by staggering the pixel’s luminosity. The hatching is done procedurally in the pixel shader and requires no texture lookups. For the edges, a simple sobel filter kernel was used to detect the edges.
Animation & Skinning
Skinning is a popular method of performing real-time deformation of polygon meshes by way of associated bones/joints of an articulated skeleton. Skinning displaces vertices by weights given by the skeletal bone structure. The vertices are displaced in the vertex shader by binding to certain animation matrices.
[ Video ]
3DS-Max Exporter
I’ve implemented my own custom plugin for 3ds-Max that exports meshes and animations to my own custom format. My engine reads in my custom format and displays the meshes in real-time. This video shows the result as well as displaying my exploration into Gooch shading to achieve the golden hue. The model also uses simple phong lighting and specular highlights to achieve that glossy look.
Custom Scripting Language
I’ve coded my own custom scripting language (called Edbonics) and a virtual machine to run the script. My scripting language is first lexically analyzed for tokens and then parsed into a graph. The parsed graph is fed into the code generator in order to convert the script into byte-code. The virtual machine, which is tightly integrated into my 3D engine, then runs the byte-code.
[ Source Code | Sample Script ]
Dynamic Shadow Mapping
Dynamic shadow mapping implemented in C++ and DirectX10. Basically what the algorithm does is it renders the depth of the entire scene onto a render target from the perspective of the light. Then, it renders the scene again from the initial camera position. In the pixel shader, I compared the depths of each pixel to the first render target to determine if that pixel should be occluded by a shadow.
[ Video ]
Screen Space Ambient Occlusion
Screen Space Ambient Occlusion (SSAO) is a rendering technique for efficiently approximating the ambient occlusion effect in real-time. The algorithm is executed purely on the computer’s GPU and implemented in the pixel shader, in which it analyzes the scene depth buffer which is stored in a texture. For every pixel on the screen, the pixel shader samples the depth values around the current pixel and tries to compute the amount of ambient occlusion from each of the sampled points.
Network Space Shooter (UDP)
Using the UDP protocol, I coded a small mini-game in C++ which involves a simple 2D space shooter. Using the mnet library, a thin wrapper around Boost’s ASIO libraries, I developed a client-server model in which mulitple clients can log on to one server and play in the same arena. Have fun!
[ Video | Source Code ]
Procedurally Generated Music
Have you ever wondered what Perlin noise sounds like in musical form? Well, this app featured procedurally generated music that uses Perlin to conduct the harmony. The system iterates through a standard I-IV-V chord progression on the C-major scale and procedurally chooses the notes to be played.
[ Video | Download (.exe) ]
Zen Machine
In an effort to mix color theory and music creation, I have concocted this visual music composer application. Each color on the wheel corresponds to one musical note in the C-Maj-7th chord. Coded in C++ using OpenFrameworks.
[ Video | Download (.exe) ]
Zen Galaxy (Ribbon Boids)
Uses Craig Reynoid’s flocking algorithm (Boids) mixed in with some 3D Perlin Noise to generate the semi-random behavoir. The camera follows the boid cluster via a mass-spring damper physics system in order keep the camera movement smooth. Coded in C++ using the Cinder library.
[ Video | Download (.exe) ]
Colors & Movement
This piece was heavily inspired by the movement and opacity of the ribbons from the Chinese ribbon dance. The movement of the lines are controlled by Perlin noise, which is one of the most delicious algorithms for natural movement.
I began coding a new rendering engine from scratch (C++/OpenGL) and decided to use this visualizer as a proof-of-tech that the engine can actually render stuff on screen.
[ Video | Download (.exe) ]
Space Glue (Metaballs)
Metaballs is an extremely effective way of rendering isosurfaces. This project utilizes a 2D rendition of the metaballs algorithm in which it uses simple distance calculation of points in the pixel shader. Coded in C++ using Cinder.
[ Video | Download (.exe) ]
Aquatic Pixels (HTML5)
Aquatic Pixels is my first visual using HTML5 Canvas and Javascript. I was heavily inspired by the beautiful aesthetic aquariums. Best viewed in Google Chrome. Artwork by Mike Hussinger.
[ View Here (HTML5) | More Info ]
Mini WebGL Experiments
This is just me trying out various small WebGL experiments. WebGL is quite neat and it is great to finally have proper graphics hardware support on web surfaces. However, I have decided not to dive too deep in to WebGL because the lack of operator-overload support in Javascript deeply disturbed me.
[ Experiment 1 | Experiment 2 | Experiment 3 ]
Aquatic Pixels (Android App)
Aquatic Pixels is an Android app that depicts an aquarium in pixel art. It is currently available on the Android Marketplace if you search by its name. The art was borrowed from my other game, Between the Devil and the Deep Blue Sea, and ported into this underwater screen-saver environment. Requires Android 2.2 or above.
Organic Spline Particles
Using OpenFrameworks, I coded this wiggly little particle system that renders organic-looking tentacles in real-time. I was heavily inspired from the movement of underwater anemones and decided to try to imitate its behavior.
With 2D Hermite splines, I was able to render the curves in color-shaded line segments. The tangents and positions are warped slightly every frame using sinusoidal waves to give that life-like wiggly behavior.
[ Video | Download (.exe) ]
Fish Group Behavior – AI
Based on the algorithm developed by Craig Reynolds, “Boids” is an artificial life program which endeavors to simulate the flocking behavior of birds. The movement of each entity is governed by three simple rules: separation, alignment and cohesion. The result is this group behavior that appears natural and “emergent”. Coded in C++ using OpenFrameworks.
[ Video | Download (.exe) ]
Conway’s Game of Life 3D
In an effort to bring the classical Conway’s Game of Life in to the 3D realm, I coded this sample 3D application in C++ using Cinder.
Basically, what’s going on is you apply the traditional cellular automata rules in 3D space. That is, instead of checking the surrounding 8 neighbors like you do in 2D space, you check the 26 neighbors in 3D space.
[ Video | Download (.exe) ]
Circuit Board Generator
The circuit boards are procedurally generated by randomly placing nodes and processors on the circuit board and then using A-Star search algorithm to connect the nodes. Using A-star prevents any wires from overlapping and causes the visual to have that flowing aesthetic.
[ Video | Download | Screenshot | Screenshot ]
Fractal Trees
I used fractals to generate randomized trees. Starting from the trunk of the tree, it’s children nodes can be procedurally generated by applying certain conditions during the the formation of budding branches. Coded in Processing.
[ Video | Download (.exe) | Download (.app) ]
Delaunay Triangulation
Delaunary triangulation takes a set of points and builds a triangulation such that satisfies the “empty circle” property. That is, for each triangle, we can circumscribe a circle such that no other points in the set can exist in the circle. The output of the triangulated graph produces the nearest neighbor graph of a given points. It has practical uses in geometry reconstruction and meshing of points.
[ Video | Download (.exe) ]
Lockless Queue
A lockless queue is a thread-safe queue that allows the user to push and pop elements from from different threads without any locking mechanisms. These containers are the most essential means of concurrent computation, since they allow threads to be decoupled somewhat while staying synchronized.
[ Source Code ]
Eddie’s Intergalactic Video Converter
I made a small app that handles exporting videos to SD and HD compression schemes for YouTube or Vimeo. I designed the app to be simple to use and minimalistic in it’s interface. It simply loads the source video file and exports it out with the settings you choose. With ffmpeg at its core, it uses h.264 to compress the video and AAC to compress the audio.
[ Download | Sample Video | More Info ]
BSP
One of my first projects when switching over from 2D to 3D-land was to render one of the BSP levels from Quake III. BSP trees divide a region of space into two subregions at each node; thus, the BSP tree can be traversed in O(log-n) from an arbitrary viewpoint. It uses frustum culling and PVS (potential visible sets) to cull out geometry that is not viewable to the user. It also has ray-tracing and collision detection, which is also an O(log-n) operation.
[ Video ]
Particle System
Implemented in C++ and OpenGL, this simulation features several particle system simulations, including fireworks, smoke effect, debris and water fountain. It uses simple Euler integration to handle the physical updating of each particle. Each simulation is a result of applying different forces to the particles each update.
[ Video | OpenGL Version Checker ]
Statistical Filtering of Global Illumination
During my research at IPAM (Institute of Pure and Applied Mathemetics) at UCLA, my research team published a paper prepared for Pixar in which my team developed algorithms to handle statistical denoising for global illumination.
[ Download Paper ]
2D Level Editor
My first C++ project involved coding my own 2D level editor. It uses SDL for cross-platform portability. The editor manages various visual layers and tilesheets for the visual layout of the scene. It also handles the scene’s meta-data (such as non-walkable areas, teleports, etc) as well as sprite entities (NPCs, interactable objects) and sounds. It imports and exports the level data into a custom format.
[ Download ]
