Electronic Music Tools with JavaScript: Week 1
This week I started the course Learn to Code Electronic Music Tools with JavaScript offered by Goldsmiths on FutureLearn and taught by Matthew Yee-King. I am very passionate about music, play the guitar and have made a few guitar effects pedals in the past but I have never dabbled with making digital instruments or processing audio on a computer. When I came across this course I thought it would be a great way to combine my passions for music and software. I decided to write a post at the end of each week of the course as I explore the Web Audio API for the first time and hopefully create some interesting instruments.
The course goes over the basics of the Web Audio API so rather than do that here I'll just be posting my thoughts about the course and some of my creations from it! I also recently read this fantastic introduction to the Web Audio API you may find an interesting read if you'd like to get a feel for what the API is capabale of.
Week 1 - Build a Synthesizer
Week 1 focuses on oscillators and covers a variety of topics to create simple sounds with the Web Audio API. It covers:
- Oscillators
- Basic user interfaces with event listeners
- Modulation
- Gain nodes
- Envelopes
- Filters
These techniques are used to build a variety of simple synthesizers which respond to keyboard presses and mouse movements.
My First Electronic Instrument
Here is an example of a simple theremin which uses some of these concepts. The dark area responds to mouse movements: x-axis movement controls the frequency of an oscillator and y-axis the volume.
The oscillator is connected to a number of other audio nodes to change the sound with the controls in the grey area:
Pre-oscillator:
- Low Frequency Oscillator
- Gain node
The gain node controls how much the LFO should modulate the signal.
Post-oscillator:
- Filter (optional; different types)
- Waveshaper (controls distortion)
- A gain node to control the output volume of the instrument (altered by mouse movements in y-axis)
Please note, the theremin responds to mouse movements so will only work on desktop.
Thoughts on Week 1
I've really enjoyed the first week of the course, it has been great fun building and playing with the examples. So far I think the course has been well structured and taught at an appropriate level to be accessible to both musicians and developers.
What's Next?
Next week will be about creating user interfaces for synthesizers with NexusUI. The library looks really cool and I can't wait to get started on creating some music tools with more sophisticated UIs!