How Drum Beats Work

The grid behind the groove

Most of the electronic and pop music you know was built on a step sequencer — a grid where time runs left to right in equal steps, and each row is a drum. You place a hit by switching a cell on; press play and the grid loops, triggering whatever is lit as the playhead sweeps across. It is a wonderfully direct way to make rhythm: you can literally see the beat. Try it in theBeat Maker.

The standard grid is 16 steps, which is one bar of common (4/4) time divided into sixteenth notes. Those 16 steps group into four "beats" of four steps each — the pulse you'd tap your foot to. Understanding that structure is the key to everything else: the big beats fall on steps 1, 5, 9 and 13.

The three that do most of the work

A drum kit has many pieces, but three carry the core of almost every beat: the kick, the snare and the hi-hat. Learn how these three relate and you can build a groove immediately.

That combination — kick on 1 and 3, snare on 2 and 4, hats ticking throughout — is the famous backbeat, and it is the engine of rock, pop, hip-hop and countless other styles. Program just that, and you already have a beat that works. Everything else is variation.

Making it groove

A beat that only hits the obvious steps sounds stiff. Groove comes from what you add between the main beats:

• Syncopation: place a kick just before or after a main beat (an "off-beat") to create a sense of push and pull.
• Hi-hat patterns: vary the hats — busy sixteenths feel urgent; sparse eighths feel relaxed. Leaving a gap creates space.
• Ghost notes: quiet extra hits (often on the snare or claps) fill the gaps and add a human feel.
• The clap: layering a clap with the snare thickens the backbeat — a staple of dance music.

The best way to learn is to start from the basic backbeat and change one thing at a time, listening to what each edit does. Toggling cells while the pattern plays — as this Beat Maker allows — turns that into instant feedback.

Tempo sets the feel

The same pattern feels completely different at different speeds, measured in beats per minute (BPM). Slow tempos (70–90 BPM) feel like hip-hop or a relaxed groove; the 120–130 range is classic house and pop dance; faster still gets into energetic electronic styles. Because the sequencer plays sixteenth notes, the actual step rate is four times the BPM, which is why even a modest tempo produces a steady stream of hats. Nudging the tempo is one of the quickest ways to change the entire character of a beat.

Sound from nothing

A neat detail of a browser beat maker is that it needs no audio files at all. Using the Web Audio API, the drum sounds are synthesized live: a kick is a sine wave whose pitch drops sharply, a snare and hi-hat are bursts of filtered noise, a tom is a lower pitch-dropping tone. This is, in fact, how the legendary drum machines of the 1980s made their sounds — by generating them electronically rather than playing back recordings. It means the whole instrument fits in a web page and plays instantly, with nothing to download.

Listening like a producer

One habit will improve your beats faster than any technique: listen to music you like and try to isolate just the drums in your head. Count the sixteen steps and work out where the kick lands, where the snare sits, and how busy the hats are. Most people have never consciously done this, and it is startling how quickly patterns you have heard thousands of times become legible.

Then recreate what you heard on the grid. It will not be exact, and that is the useful part — the gap between your version and the original is precisely what you have yet to notice. This kind of active transcription is how producers develop an ear, and a step sequencer is the ideal place to do it because the grid maps directly onto how you were counting.

Where to take a pattern next

A sixteen-step loop is a starting point rather than a finished piece, and the natural next steps are worth knowing even if you never leave the browser. Producers typically build a track by layering variations of one core pattern: a stripped-back version for the intro, the full pattern for the main section, a version with the kick removed for a breakdown, and a busier fill to signal a transition.

That structure is why a four-minute track built from a two-second loop does not become boring. The listener is carried through changes in density rather than melody — hats dropping out, a clap arriving, the kick returning after a bar of absence. You can rehearse the same thinking here by toggling cells while the loop plays and noticing how much a single removed hit changes the feel. Learning to hear that is the foundation of arrangement, and it costs nothing to practise.

Common mistakes when programming a beat

Beginners tend to make the same handful of errors, and each is easy to correct once you know to listen for it.

• Too many hits. The instinct is to fill the grid, but space is what makes a beat groove. Remove hits until it feels sparse, then add one back.
• Kick and snare on the same step. Stacking them muddies both; let each own its moment.
• Ignoring the off-beats. A pattern that only lands on the four main beats sounds like a metronome. The character lives between them.
• Hats on every single step, always. Constant sixteenths get exhausting; vary them or drop some for contrast.
• Never changing the loop. Even a small variation every fourth bar keeps a pattern alive over time.

