Systems music is an idea that explores the following question: What if we could, instead of making music, design systems that generate music for us?
This idea has animated artists and composers for a long time and emerges in new forms whenever new technologies are adopted in music-making.
In the 1960s and 70s there was a particularly fruitful period. People like Steve Reich, Terry Riley, Pauline Oliveros, and Brian Eno designed systems that resulted in many landmark works of minimal and ambient music. They worked with the cutting edge technologies of the time: Magnetic tape recorders, loops, and delays.
Today our technological opportunities for making systems music are broader than ever. Thanks to computers and software, they're virtually endless. But to me, there is one platform that's particularly exciting from this perspective: Web Audio. Here we have a technology that combines audio synthesis and processing capabilities with a general purpose programming language: JavaScript. It is a platform that's available everywhere — or at least we're getting there. If we make a musical system for Web Audio, any computer or smartphone in the world can run it.
With Web Audio we can do something Reich, Riley, Oliveros, and Eno could not do all those decades ago: They could only share some of the output of their systems by recording them. We can share the system itself. Thanks to the unique power of the web platform, all we need to do is send a URL.
In this guide we'll explore some of the history of systems music and the possibilities of making musical systems with Web Audio and JavaScript. We'll pay homage to three seminal systems pieces by examining and attempting to recreate them: "It's Gonna Rain" by Steve Reich, "Discreet Music" by Brian Eno, and "Ambient 1: Music for Airports", also by Brian Eno.
Table of Contents
"Is This for Me?"
How to Read This Guide
The Tools You'll Need
Steve Reich - It's Gonna Rain (1965)
Setting Up itsgonnarain.js
Loading A Sound File
Playing The Sound
Looping The Sound
How Phase Music Works
Setting up The Second Loop
Adding Stereo Panning
Putting It Together: Adding Phase Shifting
Exploring Variations on It's Gonna Rain
Brian Eno - Ambient 1: Music for Airports, 2/1 (1978)
The Notes and Intervals in Music for Airports
Setting up musicforairports.js
Obtaining Samples to Play
Building a Simple Sampler
A System of Loops
Playing Extended Loops
Adding Reverb
Putting It Together: Launching the Loops
Exploring Variations on Music for Airports
Brian Eno - Discreet Music (1975)
Setting up discreetmusic.js
Synthesizing the Sound Inputs
Setting up a Monophonic Synth with a Sawtooth Wave
Filtering the Wave
Tweaking the Amplitude Envelope
Bringing in a Second Oscillator
Emulating Tape Wow with Vibrato
Understanding Timing in Tone.js
Transport Time
Musical Timing
Sequencing the Synth Loops
Adding Echo
Adding Tape Delay with Frippertronics
Controlling Timbre with a Graphic Equalizer
Setting up the Equalizer Filters
Building the Equalizer Control UI
Going Forward