by Marco

Rotatron

Spin the ring. Match the hex. Don't let the heat die.

LIVEGame

WEB

Play Rotatron Watch Gameplay

What this project demonstrates

Single-input arcade design where tap-to-rotate is the entire control scheme
Phantom slot buffer that makes boundary vertices playable and generative
Cascade scoring with freshness multiplier and n-squared heat refills
Color elimination with banner, pitched sting, and spin-based suppression
Four phase themes with synchronized palette, music, shader, and HUD chrome
Selective bloom Three.js pipeline with shader nebula and forward starfield

Rotatron is proof that one clean input can carry an arcade puzzle if the rules around it reward pattern recognition and tempo.

Rotatron is built on one tight input. Tap a vertex, six triangles rotate 60 degrees clockwise, and colors carry around the ring. That single rule creates a surprising amount of depth. The board is a hex-shaped grid of 54 triangles. Every vertex is a pivot. Line up six matching colors on a shared vertex and the hex shatters, triggers particles, and refills from above. Cascades compound, and the payout scales quadratically with simultaneous clears.

Edge vertices are where the game opens up. Boundary rings extend outside the playable hex, and those missing slots carry hidden phantom colors that persist across spins. When you spin a boundary vertex, phantom colors visibly drift in from outside the board as ghost triangles fade up. This is what lets edge play feel generative rather than limited, and it is the engine behind long streaks.

Heat is the run timer. It starts at full, drains continuously while you think, and only rises when you clear. Each cascade wave refills heat by n squared, so stacked clears are the reward curve. A color-elimination system fires when you wipe every instance of a color from the board: a full-screen banner, a pitched sting, bloom and camera shake, and a four-spin suppression on that color so the board recovers before it comes back.

Four phase themes carry the run from arcade through reactor, void, and solar, each with its own palette, music track, nebula treatment, inner triangle detail, and HUD chrome. Phase advance is automatic at 11, 26, and 51 total clears. Existing triangles keep their colors but restyle their inner circuit layer, so the board you built carries across the transition, and the newly introduced color arrives organically through future refills and edge inflow.

Rendering is a selective-bloom Three.js pipeline using the two-composer pattern. Triangle outlines, vertex markers, and particles live on the bloom layer. Fills and backdrop do not. A custom shader starfield with 5500 stars scrolls forward with diffraction spikes on the largest points, and five additive FBM nebula planes drift through a z-cycle to hide the seam. SFX are WebAudio AudioBuffers for overlapping one-shots, and background music is a single looped HTMLAudioElement whose source swaps per phase theme. Installs as a fullscreen PWA with a cache-first service worker and iOS chromeless launch.