TR909
December 22, 2015 3:44 PM   Subscribe

Teemu Kallio has created a pure HTML5 909 rhythm composer.
posted by jenkinsEar (37 comments total) 54 users marked this as a favorite
 
needs swing
posted by infinitewindow at 3:47 PM on December 22, 2015 [4 favorites]


when this was on reddit i couldn't work out how to use it til someone posted the following, so here's passing the good vibes along...

you need to select an instrument, by clicking the instruments name. once you've done that, you can click the buttons to indicate when it plays. also, press "play".
posted by andrewcooke at 4:23 PM on December 22, 2015 [7 favorites]


Bliss
posted by ead at 4:34 PM on December 22, 2015


For anyone who has never done this before, 1,5,9,13 are the on beats, 3,7,11,15 are the off beats. So bass drum on the on beats, snare on 5 and 13, closed High hat on 1,2, 4,5,6, 8,9,10,12,13,14, and open on 3,7,11 and 15 will give you a basic flat four. Play with the levels and tuning. throw in some hand claps and you are away.

Also clicking the same key twice once it is on will accent it (make it louder)

Sounds pretty realistic to be fair.
posted by marienbad at 5:21 PM on December 22, 2015 [9 favorites]


Just so we are clear: this is an absolutely astonishing piece of work. We are talking HTML5 difficulty level: Augean Stables. Bravo. Bra-fucking-vo, in fact.
posted by The Bellman at 5:38 PM on December 22, 2015 [6 favorites]


Needs a way to share your creation with others.

A particularly cool effect is when you switch to another tab in Chrome while it's running and it goes into full breakdown style.
posted by Jimbob at 5:54 PM on December 22, 2015 [4 favorites]


Needs a way to copy patterns... That said: yay for things like this. This is brilliant.
posted by pompomtom at 5:56 PM on December 22, 2015


Awesome! But I wonder if "pure html5" is a bit of an overstatement since this seems to be mostly Javascript powered. Impressive nonetheless, and the UI/layout is all html at least.

Also, for more browser music noodling, I recommend Google Labs' 808 Cube.
posted by p3t3 at 5:57 PM on December 22, 2015 [4 favorites]


"pure html5" just means no stinking Flash so it will probably run on your phone.
posted by Jimbob at 6:16 PM on December 22, 2015 [2 favorites]


I wonder if "pure html5" is a bit of an overstatement since this seems to be mostly Javascript powered.

Yeah, the HTML is hardly the most important or impressive part of it. Then again, people have been misusing the term "HTML5" from the beginning, to mean "HTML5, plus a bunch of new CSS features / JavaScript APIs that gained widespread browser support around the same time as HTML5". "HTML5" is the new "Web 2.0".

Just so we are clear: this is an absolutely astonishing piece of work. We are talking HTML5 difficulty level: Augean Stables. Bravo. Bra-fucking-vo, in fact.

Erm, it's neat, but what about it is so impressive? It's not even synthesizing the audio—it's just playing WAV files. (The original 909 also used digital samples for some of its sounds, but the kick and a few others were synthesized by analog circuits.)

I mean, I don't mean to knock the thing—it's a fun toy, and it's obviously the work of a competent programmer. It's just nothing revolutionary.
posted by escape from the potato planet at 6:16 PM on December 22, 2015 [1 favorite]


I'd still like an Ibanez DM 1000 app.

Though, I suppose in order for that to work you'd need to pipe the audio from all of your other apps, and the mic, into the Ibanez DM 1000 app. That would be amazing.

Or, at least it was amazing 25 years ago, anyway. yway. way. ay. ay. y. y.
posted by i_have_a_computer at 6:23 PM on December 22, 2015


I'd still like an Ibanez DM 1000 app. Though, I suppose in order for that to work you'd need to pipe the audio from all of your other apps, and the mic, into the Ibanez DM 1000 app. That would be amazing.

Here's a good start.

You can do a lot of stuff with WebAudio these days. It's almost like a VST in your web browser. You can even interface with MIDI!
posted by neckro23 at 6:37 PM on December 22, 2015


Holy shit this is incredibly fun.
posted by Salvor Hardin at 6:43 PM on December 22, 2015


Ok, I've now created the dopest beat evar. WHERE IS THE EXPORT BUTTON SO I CAN BECOME FAMOUS!?!
posted by Salvor Hardin at 6:46 PM on December 22, 2015 [1 favorite]


Also, as a web developer, I'm not super impressed with the 909 simulator in the OP. The code is minified, but it probably uses WebAudio, and it seems to use Angular for all the fiddly UI nonsense. Still pretty cool though.

