Buffer Size:


Use the Mouse, Touch or
Arrow Keys to move around

About Me
I'm a specialist in 3D programming with an emphasis on writing rendering engines and performant web applications in Javascript from the ground up.

I have over 15 years experience in sectors ranging from Autonomous Driving to Visual FX and am comfortable working at either end of the scale - from low-level, memory managed compute shaders, to WebGL furry monsters for ad campaigns.

I have a strong grasp of 3D mathematics and computational geometry and enjoy the challenges of solving complex rendering problems through tightly written code without reliance upon generic 3rd party libraries.
That being said, sometimes the best way to solve a problem is just to import ThreeJS and start throwing furry monkeys at it. It depends on the problem.

If you have a problem that you would like to discuss please get in touch.
Although originally from London, I’m currently based in Thailand and work remotely from my home office in Bangkok. Most of my clients are UK/US companies and I'm happy to work to those time zones… the city looks great at 3am.

Between projects I like to escape from it all and do something different. I can normally be found either on an island looking for wildlife, or hanging out with the Bangkok indie-film community.
Autonomous Driving
Five AI
Woven Planet
VFX & Studio
Moving Picture Company
Stink Studios
Digital & Advertising
Dare Digital
DLKW (Mullen Lowe)
Elsewhen (Hive)
Rewind (Magnopus)
Film & TV
About The City
This 3D procedural city uses a hand-coded WebGL1 and WebGL2 rendering engine, written in vanilla javascript without the use of frameworks.

Geometry is generated at run-time, using a seeded random number, as and when required by the viewport. Multiple buffering and memory management allow for a potentially unlimited world size by carefully caching, and unloading unseen buildings as they disappear from the horizon.

A single, densely-packed vertex buffer contains all geometry across all tiles, and is drawn in a single shader pass.

Lighting is done using a modular point-lighting system, to give the illusion of thousands of light sources, whilst in reality only requiring two lighting points in the shader code.

The road system is created in stages on a tile-by-tile basis. Each new tile first checks its neighbours to determine missing gaps in the network topology, then fills them in with random values. Once a tile is surrounded by completed neighbours a pseudo-random road is drawn, and buildings are created in the empty spaces.

Bots are programmed to follow road topology, slowing down, then changing direction randomly at junctions.

Sky textures and the moon are generated randomly when the app starts, using a mix of HTML5 Canvas (for line drawing), and image-processing shaders (for blurring and smearing).

This engine was written entirely for fun, and is all my own code.

Get in touch if you have a cool project for me to work on...
Until then, sit back and enjoy the tour! :)