Project Overview
I made this procedurally generated, pixel-art-y 3D version of Fireboy using WebGL and Typescript. Watergirl is a work in progress. You can interact with Fireboy here.Â
My Contribution
I created a vertex shader that applied a low-frequency, high-amplitude displacement to the sphere to make it less sphere-like. I used a triangle wave mapped to the top part of his head to create the Fireboy-like spikes. I then used 3d Perlin Noise to get the top of his head to twist.Â
My favourite part of this project was working on the 3D noise deformation on Fireboy's texture. I worked to create a furry effect on Fireboy to mimic the stuffed-toy version I used to have in 2010.Â
The other cool part of this project was procedural outline that I created by implementing the cel-shaded outline effect. This was done by re-calculating the normals. If you rotate Fireboy around, the shadow continues to create the outline around him, no matter which angle you look at him from!