🎹 Neon Tiles - London Bridge

#rhythmgame #game #music

A neon-styled 4-lane rhythm game built around the centuries-old children's playground song — "London Bridge Is Falling Down" — the chart was transcribed directly from sheet music and runs through the full 8-bar verse top to bottom. Cyberpunk visuals with a cyan→magenta gradient palette, ambient drifting tiles on the start and game-over screens, and the Orbitron typeface march the nursery-rhyme bridge straight into the synthwave skyline.

🎮 How to Play

• Tap / Click — Tap tiles on mobile, or click them with the mouse on desktop.
• Keyboard — Use A S D F for the four lanes (left → right).
• Hold notes — For taller tiles, keep the key/finger pressed until the tile clears.
• Burst tiles — Two tiles in the chart fire a quick off-beat 8th-note flourish from a single tap, capturing the song's "Lon-don" pickup figure.
• Pause — Space or P
• Mute / Unmute — M
• Quick start / restart — Press D while any overlay is showing.

✨ Features

🎵 Real Score, Real Pitch

• 8 measures of melody — a single full verse of "London Bridge Is Falling Down" (the score includes 2 verses of lyrics on the same 8 bars; the chart plays the music once).
• The original score writes the melody as 2-note chords on the treble staff; the chart extracts the soprano (top) note of every chord so the tune comes through an octave higher than a literal "first-note" import would give.
• Every note plays at its actual pitch in F major across a comfortable melodic seventh (F4 → D5).
• Tempo is ♩=120 in 4/4 time, with each game beat = one quarter note (500 ms) — a brisk children's-game pulse.

🎶 One Tile per Quarter Beat

• The chart uses quarter-note slot mode — 1 tile = 1 quarter note — so the visual rhythm reads exactly the way you'd count along: "Lon-don bridge is fall-ing down..." mostly one tap per syllable.
• 2 burst tiles at m1 and m5 capture the "Lon-don" ♩.♪ pickup figure: the dotted-quarter "Lon" rounds to a single quarter tile, and the off-beat 8th "don" lands as an extras flourish riding along on the next tile.
• Half-note phrase endings ("down", "fair lady") land on 2-beat hold tiles, marking the natural sentence breaks.
• The song ends on a clean F4 half + quarter rest at m8 — a single breath of silence before the cycle restarts.

🚀 Progressive Difficulty + Cycle Flash

• BPM increases by +12.5% per cycle (120 → 135 → 152 → 171...). Cycle 3 already pushes into "lively march" territory.
• Each cycle is also transposed up by a whole step (2 semitones), sending the nursery rhyme into ever-higher keys.
• Cycle transition flash: every new cycle pops up a centered CYCLE 2 / ♪ +2 · ⚡ +12% banner with a scale-and-glow animation.

🎨 Neon Polish

• Cyan → blue → purple → magenta per-lane gradient, glowing tube borders, scanline textures inside the active press zone, ambient drifting tiles behind every overlay, and an animated START button that slides down into the game.
• Visible miss feedback: red flash + dissonant low buzz with downward portamento on any miss.
• Forgiving holds (75% duration counts, soft gradient fade at the top edge) and smart lane distribution that avoids consecutive same-lane spawns.

🎼 Scoring

• 10 points per beat cleared (so a 2-beat hold = 20), with bursts counted as a single tile.
• High score saved locally.

🛠️ Tech Stack

• Pure HTML / CSS / JavaScript, zero dependencies, single self-contained .html file — drop it anywhere and play.
• HTML5 Canvas + Web Audio API square-wave synthesis (with separate envelopes for the rapid burst sequences).
• Chart auto-generated from MusicXML via a custom Python converter, with a --chord-pick top option that grabs the soprano line and a quarter-note slot mode that flattens the "Lon-don" ♩.♪ figure into a clean quarter-tile + off-beat 8th burst.

💡 Things to Try

• This is the shortest chart in the batch (8 measures, 25 tiles, 16 seconds) — perfect for warm-up runs or for chasing a high score across many cycles.
• The two burst tiles (m1 and m5) are the song's only sub-quarter ornaments — both fire on the "Lon-don" pickup pattern. Feel them as the song's rhythmic signature rather than as a separate mechanic.
• Because 1 tile = 1 quarter beat, the visual rhythm matches one tap per syllable for most of the song. Sing along under your breath and your fingers will follow.
• With only 16 seconds per cycle, you'll churn through cycles fast — by cycle 4 you're at ♩=171 and a minor third higher than where you started.