Motion, Made with Code

Over two years I made hundreds of these small animations — a number ticking up to a million, a bar chart filling as you watch, a loading spinner, text that flies in and settles. Then I couldn’t find them. They’d scattered across folders, named things I no longer remembered.

More than once I sat down, built one from scratch, and realized weeks later I’d already made the same thing months before. That’s a specific, stupid, sinking feeling — hours spent on work I didn’t need to do, because my own past work was lost to me.

So I did what a library does with books it can’t afford to lose: I made an index. Ten short films, each collecting the animations that give you the same feeling — the ones that arrive, the ones that count and pulse, the ones that look like a screen full of live data. Sorted by feeling instead of by date, I could finally picture where something lived before I went looking for it.

Filling ten films properly needed far more animations than I had, and there was no clever way around it. I made two whole versions that didn’t work before the third one did — that story is its own post: I built this three times before it worked.

One thing you’ll notice watching them: they’re calm. One shade of blue does all the pointing, everything else stays quiet, and nothing moves without a reason. When the frame holds still, the single thing that’s animating is the only thing you look at. The same calm, slowed right down, became its quiet twin: The Spiritual Series.

This is ten short films, and each one rebuilds an old computer exactly as it looked on screen — the Commodore 64, MS-DOS, Windows 95, the first iPhone, and six more in between. Here’s the part that matters: none of it is a screenshot or an old recording. Every pixel was drawn again from scratch, to match what these machines really looked like when they were new.

I did it that way because of something I only half-believed until I checked it against myself: I don’t remember these machines as well as I think, and neither do you. I remember the idea of Windows 95 — the teal background, the Start button. I’d forgotten the little grey banner down the side of the Start menu, the exact way the buttons sat raised off the screen, the red counter in Minesweeper. Build it from memory and you get something that feels almost right and is wrong in a dozen tiny ways. Almost-right is worse than obviously fake, because anyone who was there feels something’s off without being able to say what.

So I chased the small stuff most people never noticed but would miss without knowing it. The Commodore 64 boots up saying it has exactly 38,911 bytes free, then sits loading from tape for an uncomfortably long time — because it truly did, and speeding it up to be “watchable” would give the whole game away. The 1997 web page has a visitor counter that ticks up as you watch, a spinning UNDER CONSTRUCTION sign, a little MIDI tune. Get enough of these right and the memory snaps back into focus. There’s a specific relief in that snap of recognition — oh, that’s exactly what it looked like — and it only shows up when I didn’t fake it.

The films are also strung together on purpose. Each one opens like a title card and ends on a blinking light that hands straight off to the next machine, so twenty-five years of computers play as one continuous run rather than ten separate clips. The care that went into looking things up instead of trusting memory is the subject of I rebuilt old computers and learned my memory was lying, and the wider collection of screen looks this pulls from is a field guide to app animations.

I took ten apps you probably use — Excel, Gmail, Slack, Stripe, Trello, and a few more — and rebuilt each one from scratch. Then I set a fake mouse pointer loose inside them: it moves, clicks, types, drags things around, and the app responds exactly like the real thing. Watch any of them and it looks like an ordinary screen recording. It isn’t. Nothing real is running. Every button and every reaction was hand-made.

The rule I set myself sounds like a joke: no shortcuts, no reusing pieces between apps — every row, tab, and button placed by hand, one at a time. That tedium is the entire secret. Build an app the fast, efficient way and everything comes out evenly spaced and a little generic, and a viewer clocks it as fake without quite knowing why. Real apps are messy, full of odd little choices real teams made over years, and the only way to copy that mess is to copy each choice by hand.

What sells it is the stuff nobody looks at directly. Drag across some cells in the Excel one and the little sum quietly updates at the bottom, exactly where it should be. In Slack, a reaction on a message ticks from one to two, as if a coworker just added theirs. In Gmail, replying collapses the thread and the “message sent” note slides in dark at the corner. None of those is the point of the shot — they’re the details a viewer checks without knowing it, to decide whether what they’re seeing is real. Miss them and the whole thing feels slightly off.

The mouse is the trick that ties it together. It doesn’t teleport — it eases toward a button and slows down just before it lands, the way a real hand does, then gives a tiny press when it clicks. Why the tedious path was the right one — and why one click should ripple out and change several things at once — is I did it the hard way on purpose.

This is the same kind of work as the Effects Index — small animations made with code — but pointed somewhere completely different, and slowed almost to stillness. Instead of counters and charts, it draws old contemplative patterns: a mandala opening from its center, a knot that never ends, a circle painted in one unbroken stroke. Ten short films, one pattern each, from traditions around the world.

I built it on purpose with the exact same setup as the fast, busy Index — same tools, aimed the opposite way. It’s easy to make a method that only fits one kind of subject, so I wanted to see mine tested against its opposite.

The one real change is time. Where the Index moves fast, here everything breathes. Each pattern plays once at its own pace, then plays again slower — because that’s how something like this actually goes in. Nobody takes in a mandala faster by being shown it faster. You sit with it, and the second pass is where it lands. Even at that pace every line is still being drawn, still drifting. Quiet, not empty.

I held to a few rules the whole way, because this material deserves care. Everything is drawn as shape, line, and light only — no depictions of any god or figure, in any tradition. Each one gets the exact same treatment and the same amount of room, so none is placed above another. And several of them end by letting go — the sand pattern scatters in the wind, the seal dissolves back to blank paper. That turned out to be the most honest way to close something about the sacred: not with a flourish, but with release.

Why running one way of working at two completely different speeds taught me something is the whole of I only trusted my method once it survived the opposite.