How to Use the Drum Machine:
Program Beats in Your Browser

The drum machine is the foundation of modern music production. Hip hop, house, techno, pop — nearly every contemporary genre was shaped by the creative limitations and possibilities of step sequencers. The Titan Audio Drum Machine brings that workflow directly to your browser: no downloads, no plugins, no latency issues.

This guide walks you through everything — how the step sequencer works, what each sound is and when to use it, how to program a beat from scratch, and how swing and volume controls change the feel of your pattern. By the end, you'll have a working groove and the mental model to build more complex ones.

How the Step Sequencer Works

A step sequencer divides time into a fixed number of equal slots — in this case, 16 steps. Each step represents a 16th note (semiquaver) at whatever BPM you've set. When the sequencer runs, it lights up each step in order from left to right. Any step you've activated will trigger its corresponding sound as the playhead passes through it.

The 16-step grid gives you one bar of music in 4/4 time. Steps 1, 5, 9, and 13 fall on the downbeats — the quarter notes. Steps 3, 7, 11, and 15 fall on the upbeats (the "and" counts). The remaining steps fall on the 16th-note subdivisions between each beat.

Each row in the grid corresponds to one drum sound. Activating a step in a row tells that sound to fire at that position in the bar. The pattern loops continuously until you stop it, which is what gives you the repetitive, hypnotic quality that makes drum machine beats work.

The Six Synth Sounds Explained

The drum machine uses six synthesized percussive sounds, all generated by the Web Audio API — no samples, no files to load, just pure synthesis. Understanding what each sound does helps you place them correctly in a pattern.

• Kick — A sub-heavy low thump. This is your foundation. In 4/4 music, the kick typically falls on beats 1 and 3 (steps 1 and 9). In hip hop it's often syncopated. Keep it sparse until the groove feels right.
• Snare — A sharp midrange crack with a brief noise tail. Standard placement is beats 2 and 4 (steps 5 and 13). Moving the snare even one step early or late creates a dramatically different pocket.
• Hi-Hat (Closed) — A tight high-frequency tick. This is your subdivision layer. Eight notes on every other step creates an energetic, driving feel. Quarter notes give you a minimal, sparse groove. 16th notes on every step is relentless.
• Hi-Hat (Open) — A longer, splashing high-frequency sound that cuts through. Typically placed on the upbeats (the "and" counts) for a classic disco or house feel. Use sparingly — it occupies a lot of spectral space.
• Tom — A mid-pitched punchy thump, lower than the snare. Great for fills, accent patterns, and adding melodic motion to the rhythm. Works well on steps 11 and 15 for a classic 4/4 break variation.
• Clap — A sharp transient, similar frequency range to the snare but with a different attack character. Often layered with the snare or used as a counterpoint to it. In trap and hip hop, the clap carries a lot of the rhythmic personality.

Programming Your First Beat

The best way to learn is to program a classic four-on-the-floor pattern — the backbone of house, techno, and most dance music. It will teach you the spatial relationships in the grid that carry over to every other pattern you'll write.

Step 1: Set your BPM. Start at 120 BPM — the neutral tempo that works for most genres. You can adjust later once the groove is established.

Step 2: Program the kick. Activate steps 1, 5, 9, and 13 in the Kick row. Hit Play. You should hear a kick on every quarter note — a steady, driving pulse.

Step 3: Add the snare. Activate steps 5 and 13 in the Snare row. The snare falls on beats 2 and 4. Listen to how it creates tension and release against the kick.

Step 4: Layer the hi-hat. Activate every even-numbered step (2, 4, 6, 8, 10, 12, 14, 16) in the Closed Hi-Hat row. This gives you eighth notes — the standard driving subdivision of house music.

Step 5: Add variation. Remove one or two kick hits to create syncopation. Try activating step 11 in the Kick row and removing step 9. Notice how the groove shifts — the kick now anticipates beat 3 instead of landing on it.

Swing and Volume Controls

Swing is the subtle displacement of the even-numbered 16th notes — the "e" and "ah" subdivisions — slightly later in time. At 0% swing, every step is exactly on the grid. As you increase swing, the even steps push back, creating that lurching, behind-the-beat feel that defines hip hop and jazz-influenced electronic music.

The effect of swing depends on your tempo. At 80 BPM, even a 15–20% swing creates a noticeable groove. At 130 BPM, you need more swing percentage to hear the same effect. Start at 10–15% and listen to how it changes the feel before pushing it further.

The volume control sets the master output level of the drum machine. Use it to balance the drum machine against other audio sources. The default level is appropriate for most situations — but if you're using the drum machine alongside the tuner or other browser audio, you may want to dial it back so it doesn't dominate.

Using and Modifying Presets

The drum machine ships with six preset patterns covering common genre templates. Load a preset to hear a complete, functional beat, then modify it to understand how it's built.

When you load a preset, look at which steps are activated for each sound before you start changing anything. Notice the kick and snare relationship first — that's the rhythmic backbone. Then look at the hi-hat density, which tells you the energy level the pattern is designed for. Finally, check for any syncopated elements in the tom or clap rows, which add personality and variation.

The most useful learning exercise is to load a preset, remove one row entirely, and see how the groove changes. Then add it back and remove a different row. After a few minutes of this you'll understand exactly what each sound contributes to the overall feel — which is the real foundation of beat programming.

Taking It Further

Once you're comfortable with a basic 16-step loop, here's how to push further:

• Half-time feels. Keep your hi-hat density the same but move your snare to step 9 only (beat 3). The pattern now feels half as fast, even at the same BPM. This is the foundation of trap and many hip hop grooves.
• Polyrhythms. Try programming the Tom row in groups of 3 steps (steps 1, 4, 7, 10, 13, 16). This three-against-four pattern creates a shifting, cyclical groove that resolves every bar — but sounds off-kilter while it's happening.
• Negative space. The most common mistake beginners make is filling every row too densely. Great beats are often defined by what's not there. Remove everything from one bar and let the silence speak.
• BPM and genre matching. Match your BPM to the genre you're targeting (see the BPM guide). A lofi beat at 75 BPM with swing sounds completely different from the same pattern at 135 BPM with no swing.