GameStrategistsGAMESTRATEGISTS

First-party · Rhythm

RAIN BEATS

听雨

RAIN BEATS is a four-lane rhythm game whose music is synthesized live in the browser. Three tracks sit at 96, 120 and 144 BPM with 48, 72 and 104 notes, generated from fixed seeds. D, F, J and K are the four lanes; a hit within ±45 ms of a note’s target time is Perfect and within ±100 ms is Good. Every 10 combo adds 5% to the score, capped at +50%. There is not a single audio file, and records stay on this device.

How to play
Tracks 3Lanes 4Notes 48 / 72 / 104BPM 96 / 120 / 144Windows ±45 / ±100 msMax combo bonus +50%

Keyboard: arrows / WASD, Space, P pause, M mute · Mobile: touch the canvas

How to play

Four lanes, three tracks, and every sound computed on the spot. Notes fall from the top of the screen toward a judgement line; you press the matching key at the moment they meet. Judgement does not watch which frame the renderer is on. It watches the audio clock: each note carries a target time, and a hit is graded by subtracting that target from the current song time.

Life starts at 100. Perfect restores 1.2, Good restores 0.5, a Miss costs 6, and hitting zero marks a failure while the track still plays out to the end. Accuracy is (Perfect × 1 + Good × 0.6) divided by the total note count, so an all-Perfect run is exactly 100%. To score well, hold the ±45 ms window first, then keep the combo climbing toward 100.

Tracks
3
Lanes
4
Notes
48 / 72 / 104
BPM
96 / 120 / 144
Track length
40 s each
Windows
±45 / ±100 ms
Combo bonus
+5% per 10, cap +50%
Life
100 / Perfect +1.2 / Good +0.5 / Miss −6

Controls

D / F / J / KHit the four lanes
PPause / resume
RRestart the current track
EscBack to the title
MMute / unmute
MobileFour bottom pads, split by x, multi-touch

What this is

RAIN BEATS is a four-lane falling-note rhythm game that runs the moment you open the page, with no download and no sign-up. Four lanes map to the D, F, J and K keys, and notes fall from the top of the screen toward a judgement line. Press the matching key when a note reaches that line and it counts as a hit. On a phone there is no keyboard, so four touch pads are drawn along the bottom edge; a finger in a column strikes that lane, and several fingers work at once. Judgement is computed separately from rendering, so a dropped frame does not drag the beat along with it.

There are three tracks: Eaves at 96 BPM, 64 beats and 48 notes; High Tide at 120 BPM, 80 beats and 72 notes; Downpour at 144 BPM, 96 beats and 104 notes. Length is beats divided by BPM, which makes each track exactly 40 seconds. Charts come from fixed seeds, so the same track always opens with the same note positions, lanes and count, which is what makes scores comparable from one run to the next.

The master clock is the AudioContext currentTime, not a frame counter. Every note, every bass hit and every layer of rain is scheduled ahead onto a future point on that clock, and a hit is graded by comparing the current song time against the note’s target time. Within ±45 ms is Perfect, within ±100 ms is Good, and a note left unhit past 100 ms is a Miss. Even if one frame stalls for half a refresh, the judgement windows do not move.

How the three tracks are made

None of the three tracks uses an audio file. A low sine oscillator carries the bass, a triangle wave with a fast decay makes short xylophone-like tones, and a layer of high-pass and low-pass filtered noise supplies the rain bed. WebAudio synthesizes all of it live in the browser, with each event scheduled ahead against currentTime, so sound and judgement share one ruler. The three tracks use different scales and timbres, growing from mellow to tense as the difficulty climbs.

The charts are not hand-written; they are generated from fixed seeds. Generation slices each track into an eighth-note grid, picks a weighted set of slots to hold notes, raises the density as difficulty rises, and drops two-lane chords into some of those slots. Once picked, the notes are counted again to confirm exactly 48 for Eaves, 72 for High Tide and 104 for Downpour, no more and no fewer. The count is available at runtime and never changes between reloads.

Judgement and scoring

Life starts at 100. Perfect restores 1.2, Good restores 0.5 and a Miss costs 6, clamped between 0 and 100. Reaching zero marks a failure, but the track still plays to the end and the results screen says so plainly rather than throwing you out or cutting the accompaniment short. Combo rises on Perfect and Good and resets on a Miss.

