# One simulated ride, the whole cycling cockpit

> How the KICKR CORE 2 Hub simulator drives virtual shifting, a 3D world, ride stats, and game progression without trainer hardware.

Canonical page: [One simulated ride, the whole cycling cockpit](<https://devanmetz.com/blog/kickr-core-hub-simulator/>)

Published: 2026-09-22

Updated: 2026-10-14

Tags: Cycling, React, Simulation

Project: [KICKR CORE 2 Hub](<https://devanmetz.com/portfolio/kickr-core-hub/>)

## In short

I made a browser simulator that drives the whole cycling cockpit without trainer hardware. Its synthetic ride data feeds the landscape, ride stats, and game progression, so anyone can try the live demo. A real trainer uses a separate local bridge.

![A cyclist in a colorful 3D landscape surrounded by power, cadence, virtual gearing, and ride timeline panels.](<https://devanmetz.com/_astro/kickr-core-hub.D8EbYecQ_ZOmNAa.webp>)

The browser simulator running an endurance ride. All telemetry shown here is synthetic.

The [KICKR CORE 2 Hub](<https://devanmetz.com/portfolio/kickr-core-hub/>) has two ways to get ride data: a local bridge (software that connects the app to the trainer) for a physical smart trainer—an indoor cycling device that reports ride data and adjusts resistance—and a browser simulator.

I made the simulator available in the public demo so someone can explore the cockpit without owning the hardware.

The simulator is useful because one changing ride signal passes through the whole interface. Start **Sim**, choose a pattern such as Recovery, Intervals, or Climb, and the same synthetic (simulated rather than measured) data updates the numbers, the moving world, the skill system, and the ride review.

## Shifting changes the ride 

The cockpit shows power, cadence (pedaling rate), speed, distance, and accumulated work (energy spent pedaling) around a Three.js landscape. Three.js is the library that draws the 3D world in the browser. Pedaling animation follows cadence. The scene responds to the ride, while a short power average and a scrolling timeline make changes in effort visible.

Virtual gears are designed around a single-cog trainer setup, with one physical sprocket. The interface includes sequential, 2×12 (two front gears and twelve rear gears), and 1×12 (one front gear and twelve rear gears) presets; in the demo, **W/S** shifts gears from the keyboard.

Camera and lighting controls let me see the same ride from a different angle without changing the data underneath it.

## The ride continues after the scene 

The garage turns simulated effort into Strength, Endurance, Agility, and Climbing experience, with earned Drops, the game’s currency, for equipment.

The Stats panel keeps a ride history and shows time in power zones (ranges of effort) and a power-duration view (power sustained over different lengths of time) when there is enough data. This progression is game state, not a claim about real-world fitness.

Everything in the public simulator is synthetic. The [live demo](<https://kickr-core-hub.pages.dev/>) runs in a browser; controlling a Wahoo trainer requires the separate bridge on the trainer’s local network. The [project page](<https://devanmetz.com/portfolio/kickr-core-hub/#virtual-shifting-and-trainer-controls>) has the control modes, architecture, and current limitations.

## Related reading

- [The first sound from my printed violin](<https://devanmetz.com/blog/printed-violin-first-sound/index.md>)
- [A strategy game about the space between](<https://devanmetz.com/blog/goop-troops-supply-lines/index.md>)
- [One bike, three kinds of making](<https://devanmetz.com/blog/ebike-from-cad-to-dashboard/index.md>)