Comic Cutscenes and a Localhost Editor
Roadie Wars 5 tells its story in comic panels between stages — authored in a homemade web editor that runs on localhost and deploys to the Simulator with one button.
A climber doesn't need a story. But a tour has a story — that's the whole texture of the thing. So between stages, Roadie Wars 5 plays comic-panel cutscenes: your roadie in the venue, a line of dialogue, load-in complete, time for lunch.
The data model is forgiving on purpose. Scenes live in cutscenes.json and match on stage number and kind (intro or outro). A scene with a null stage is the catch-all, so you only author the specific moments you care about. If the JSON is missing or broken mid-edit, hardcoded fallback scenes run instead — the game never breaks because a scene was half-saved.
Placeholders make scenes reusable. {hero} resolves to whichever roadie the player picked; {vip} resolves to the current stage's objective art. One authored scene works for every member of the crew, in every venue.
The renderer is a node, not a scene. The cutscene player drops in front of the title screen or live gameplay without disturbing either — which is how the same system plays over the menu and mid-tour. Actors are positioned in fractional coordinates and clipped to their panel, so a big sprite can't spill out of the frame.
The part I use every day, though, is the editor. It's a little Python web server in the repo — three panes: scene list, a live iPhone-proportioned preview, and a panel inspector. You drag the actors around the preview. It reads the real sprites from the game's art folder, saves straight back to cutscenes.json, and has a Build → Simulator button that rebuilds the app and relaunches it so you can see the scene in place. It is the least glamorous tool in the project and the one I'd rebuild first if I lost everything.
Cutscene art itself comes out of the same generation pipeline as the character sprites (part 2), with big _big comic variants of the cast, plus generated cutscene work credited in-game to MiniMax's Hailuo AI. The credits screen got long this week. That felt like a milestone of its own.
There's a lesson in this part of the build, and it's not about games: the tooling you make for yourself — the boring localhost editor with the one-button deploy — is where the quality actually comes from. The cutscenes are charming because iterating on them costs nothing.
This is part 4 of a five-part series on building Roadie Wars 5 : Stage Climb:
- Why our first iPhone game starts at 5
- An AI art department in a Python folder
- The whole tour is a JSON file
- Comic cutscenes and a localhost editor
- Shipping an iPhone game with a robot on the mixing desk
Roadie Wars 5 : Stage Climb is heading to the App Store — climb the rig, save the tour.