App Review: HTML5 Drum Machine

 

Rebecca Miller aka DJ REBEXX explores HTML5 Drum Machine, a free browser-based simulation of the classic Roland TR-808 drum machine. Follow the instructions below and you’ll be beat making in no time!

 
 
Workshop graphics (1).png
 
 

HTML5 Drum Machine is an app that is a free browser-based simulation of the classic Roland TR-808 drum machine. It allows you to create, save, and download drum loops in your browser. The app is a great way to quickly sketch out a beat, make music and play an instrument on your laptop or computer.

 
 

Step 1:

Go to the Toolbox on the Building Beats website and click on the HTML5 Drum Machine link.

The app will open in your browser and it is immediately ready to use. Its bright colors and concise layout make it easy to learn. I was able to pick it up within a few minutes of trying it out for the first time.

 
 
HTML5 screenshot #2.png
 
 

Step 2:

To begin, you will see a 16-step sequencer with 16 pattern keys that emulates the classic TR-808 drum machine. Select your first drum sound. Let’s start with a KICK. Click the dots on the sequencer to determine where the kick sound will occur. Here you can see I selected the KICK for steps 1, 4, 8, and 16.

Select as many different of the 13 different drum sounds as you’d like to create a beat pattern for each individual sound.

Hit the PLAY button to hear how it all sounds together as you make selections.

Select the TEMPO to adjust the beats per minute (bpm) of your drum loop depending on how slow or fast you would like it to be.

Hit PLAY to hear the beat as you continue to make adjustments.

 
 
HTML5 screenshot #3.png
 
 

Step 3:

You can continue to make adjustments to the sounds of your drum loop by trying by switching between the five different drum kits. Each DRUM KIT (Hip Hop, Electronic, etc.) has 13 different sounds that you can play around with depending on what sounds good to you.

The interface changes color depending on which kit you select. For example, if I go to DRUM KIT SELECT and select HOUSE, the drum sounds change along with the color scheme of the drum machine.

Once you have selected the drum kit, you can tune each individual drum sound by turning the TUNE knob to the left or the right to change the sound of each instrument.

You can do the same method to change the VOLUME for each individual drum sound as well.

HTML5 screenshot #4.png

Step 4

You have the option to save up to two different patterns. Select Pattern A or Pattern B when creating your drum loop and hit SAVE when you have something you like.

Once you are ready with your drum loop, you can record and export as a WAV file. Simply select EXPORT PATTERN AS WAV then RECORDING AUDIO CLICK TO STOP. Once you have stopped recording you can select DOWNLOAD RECORDING.

You can import this file to the free DAW Soundtrap and continue to add elements and build around your drum loops.

Overall, the HTML 5 Drum Machine app is easy to use and a lot of fun to play with. Make your first beat in minutes!