Every time the combo reaches a multiple of 10, the score for each following note gains another 5%, up to a ceiling of +50%, which is reached at a combo of 100 and stops there. Perfect has the highest base value and Good is roughly six tenths of it. Accuracy is (Perfect × 1 + Good × 0.6) divided by the total note count for the whole track, so an all-Perfect run is 100%, an all-Good run is 60% and an all-Miss run is 0%. The results screen also assigns a grade of S, A, B or C.

Why the sound is synthesized in the browser

Skipping audio files is mostly about keeping the beat and the judgement strictly aligned. A downloaded file has to be decoded and buffered in the browser, and the moment it actually starts is often tens of milliseconds away from the first rendered frame, with that gap varying between devices. Here every note, every bass hit and every layer of rain is scheduled ahead against currentTime, and judgement reads the same clock. Sound and picture use one ruler, so there is no offset to guess at.

The implementation schedules a small window into the future: on each frame it hands WebAudio the notes and accompaniment due within roughly the next 0.15 seconds, and leaves the rest for later frames. That avoids frame hitches without scheduling the whole track at once, which would otherwise fire a burst of catch-up notes when you return to a backgrounded tab. Pausing suspends the AudioContext so currentTime stops, and resuming continues from exactly that position, so no note is doubled or lost.

The trade-off is that the sound cannot be as thick as a studio recording. What it buys is size and determinism: there is no mp3 or ogg on the page, the game works offline, and each track keeps its own scale and timbre. The rain is filtered noise, the xylophone is a triangle wave with a fast decay, and the low end is a sine. All of it is computed on the spot, with no sample file to wait for.

Keys, judgement line and fall speed

On a computer, D, F, J and K strike the four lanes, P pauses, R restarts the current track, Esc returns to the title, and M plus the on-page buttons handle sound. Fall speed is fixed in pixels per second, while the judgement line follows the canvas height, so resizing the window never makes a note arrive early or late. What changes is how long a note is visible on screen, not the time at which it should be hit.

On a phone, four touch pads are drawn along the bottom of the canvas, one per lane, split by x coordinate so multi-touch presses register separately. Each pad carries its key letter and works in portrait or landscape. The four glowing lanes run from purple across to mint; a hit throws a ripple and particles at the judgement line, the combo number pops up, and the pressed lane lights up. Rain streaks in the background sit on several parallax layers, thin and slow in the distance, thicker and faster up close.

Where records are kept

The best score and the best accuracy for each track are stored separately in this browser’s localStorage, keyed by track. The track-select and results screens read them back, and the results screen calls out a new record. Nothing is uploaded, nothing syncs across devices and there is no account; clear the site data or switch devices and the records start from zero. The page loads an ad script to cover running costs, but the game itself has no server, no form and no first-party analytics. We do not know who you are or how many runs you played.

Frequently asked questions

Below are concrete questions about judgement, sound and records, with answers tied to the actual implementation rather than general reassurance.

Is judgement accurate, or does it change with my screen refresh rate?
It does not change. Judgement uses the difference between AudioContext currentTime and the note’s target time, independent of frame rate or refresh rate. A dropped frame may make a note look like it jumps, but the ±45 ms and ±100 ms windows stay put.
Does the audio drift after a pause?
Pausing suspends the AudioContext so currentTime stops, and notes already scheduled ahead freeze with it. Resuming continues from the frozen position with an unchanged song time, so nothing is doubled, skipped or rushed.
Is the note count really fixed?
Yes. Charts come from fixed seeds and are counted after generation: 48 for Eaves, 72 for High Tide and 104 for Downpour, exactly the labelled values, identical on every load and countable at runtime.
How do I hit four lanes on a phone?
Four touch pads sit along the bottom, split by x coordinate and supporting multi-touch. You do not need to find four physical buttons; whichever column your finger lands in strikes that lane.
What happens when life reaches zero?
Reaching zero marks a failure, but the track plays out to the end. The results screen clearly labels the run as failed and still gives a grade and a score; the game does not end early.

The rain is still falling

Pick a track and start with the 48 notes of Eaves. Your scores stay in this browser.