The single most valuable habit is subtraction. When a beat is not working, the productive move is almost always to remove something rather than add. A kick, a snare and a handful of hats will groove; the same pattern with every cell filled will not, because there is nothing left for the ear to anticipate.

Why rhythm moves us

Humans are unusual among animals in our ability to entrain to a beat — to synchronise movement with an external pulse automatically and without training. Tap your foot to a song and you are doing something most species cannot. Researchers have found that the brain regions governing movement activate when we merely listen to rhythm, even while sitting perfectly still, which is why music feels physical rather than purely auditory.

Much of the pleasure comes from prediction. Your brain continuously forecasts when the next beat will land, and a steady pulse lets it succeed — a small, repeated reward. That is also why syncopation is so satisfying: a hit placed slightly off the expected beat briefly violates the prediction, creating a tension that the next on-beat hit resolves. Groove lives in that interplay between fulfilled and thwarted expectation, which is precisely why a perfectly regular pattern can feel sterile while one with a few well-placed off-beats makes people move.

This yields a practical rule for programming beats: establish a reliable pulse first so the listener can lock onto it, then introduce the surprises. Surprises without a foundation just sound like noise, because there is no expectation for them to play against.

The machines that shaped modern music

The sounds in any step sequencer descend from a handful of drum machines that accidentally defined entire genres. The Roland TR-808, released in 1980, was a commercial failure — musicians complained its synthesized drums sounded nothing like real ones. Precisely because it flopped, it turned up cheap in second-hand shops, where hip-hop and electro producers discovered that its booming, unnaturally long kick was unlike anything else available. It became one of the most influential instruments ever made.

Its successor, the TR-909, added a punchier kick and crisper hats and became the backbone of house and techno; the LinnDrum, which used real drum samples, defined much of eighties pop. The lesson buried in that history is encouraging for anyone starting out: these machines did not succeed by sounding realistic. They succeeded by sounding distinctive and being easy to program — which is exactly what a synthesized browser sequencer offers.

How each drum sound is built

Since the sounds here are synthesized rather than sampled, it is worth knowing what each one actually is — the recipes are simple and surprisingly intuitive.

The pattern is that pitched drums (kick, tom) come from oscillators sweeping downward, while noisy drums (snare, hat, clap) come from filtered white noise. That is essentially the whole of classic drum synthesis, and it is why an entire drum kit can be generated in a few lines of code with no audio files at all.

Four patterns to start from

Rather than staring at an empty grid, it helps to know a few standard patterns and modify them. Steps are numbered 1–16.

• Four-on-the-floor (house): kick on 1, 5, 9, 13; clap or snare on 5 and 13; hats on every off-beat. Relentless and danceable.
• Basic rock: kick on 1 and 9, snare on 5 and 13, hats on every other step. The most common beat in popular music.
• Boom-bap (hip-hop): kick on 1 and around 11, snare firmly on 5 and 13, swung hats. Slower and heavier.
• Half-time: snare only on step 9 instead of 5 and 13. Instantly makes any tempo feel enormous and spacious.

The half-time trick is the one most worth trying, because it demonstrates how much of a beat's character comes from the snare placement rather than the tempo. Moving one hit transforms the feel entirely without changing anything else.

Why sequencing changed music

Before drum machines, recording a rhythm meant hiring a drummer, a room and an engineer. A sequencer collapsed that into a device one person could program at home — and, unlike a human, it repeated perfectly and could be edited a hit at a time. That is a large part of why entire genres emerged from bedrooms in the eighties, and why the visual grid became how a generation of musicians thinks about rhythm.

It also changed what rhythms people wrote. A grid makes certain things easy — precise repetition, exact subdivisions, patterns no human could sustain — and other things awkward, like the subtle timing drift that gives live drumming its feel. Producers eventually added "swing" and humanisation controls to put some of that looseness back. Understanding that tension is useful even in a simple sequencer: a perfectly quantised beat is tight and mechanical by nature, and if it feels stiff, the answer is usually to remove a hit or leave more space rather than to add more.

In short: start from the backbeat, leave space rather than filling every cell, and let the tempo and a few off-beat hits supply the character. Rhythm feels mysterious until you see the grid behind it — then it becomes a game of placing hits in time. Lay down a kick and snare, add some hats, and adjust until it moves. Build your first beat in theBeat Maker— every sound generated live in your browser.