Synthesising Drum Sounds with the Web Audio API
dev.opera.comA page with an actual play button, https://chrislo.github.io/drum_synthesis/
How can an article detailing the synthesis of drum sounds using web audio apis and not have a play button?
I started reading the article and creating the kick drum in my console, then skipped right to the playback on this page and was initially very excited by that hihat sound. It was a bit of a let down, although not much of a surprise, to find out the hihat was a sample.
Having made a JS/CSS drum machine (sample playback) emulator a few years ago @ http://bitrotten.com/dr110/ and more recently spending time doing emulative sound design on a modern drum machine @ http://bitrotten.com/tempest/ I'm still enthused by this demo and write-up. Next month I return to an hour-long commute by train, and now I've got a pretty good idea of how I'll be spending that time.
Glad you enjoyed it! Synthesizing cymbals is hard, but not impossible. I admit, I did "cheat" a little here, but at least it gave me a chance to talk about sampling. If you're interested in cymbal synthesis, this article is great: http://www.soundonsound.com/sos/Jun02/articles/synthsecrets0....
Should keep you busy on your commute!
The article links to that page. I don't think its absolutely necessery for the article itself to have a play button, as long as it links to a page which does.
The play button should be between the title and the body of the text. There was no indication that the github page would have a playable sample. I was prepared to checkout the source.
If you continue clicking on play it will play it again over the previous one. Don't go crazy clicking, lest you crash your browser. I think the correct behaviour would be to stop the previous script run and start over. No, I don't know enough javascript to fix it myself and create a pull request, in case you're wondering. ;)
They said that removing high frequencies makes a snare drum better which may be true, but then they used a highpass filter.
Very interesting article.