A playful twist on a traditional running pace calculator, reimagined with pixel-art visuals and dynamic animation. Built during the Figma Makeathon (Figma × Contra), this project helps runners instantly visualize their speed, from 5K to Marathon, while a pixelated runner (or even a surprise motorcycle 🏍️) moves according to the selected pace.

I started by researching how existing tools like Strava display pace data, then simplified the experience into a single-screen layout built in Figma Make. The UI combines retro pixel aesthetics with responsive design logic, dual unit support (km/mi), and custom animation (create it by using Flora) triggered by pace thresholds, from “very slow” walks to “sprint” and even an “easter egg” motorcycle for paces under 2:00/km.

Try it by yourself at here 👇