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 discus 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
Much of my work over recent years has been either in R&D for tech companies, or is unreleased due to NDAs. So I have created this WebGL2 procedural rendering engine to showcase many of the concepts I have been working on.

The most important feature of 3D web engines these days is memory management. With the current push to the metaverse and autonomous driving it is nolonger possible to simply embed your geometry at compile-time and render it all-at-once through an off-the-shelf library – there is just too much data. (Ever opened a Rosbag or Lidar file?)

The modern renderer needs to work much more like a server-client app, continuously streaming data from server to CPU, then from CPU to GPU, meticulously buffering at every step to keep a smooth 60fps frame rate.

For the purposes of the demo, (and since I don’t want to pay thousands of dollars in data costs to my ISP), the city engine here uses a procedural provider to simulate the network. This actually adds an additional overhead as the app now needs to procedurally generate contiguous chunks of the city in real time, connected to what already exists.

At a later date I will write up the rendering engine in detail, covering the key parts:
  • Buffering and memory management.
  • Pseudo-random procedural generation.
  • Shaders, false shadows, and lighting.
Until then sit back and enjoy the tour.