Welcome!
Here's
some of what I create
Bumpy Metaballs 2026
A rebuild of the 2013 original on WebGL2: the isosurface is polygonised on the GPU, normal-mapped without UVs and lit by an environment map, from wet flesh to glass refracting an inner core.
Three.js Conf
A physics toy for THREE.JS CONF 2026: lushly shaded procedurally generated text based on SDFs, thrown around by Ammo.js physics and sound effects produced with Web Audio API.
Flat Earth
A world map on an oblique cylindrical projection: centre it anywhere on Earth and that is the point the map gets right. Shaded relief and soft shadows over satellite imagery.
Inktober 2025
Thirty-one ink sketches of strange attractors and flow fields, drawn as shaded, self-shadowed MeshLine strokes.
Codevember 2022
A month of shaders and post-processing for Codevember 2022, built with WebGL and three.js.
Halloween 2022
Double Halloween feature to give some ambience to this spooky season: Pumpkin Sphere, a mass of pumpkins hovering around you; and Spooky Cloud, a particle-driven cloud of pumpkins and skulls chasing a wisp.
Floating Shiny Knot
A remake of the 2012 experiment in image-based lighting from Google Street View panoramas, now fetched with PanomNom.js, with better shading and normal mapping that perturbs the surface and its reflections and refractions.
Genuary 2022
Thirty-one days of procedural generation for Genuary 2022, with three.js and WebGL.
Codevember 2021
One experiment a day for Codevember 2021: simulations, post-processing and more with WebGL and three.js.
Web Unleashed 2021 Opening Titles
Opening titles for FITC Web Unleashed 2021: strange attractors grown into tube geometries, rendered in near real-time WebGL and captured to video.
Inktober 2021 Strange Attractor Sketches
Thirty strange attractors for Inktober 2021, drawn with the NPR hatching techniques from the 2020 sketches.
Generative art: Lines on flow fields
MeshLine strokes tracing the field lines between electrical charges. Interactive, but made for the still images it produces.
F*MMXX
An angsty new year demo to send off 2020, the year of Covid: a maneki-neko trying to beckon better fortune, lots of light effects and a lot of messages.
Inktober 2020 Sketch experiments
Thirty-five sketches for Inktober 2020, all NPR post-processing: hatching, cross-hatching, lines and other ink techniques. No prompts, just experimentation.
Obsolidian
Demo for Solskogen 2020, ranked 3rd: a shape evolves through the platonic solids, from tetrahedron to sphere, down a tunnel of lights. The mesh is generated by raymarching blended SDFs. Music by gloom.
FaceMeshFaceGeometry
A three.js geometry that follows the face tracked by FaceMesh, with UVs to texture it from the video feed and anchor points to attach 3D objects to the face.
and here's some of what I write about
Optimising SVG load with Service Worker
How to use Service Worker to optimise the loading of SVG assets in a page without altering coding methods.
Calculating FPS past requestAnimationFrame limit with requestIdleCallback
Using requestIdleCallback to calculate FPS more precisely than with requestAnimationFrame.
Can the new Google logo be 305 bytes?
Techniques and tricks learned while trying to recreate the new Google logo with SVG in 305 bytes (or less!).
cru·ci·form study in architecture visualisation
How the project was built from scratch, with technical details like parallax-corrected cubemaps, and lessons learned along the way.
Creating a Spherical Environment Mapping shader
Creating nice lighting with a simple spherical mapping shader. A step-by-step tutorial on how to create a matcap or litsphere material with GLSL and three.js.