(Somewhat relevant self-link: a modular synthesizer I wrote in 1kb of Javascript that does audio the old-fashioned way. Read the instructions or else you'll be totally lost!)
posted by neckro23 at 6:48 PM on December 22, 2015 [5 favorites]


Previously: Acid Machine
posted by monospace at 6:54 PM on December 22, 2015


For anyone who has never done this before

Oh my god, this is the first time anyone has ever explained what pattern to push the buttons in to make something sound good!!!! I have been playing with these sorts of toys for years and it always sounds like an earthquake at the shoebox factory!

Please please please someone tell me more patterns to punch in! I am too arrhythmic to go it alone!
posted by mittens at 7:01 PM on December 22, 2015


I mean, I don't mean to knock the thing—it's a fun toy, and it's obviously the work of a competent programmer. It's just nothing revolutionary.

Yeah, I feel like I’ve seen this many times over the years. Maybe the significance of it being HTML5 is lost on me? It is pretty.
posted by bongo_x at 7:06 PM on December 22, 2015


Also, for more browser music noodling, I recommend Google Labs' 808 Cube.

I really like that. Also, I somehow managed to set the tempo to NaN (in Firefox, natch), which is an amusing enough bug that I thought I should share it here.
posted by figurant at 7:07 PM on December 22, 2015


Please please please someone tell me more patterns to punch in! I am too arrhythmic to go it alone!

I think you can google common drum machine patterns to find lots more. One easy variation on the beat posted above is to keep the same snares, but move the bass drum to 1,7,11,14 (or just 1,7,11), maybe strip down the hi-hats and you have a basic hip-hop breakbeat.
posted by p3t3 at 7:21 PM on December 22, 2015 [2 favorites]


Very basic drum and bass: Tempo 170 ish, bass 1,7 snare 5,13
posted by Divest_Abstraction at 7:41 PM on December 22, 2015


More complex drum and bass: Temo 175, bass 1, 7 ,11 snare 5, 13 open hi hat 3, 15 closed hi hat 1,9,13
posted by Divest_Abstraction at 7:47 PM on December 22, 2015 [2 favorites]


For even simpler fun, or just a good intro to the very basics of noodling with a drum machine, try TypeDrummer.

caba
ccab
cabacabicabacabf

if anyone says 'abacab' I will punch them
posted by intermod at 8:04 PM on December 22, 2015 [1 favorite]


Oh my god, this is the first time anyone has ever explained what pattern to push the buttons in to make something sound good!!!! I have been playing with these sorts of toys for years and it always sounds like an earthquake at the shoebox factory!

Oh man, this is one of those cases where it never occurred to me that someone wouldn’t intuitively know how or instantly figure out how to punch out a basic rhythm with a drum machine. Yes, I know that sounds stupid. This is not at all a slight on you, it reminds me that putting yourself in other people’s frame of mind is hard.
posted by bongo_x at 8:05 PM on December 22, 2015 [1 favorite]


You can do a lot of stuff with WebAudio these days. It's almost like a VST in your web browser. You can even interface with MIDI!

But why?
posted by bongo_x at 8:07 PM on December 22, 2015


Well a DnB break is pretty much literally a hip hop break sped up... Anyway I found it didn't actually handle so well at 170+ earlier but results may vary.
posted by atoxyl at 8:59 PM on December 22, 2015


WHERE IS THE EXPORT BUTTON SO I CAN BECOME FAMOUS

Open audio editor. Hit record.
posted by pompomtom at 9:02 PM on December 22, 2015


Holy shit it has tune/detune. I thought this was just going to play back a bunch of fixed(crappy) WAVs or oggs or something.

Actually sort of cool in that sense. Better than a sample pack or some VSTs just because of that.
posted by emptythought at 10:29 PM on December 22, 2015


I think the pitch control just speeds up or slows down sample playback though? Because I turned one way down earlier and it went on for-ev-ver
posted by atoxyl at 11:12 PM on December 22, 2015


Isn't he a mefite?
posted by infini at 11:56 PM on December 22, 2015


I have no sense of rhythm. What can I do to that would be extremely annoying for someone who prides themselves on their acute sense of rhythm?
posted by Joe in Australia at 12:31 AM on December 23, 2015


Serious question? Nothing with a drum machine. Inherently everything you do will be a proper rhythm. It may be odd, but it won’t be "off". Whether someone will like it or not is another question.
posted by bongo_x at 12:50 AM on December 23, 2015 [1 favorite]


Well what is the point then.

I will just have to keep humming Christmas carols and stopping halfway through.
posted by Joe in Australia at 1:25 AM on December 23, 2015 [1 favorite]


Cool as hell.
posted by From Bklyn at 2:55 AM on December 23, 2015


abacab
posted by slogger at 7:41 AM on December 23, 2015 [1 favorite]


120 bpm
Kick: 1, 5, 9, 12, 15—turn the level all the way up
Hi tom: 5, 12, 15—turn the tuning knob down to about 10 or 11 o'clock
Closed hat: 1, 2, 5, 6, 9, 10, 12, 13, 14
Open hat: 3, 7, 11, 15

I can seeeee thee lite
posted by escape from the potato planet at 9:25 AM on December 23, 2015


MetaFilter: like an earthquake at the shoebox factory

Actually I'm going to be doing a song-a-week thing throughout 2016 and I must name one of them "Earthquake at the Shoebox Factory."
posted by Foosnark at 9:52 AM on December 23, 2015 [1 favorite]


« Older The right kind of attention doesn't have to stop.....   |   The Cookies you Make with the Stuff you've got... Newer »


This thread has been archived and is closed to new comments