Code for all projects here
Sun Shadows
I used perlin noise to scatter the leaves and shadows, then used a combination of blending modes in order to achieve a light/shadow effect. The leaves were shifted by shearing each leaf over time.
Procedural Sunset 
Exploring how perlin noise can be used for animation -- this was inspired by a p5.js example that demonstrated how bezier curves control points could be combined with perlin noise. I used this approach to create clouds. The "wispy" effect was created by changing the width of the curve along with gradients and blending modes. Artistically, I wanted to take a graphic approach, with my main inspiration being the works of Charles Hilton.
Procedurally generated landscape
Procedurally generated landscape


Forest
 Given a handsfree.js template, I mapped vertices corresponding to different body parts to the different parts of a fractal tree, then duplicated the tree to create a forest to create more visual complexity. The randomly generated sun rays / ground height also change depending on how close the user is to the camera, and the player can move their arms to simulate wind blowing through a forest. One-point perspective shadows are simulated with lerping.
Starry Space
A collaborative drawing program where visitors draw constellations in an imagined space, made with Javascript and socket.io.
Try here

You may also like

Back to Top