Building my mini app: A Beautiful Running Pace Calculator

I'm building my first iOS app, and this series is my journal of the process.

The idea

Every runner does the same mental math before a race. If I hold 5:30 per kilometer, what's my marathon time? What pace do I need for a sub-45 10K? There are apps for this. The one I use, Pace: Running Pace Calculator, does the job: pace to speed conversion, finish time projections from 400 meters up to 100 miles, goal time calculations. It's a solid utility.

But it looks like a utility. And I think a tool runners open in the nervous, excited days before a race deserves to feel special.

So the plan is simple: build the same core functionality, but make it genuinely beautiful.

The design bet: Liquid Glass

You all know the discourse. Liquid Glass landed with iOS 26, half the community called it Aero nostalgia, the other half called it the most interesting material Apple has shipped since the original frosted blurs. A year in, most third-party apps still treat it as a coat of paint: default tab bars, maybe a glass button, done. Very few apps are designed for the material. That's the gap I want to play in.

Because the material has real properties worth designing around. Glass lenses what's behind it instead of just blurring it, so it's only as good as its backdrop. Put it over a flat gray and you get nothing; put it over deep, saturated color and the refraction starts doing actual work. So the foundation of Tempo is the backdrop itself: a dark mesh gradient in blues and violets that gives every glass surface above it something to bend.

The plan follows the rules Apple states but most implementations ignore. Glass is for the functional layer, not the content layer: the pace readout, the unit toggle, the conversion chips sit on glass, while the material never becomes wallpaper. Hierarchy comes from elevation and the backdrop, not from borders and fills. And restraint is the whole game: a small number of distinct glass surfaces, grouped so they can merge and morph as one fluid layer when the layout changes, rather than a dozen competing frosted rectangles fighting for specularity.

The other bet is typography. Glass rewards big, confident type: a huge rounded numeric pace readout with animated digit transitions, monospaced figures so nothing jitters while you scrub the slider. The reference app presents numbers like a spreadsheet. I want them presented like a scoreboard. Race-day energy, not spreadsheet energy.

And yes, legibility is the known failure mode of this material. Small secondary text on glass over a busy gradient is exactly where it falls apart, so the projection table will lean on strong contrast, generous spacing, and the regular glass variant rather than the clear one. If I have to choose between a prettier surface and a readable split time, the split time wins. That tension is half the reason this devlog exists.

The scope

Version 1 stays deliberately small:

• Pace to speed conversion, both directions, metric and imperial

• Projected finish times across standard race distances, from track intervals to ultras

• One screen, instant feedback, no accounts, no backend

Ideas already queued for later: a cadence metronome with precisely scheduled audio clicks and haptic pulses, race splits with pacing strategies, and an Apple Watch app where wrist-tap cadence could be the killer feature.

The process

I'm building this with AI assistance: Claude Code writes the Swift, I steer the product and design decisions, and we iterate together on the running app in the simulator. The project skeleton, the pace math, and the first Liquid Glass screen were written before Xcode even finished downloading.

That's the plan. Next entry: first build, first screenshots, and finding out how the glass actually looks.