skip to content

Composing Music with Code

/ 2 min read

NOTE: Want to skip to making music? You can try timb(re) out at paullj.github.io/timb and the code is available here.

You may have heard of terms like generative music from Brain Eno’s Music for Airports1, or algoraves, live events where people dance to music generated from algorithms, or live coding, on the fly progamming for music.

I certainly hadn’t, until I watched Resident Advisor’s video2 on algoraves. This led me down a youtube spiral of watching other3 videos4 about creating music with code.

Another idea that is similar is the world of creative coding. Creative coding is a type of computer programming in which the goal is to create something expressive instead of something functional. Often it is used to create visual art, but it isn’t limited to that. I wanted to make a fun project that brought these two things together in the browser.

The idea is very heavily inspired by Martin Kleppe’s tixy.land. Tixy is a minimalist creative coding environment where you can control the size and color of a 16x16 dot matrix with a single JavaScript function. The input is limited to 32 characters but you can acheive very complex patterns, shapes and visual effects with it.

Example of what you can create with tixy.land

timb(re) is a a creative coding playground for creating music heavily inspired by tixy.land. You can type in 64 characters of JavaScript as a function and that is used to play a little tune. Like tixy, the function you write is provided parameterstime and index, however unlike tixy, instead of x and y the parameters m and b are used which represent measures and beats respectively.

I made this quick, fun project using SvelteKit over the last few days. Although it uses SvelteKit, it is a SPA^[Single Page Application]. I was going to just use a standard svelte project but SvelteKit makes it so easy to export and host on places like GitHub Pages and even gives easy ways to export some pages as plain HTML, like /about in this project. It uses ToneJS for the audio synthesis but other than that its just Svelte, which was easy to use as always.

You can try it out at paullj.github.io/timb and the code is available here.

Footnotes

  1. A release of excerpts of generative music

    https://open.spotify.com/track/1Qr6LFKNBFNNa2y6nMDO31?si=8812c14cdd4c42c0

  2. ‘Algorave Generation’ mini documentary by Resident Advisor

  3. Short Guardian video ‘Run the code: is algorave the future of dance music?’

  4. TEDxHull talk by Alex McLean, ‘Algorave: algorithmic dance culture’