When the screen and soundtrack disagree
A rhythm game asks a player to connect what they hear with what they see. Notes appear on screen, music plays and the player responds at the right moment. For children learning music, the timing matters especially because the game is helping them practice a skill, not just score points.
Hoffman Academy teaches piano online and uses educational games alongside its lessons. In spring 2022, one of those games, Rhythm Shredder, had an audio synchronization problem: the moving notes and soundtrack could drift apart, particularly on slower devices or after restarting a level. A correct response could be judged against the wrong moment in the music.
Hoffman Academy brought SLIDEFACTORY in to investigate the timing and support its game team with development and testing. Rather than replacing the game, we measured where its clocks diverged and worked through the animation, audio and round-reset behavior that contributed to the problem.
Measuring the drift before fixing it
We started by checking the behavior rather than changing the timing by guesswork. Browser profiling showed the audio clock and animation ticker diverging, especially when device performance dropped. We displayed timestamps for both systems together and built a visual metronome to see whether tempo variations matched what testers were hearing and seeing.
Several problems were contributing. Notes were judged against audio time, while animations followed a separate browser frame ticker. Previous rounds could leave event listeners and duplicate tracking objects active after a restart. Background effects also ran on every animation tick, and loading images and fonts could produce additional pauses as a level began.
Bringing the game back to one clock
We reorganized note movement, scoring and animation around a single song clock. Round setup was changed to close old listeners and avoid duplicate objects, and background animations no longer needed to update on every frame. We adjusted the judgment window for each beat and fixed the behavior that allowed that window to move during a song.
The changes were tested on lower-end phones and throttled desktop browsers. We shared simplified builds on a test server for Hoffman Academy’s team and recorded gameplay footage to compare results. After the core timing held, we restored the fuller animation set and fixed restart behavior, end-of-round glitches, score and heart effects, and the visual feedback shown when a note was missed.
Keeping the game on the beat
Rhythm Shredder’s challenge wasn’t simply to make an animation look smoother. In a game that teaches timing, notes and music had to agree even when a device was slow or a level restarted. By measuring the two clocks and bringing movement, scoring and audio back to a common time source, we addressed the causes of the drift and verified the behavior on everyday devices.
We worked alongside Hoffman Academy’s game team from April to June 2022, contributing about 120 hours of investigation, development and testing. The game was subsequently released to Premium members in October 2022. Our work helped bring its timing back into alignment, so the visual cues and the music could support the same lesson.
