Runner Pace Match

Running Pace Match is an interactive p5.js app that helps you see how your running pace lines up with the tempo of a song. The idea is pretty simple, when your steps match the beat of the music, running feels smoother and more consistent. You start by entering your target pace, and the app converts that into an estimated cadence (steps per minute). It then compares that cadence to the BPM of the current song. Instead of just showing numbers, the app visualizes both rhythms using moving wave lines so you can actually see how close they are to matching. There’s also a step timing visual at the bottom with alternating footprints, which represents how your steps would land at that cadence. This makes it easier to understand the rhythm in a more physical way, not just as data. If the song doesn’t match your pace, you can use the tempo slider to speed it up or slow it down. As you adjust it, the BPM updates in real time, and the app tells you whether it’s a good match, close, or not a match. There’s also a reset button to bring the song back to its original tempo. Visually, I went for a dark, clean style inspired by fitness and running apps, with bright colors to highlight important information like matches and timing. Overall, the project is about making something that’s usually kind of abstract (like cadence and BPM) feel more intuitive and interactive. It’s a mix of music, movement, and visualization that helps you better understand your pace.