-
-
GIF
Knight using holy swords attack
-
Camera companion web app to track exercise
-
GIF
Game recording kettle bell swing reps and then casting spell
-
Game running on Fire Stick
-
Camera companion web app to track exercise part 2
-
GIF
player casting dark void
-
GIF
playing casting chain lightning
-
GIF
playing casting toll of the deep
-
GIF
playing casting legendary spell
-
GIF
playing casting money rain
-
GIF
playing being attacked by dragon
Inspiration
A kettlebell workout at home is effective and very boring. You're counting reps alone in your living room while the TV sits there switched off. Games, on the other hand, get people to grind for hours for imaginary loot. We wanted to put the two together: the TV becomes a retro RPG, and the only way to swing your sword is to swing a real kettlebell. We didn't want any wearables, extra hardware or a $300 camera. Just the phone already in your pocket and the Fire TV already on your wall.
What it does
Kettlebell Knight is a 32-bit retro fitness RPG for Fire TV, and your phone is the controller.
Pair in seconds: the TV shows a QR code. Scan it, prop your phone up facing you, and press "Begin Workout." Your phone remembers the room, so next time it reconnects without the QR code. Your phone is a rep counter: on-device pose tracking watches your body and counts real reps across 13 kettlebell exercises: swings, goblet squats, cleans, presses, snatches, thrusters, lunges, deadlifts, windmills, gorilla rows and more. It also scores each rep for power and form, and the phone draws the knight's armour over you as an AR overlay. Reps become attacks: every attack card in your hand is an exercise with a rep count. Finish the reps and your knight performs a fully animated attack on the TV. Harder reps hit harder: an all-out set does up to 1.5× damage.
A full RPG around it: you fight about 50 monsters, each with its own animated moveset, across 10 hand-built maps. Combat has elemental strengths and weaknesses, Block, Stagger and boss fights. Every rep earns gold for the town blacksmith, who sells weapons that each add their own anime-style spells to your deck. Levelling up raises Strength, HP and Speed, and Speed cuts the reps your cards cost. Built for the couch: everything works with the Fire TV remote's D-pad, and the game runs on a 1 GB Fire TV Stick.
How we built it
TV game: React 19 and TypeScript for the menus, plus a custom PixiJS v8 engine for battles. It renders at a true 426×240 and is upscaled pixel-perfect, which keeps the retro look and saves video memory. It runs on the Fire TV as an Android app built with Capacitor.
Animation: Spine skeletal rigs for the monsters and effects. Every monster attack, knight card and weapon spell is a hand-timed sequence with hit-stop, screen shake, camera pushes, impact frames and particle effects.
Phone controller: MediaPipe Pose Landmarker runs in the mobile browser. For each exercise, a custom rep-counting state machine tracks the phases of the lift (e.g. hike → drive → lockout for a swing) and adapts to your body proportions. The phone app is an installable web app hosted on GitHub Pages. Networking: reps travel from phone to TV directly over WebRTC (PeerJS), with STUN/TURN relays as a fallback. Reps are fed straight into the game engine without going through React, so a rep becomes a hit with almost no delay.
Audio: no sound files ship with the game. About 75 sound effects and the workout soundtrack are generated in code at runtime.
Tooling: we built a balance simulator that plays the whole campaign at different fitness levels and effort levels, a headless screenshot tool that drives the TV game and checks for errors, and contact-sheet "films" of every attack so we could check each hit frame by frame. Card numbers aren't typed by hand. They're calculated from how hard each exercise is: reps × seconds per rep × intensity.
Challenges we ran into
No WebRTC in a native Fire TV app. The whole game depends on the phone streaming reps straight to the TV over WebRTC. When we tried building a native Fire TV app, we found its SDK didn't support WebRTC. Without it there's no low-latency phone-to-TV link, and sending every rep through a server would have added lag and cost. So we gave up on native and shipped the game as a web app inside an Android WebView, using Capacitor.
Giving up frame rate to keep the controller. The WebView kept WebRTC working, but we paid for it in performance. The WebView's frame rate is capped differently from device to device, and it's far slower than native rendering. On a budget stick's Mali-G31 graphics chip, battles dropped to about 25 fps with every effect on. We won that performance back by: -rendering at a true 426×240 and upscaling it pixel-perfect, -shrinking monster images for TV, -unloading textures between scenes, -moving expensive effects (translucent layers, CSS filters, blend modes) behind a PERFORMANCE / QUALITY / ULTRA setting, which picks a default from the device model and RAM.
1 GB of RAM. A Fire TV Stick has little memory to share between the system, the WebView and the game. Loading too many textures crashes the WebView's graphics, so every scene and equipment preview loads only what it needs and frees it afterwards.
Making a web app behave like a TV app. Inside the wrapper, Android sends the remote's Back button to the app itself, not the WebView, so we wrote a native bridge for it and for exiting cleanly. Fire TV's 2× screen density also shrank the WebView's page width to 960×540, so we had to set the viewport ourselves. And every screen had to be fully usable with the D-pad, because there's no mouse or touch.
Debugging on the stick itself. Most slowdowns only appeared on real hardware, so we profiled the WebView remotely from a laptop with chrome://inspect to find what was actually slow.
Counting reps reliably from one phone camera. A swing, a clean and a snatch look alike from the front. Getting each tracker to count real reps, ignore half-reps and fidgeting, and cope with different heights and camera angles took a lot of tuning. We built a separate motion lab just for calibration.
Balancing exercise against game difficulty. A squat and a snatch don't cost your body the same, and the game has to stay fair whether you're casual or going all out. We solved it by calculating card numbers from how hard each exercise is, and by running a campaign simulator at different fitness and effort levels.
Connecting a phone to a TV with no server. Making phone-to-TV links work across home routers and mobile data meant relay fallbacks, QR-code pairing, and remembering paired rooms.
Accomplishments that we're proud of
Actually fun game and gives you a sweat every workout
Real exercise is the controller. You never press a button to attack. You lift.
About 50 monsters, 60 attack cards and 60 weapon spells, all fully animated, in roughly two weeks. THAT'S 100 SPELL ANIMATIONS
Big anime-style effects running smoothly on a $30 streaming stick, at a real 240p.
An audio system with no audio files, generated entirely in code.
Balance that comes from exercise science and gets checked with simulations instead of guesswork.
Getting started takes one QR scan. Nothing to buy and nothing to install on the phone.
What we learned
Native vs. web on Fire TV is a real trade-off. We started out wanting a native Fire TV app, but the native SDK didn't support WebRTC, and WebRTC is what links the phone to the TV. So we wrapped our web app in an Android WebView with Capacitor. That kept peer-to-peer networking and let us share one codebase with the phone, but WebView performance on Fire TV is much worse than in a desktop browser. The frame rate is capped differently from device to device, and a budget stick's Mali-G31 graphics chip ran battles at about 25 fps with every effect on. That's why we added the PERFORMANCE / QUALITY / ULTRA graphics settings, which pick a default from the device model and RAM, and render at a true 426×240.
A web app in a TV wrapper still needs native work. Android sends the remote's Back button to the app itself, not the WebView, so we wrote a small native bridge to forward it and to exit cleanly from the title screen. Fire TV also reports 2× screen density, which shrinks the WebView's page width to 960×540, so we had to set the viewport ourselves to get pixel-perfect scaling.
Profile on the real device. Effects that cost nothing on a laptop can halve the frame rate on a Fire TV Stick. We debugged the WebView remotely from Chrome on our laptop (chrome://inspect) to find what was actually slowing the stick down: big translucent layers, CSS filters and blend modes. Then we moved each one behind the graphics setting.
Rep counting needs custom logic for each exercise. Browser pose estimation is now good enough to count reps, but a single "detect movement" model isn't enough. Each exercise needs its own logic. Game feel is what makes a workout fun. Hit-stop, anticipation and sound on contact are what make 20 swings feel like a boss fight instead of a chore.
Build your own tools early. Our own simulation and screenshot tools let us change balance and visuals quickly without breaking things.
What's next for Kettlebell Knight: Exercise RPG Game for FIRE TV
Going to work continue work on kettlebell tracking for better traacking and maybe build our own models for it. Also maybe a pc release of the game or work on kettlebell knight 2 or kettlebell Knight(s)
Built With
- android-studio
- firetv
- javascript
- node.js
- pixijs
- pwa
- react
- spine
- typescript
- vite
- webgl
Log in or sign up for Devpost to join the conversation.