BrowserBoogie

Inspiration

We wanted to make dance practice feel less intimidating and more measurable, like a rhythm game you can build yourself. The goal was to let anyone learn from their own videos, not just preset tracks.

What it does

BrowserBoogie lets users record routines, create routines from uploaded videos, or load/share packaged sessions. It plays music, tracks pose in real time, compares movement against a reference routine, scores performance with difficulty-based leniency, and saves session/stats data locally with a leaderboard.

How we built it

We built a React frontend for studio workflows, dashboard, library, and sharing UX. We used MediaPipe Pose Landmarker in-browser for pose extraction/scoring, and a Python backend for local storage APIs, package loading, preset browsing (selection/), share codes, and stats/leaderboard aggregation. We also used Supabase for authentication.

Challenges we ran into

Real-time pose pipelines were sensitive to timestamp ordering and sync drift between audio/video/camera streams. We also had to normalize pose scoring across different body sizes/positions and handle optional assets in zip packages for downloaded recordings.

Accomplishments that we're proud of

We shipped a full end-to-end routine platform with record -> export package -> load/share -> play/compare -> stats. We also added multiple practice modes (overlay, side-by-side, skeleton-only), difficulty-aware scoring, friend-code sharing, and a local multi-user data model.

What we learned

We learned that pose scoring quality depends as much on normalization/timing windows as model output. We also learned to design APIs and UI states together early, because features like sharing, import validation.

What's next for BrowserBoogie

We want smoother onboarding with curated preset libraries and mobile-first performance tuning, and to implement Supabase's storage CDN for file handling over local files.

Built With

• mediapipe
• python
• react