This Site — TFT Instrument Cluster

I wanted the portfolio itself to be the work sample rather than a container for it. The brief I set: a BMW-style digital TFT instrument cluster that reacts to scroll, rendered live, that still loads fast and degrades cleanly on hardware that cannot run it.

Worth being straight about how it was built, because it is the more interesting claim anyway. JavaScript and Three.js are not my daily stack — Unity, C# and .NET are. I designed this, specified it, and drove an AI through the implementation, then spent most of my time on the part that actually needed judgement: making it fast. Knowing that bloom is fill-rate bound, that a canvas-to-GPU texture upload does not need to run at 60 Hz, and that a full-screen post-processing pass should stop existing the moment it scrolls out of view — that transfers directly from shipping Unity clients onto casino hardware.

The cluster is a 2D canvas painted every frame — segmented LED tach, digital speed readout, gear indicator, shift light — uploaded as a texture onto a 3D screen plane inside an extruded bezel, then run through an UnrealBloom chain so it reads as backlit rather than printed. Device pixel ratio is capped at 1.5, the first 90 frames are sampled to detect a slow device and drop render scale once, the hero unmounts from the render loop via IntersectionObserver, and the TFT texture re-uploads at 30fps while the scene runs full-rate. There is a WebGL-absent fallback, a reduced-motion path and a background-tab pause.

The content layer is deliberately boring by contrast: every word comes from a single data file, prerendered to static HTML at deploy time so crawlers and social scrapers see real content, then progressively enhanced in the browser. The 3D bundle is 1.3 MB and loads after first paint, so it never sits between a visitor and the text.