Headshot of Rupert

Rupert McKay

Twitter LinkedIn Blog Github

Side projects#

🐦 Boids #

An implementation of an artificial life program, first developed in the 1980s. In brief, just three simple rules lead to intelligent flocking behaviour. Implemented all my own tooling from the groundup, including vector algebra and dynamic frame loop adjustments.

🐤 Boid Flock #

A re-implementation of Boids, but mounted inside a React component, ready to be imported into your own React app.

🚄 Train Ride #

A tribute to the vaporwave aesthetic. Take a sunset trip through the infinite metropolis. Rendered with three.js

🌳 Lindenmayer #

A Lindenmayer fractal generator. Creates a random branch structure and recursively reapplies it to itself. Written solely in Vanilla JS and HTML5 Canvas. Dynamically computes ideal depth generation based on browser performance.

4️⃣ Beads #

A little Connect4 implementation. Can you beat the AI? Uses minimax over a limited depth, falling back to a heuristic value heatmap when that depth is exceeded.

🐝 Voronoi #

A little experiment with voronoi cells. A cloud of points travel randomly across the world space, while every frame the space is divided by Voronoi cells. The heavy lifting is done by d3-delaunay

🔷 Anima Tile #

Animates a rotating tiling system. I got the idea for this while looking at a brick wall and observing that the conventional brick laying pattern is great at preventing slipping vertically but not horizontally. So I started wondering about tiling patterns which don't allow slippage in any direction, and I made this to help me visualize it.

☕ Convection #

A one-day hack to build a physics simulation, which aims to demonstrate that temperature mixing is an emergent property of thermal expansion. Got the idea for this while watching a pot of water boil.

🎲 WebGLTest #

A little test of three.js, which itself uses WebGL. Renders a rotating cube and some point lights in real time. A great example of how JavaScript can be used to leverage graphics hardware.

💡 Phong #

Hand made raytracer using only Typescript. A fun experiment in the mathematics of perspective geometry. Performance is very much bottlenecked by the browser. But becomes fully memoized after 100 frames.

🪑 GoT Tables? #

A minimal frontend to the brilliant An API of Ice and Fire. Featuring pagination, filtering and a little memoization.

🥣 Ceramic #

A reusable React component and hook library. Complete with test coverage, extensive documentation and publically available Storybook. Living documentation is generated dynamically by JSDocs coming directly from the source code itself. Primarily an exercise in perfecting project processes, rather than creating a lot of content.