Road to Larissa

Making Music With D3

Click to add a note; requires firefox or chrome. Remake of Jack Vishneski’s and my remake of tonematrix.

Polar coordinates are pretty cool for displaying looping music! The music actually loops and larger boxes produce lower pitches, just like they do in real life. Other, smaller improvements:

  • Log scaled sliders allow for finer control of large and small values. Going up or down an octave sounds like the same distance to our ears, but on a linear scale 220 Hz is four times closer to 440 Hz than 880 Hz. With bigger ranges, most of the smaller interesting values cluster together on a linear slider.
  • Double and triple clicking produce replaces the default square waveform with saw and triangle waveforms. And adds more color!
  • I’ve lowered the gain. Previously playing more than two notes would create an awful screech; not maxing out the sound card avoids this problem.
  • Cleaner code. After over a year of d3 and javascript, I think I’m really starting get a handle on writing clearly and idiomatically. Bit too much post here, but it is amazing what 150 lines can do when built on top of the right abstractions.

Still todo:

  • Customizable beats – both the raw number and their duration to allow for swinging and different time signatures.
  • More scales and some sort of visualization of half and whole steps. It would also be interesting to explore explicitly educational interactive demonstrations of music theory.
  • Saving/sharing state and more ambitiously, saving/sharing history to playback the process of making a song.