HTML 5 Drum Machine Turns Your Browser Into A Virtual Instrument

html-5-drum-machine

The HTML 5 Drum Machine is a browser-based virtual instrument, created by Jamie Thomson, that is inspired by old-school hardware. 

It’s built using features of the latest version of HTML, the markup language for the worldwide web. Using HTML for the app means that it doesn’t require any plugins or proprietary software in order to run – it just loads in standard web browsers. This approach is fairly new, though, and may not work with some browsers.

Give the web-based drum machine a try and let us know if it works with your web browser.


12 thoughts on “HTML 5 Drum Machine Turns Your Browser Into A Virtual Instrument

  1. iPhone 4S / iOS 6.1.3:
    does not work in Safari or Chrome for iPhone.
    It looks like it does visually, but no sound.

    Like or Dislike: Thumb up 0 Thumb down 0
    • Works on my iPhone 4S with iOS 6.1.3 in Safari. It didn’t work at first in portrait but I rotated to landscape and now it works in landscape or portrait.

      Like or Dislike: Thumb up 0 Thumb down 0
  2. Ive been playing with this for almost an hr now, its so much fun! great sounds, simple interface, and pretty powerfull for what it is. I only wish it had qwerty keyboard functionality! building a dynamic with only a mouse is alittle tricky. not to mention then i could use my makey makey with it!

    Like or Dislike: Thumb up 0 Thumb down 0
  3. Works in google chrome, whilst posting it on twitter (going to another page) it glitches out, but thats not a big issue. Dig those hat sounds, nice and crunchy

    Like or Dislike: Thumb up 0 Thumb down 0
  4. Nice! For possible update i whish for multiple patterns. Also, timing is pretty unstable on Firefox / OS X – but hey, cool idea!

    Like or Dislike: Thumb up 0 Thumb down 0
  5. Ummm, hasn’t this been done before? In fact, isn’t there a website that gives you an 808, 909, 303, and a couple other instruments and effects right in the browser for you to make music with?

    Like or Dislike: Thumb up 3 Thumb down 0

Leave a Reply

Your email address will not be published. Required fields are marked *

You may use these HTML tags and attributes: <a href="" title=""> <abbr title=""> <acronym title=""> <b> <blockquote cite=""> <cite> <code> <del datetime=""> <em> <i> <q cite=""> <strike> <strong>