Create Projects Courses Learn About
Make Some Noise!

Stories of music and computation intertwine more than you might think. This course explores musical fundamentals from the perspective of math and code, rather than from instruments and sheet music. No musical background required. This course is accessible to new coders, too — you can have a complete experience just playing with the projects and thinking about the basic ideas of music, but experienced students will enjoy editing and creating their own code-based instruments and pieces.

Notes and recommendations:

  • All of the project require significant screen space. Use the expanded view in the editor so the components are not all crunched up.
  • A single project can support two class-hours or even more if students want lots of time to get creative. One setup is an hour on music-thinking and an hour on code-thinking, plus or minus. However you choose to organize the course, give students time to play around, listen, share, and feel the music and its underlying tech.
  • You can work through this class either emphasizing musical ideas or coding ideas. With enough time, students can get a robust treatment of both. Pick based on the experience level of the teacher and the students.
  • For musical emphasis, spend time playing the projects without worrying about the code too much. Follow your ears and take time to discuss pitch, volume, time, harmony, rhythm, and musical ideas of that ilk. Students should aim to pick up musical vocabulary.
  • To emphasize code, dig into the code! The Tone.js library is the main driver of the projects, though these projects only scratch the surface of what Tone can do. Use p5.js to add a visual feedback layer to the musical projects. Music naturally encodes lots of mathematics — that mathematics forms a bridge to code-ideas.
  • In either case, check out the notes in the comments of the code files for explanations of core ideas. You'll find notes about musical vocabulary as well as breakdowns in code.
Synthesize Sound Waves
Synth
undefined

The basics of sound waves: pitch, envelope, and wave shape.

Notes:

  • This project consists of two synths, each of which can be controlled with on-screen UI.
  • The left synth is a sine wave; the right synth is a square wave.
  • Control the frequency and a simple attack-release envelope of each. Toggle looping and loop duration — use loops to set up extremely basic musical relationships between the two synths as a first step towards earnest musicmaking.

Goals:

  • Pick up some musical vocabulary: pitch, volume, and timbre.
  • Relate the musical vocabulary to equivalent vocabulary in physics/acoustics: frequency, amplitude, wave shape.
  • Get a feel for the possibilities of simple synthesis.
  • Check out how Tone represents and lets you control synths.
  • Build a bridge from Tone to p5 — that is, hook up visual feedback to the audio elements.

Activities:

  • Play with the sliders, watch the graphs change, and listen to the results.
  • Experiment with different wave shapes or build a more complex sound out of several waves (several Synths.)
  • Automate the parameters — for instance, set a random frequency every time you click the Play button.
  • For students so inclined, discuss how sound works in the first place — waves of pressure in the air induced by the motion of speakers, picked up by the ear.
  • Set up a more complex envelope, such as an ADSR — make sure to set up a control structure that can trigger release in that case.
Drum Machine
DrumMachine
undefined

Rhythm and sampling in a drum machine.

Notes:

  • This project is a sample-based sequencer/drum machine with a few generic samples pre-loaded.
  • Adding or deleting samples (use 'Assets' and then make sure those assets are included in the sounds array) will automatically adjust the number of rows of the drum machine.
  • The primitive 'Save/Load' system will download a JSON representing the on/off position of each square to your computer. Copy the contents of that file into the 'Load' popup to load a beat. Saving/loading does not preserve sound samples.

Goals:

  • Check out the alternative to synthesis for computer audio: sampling.
  • Pick up the basics of the math of musical rhythm: measures divided into beats, subdivided into smaller units. Practice fractions!
  • Feel the "high–medium–low" relationship of drum sounds (hihat–snare–kick).
  • Get into the science of beatmaking.
  • Control and display a grid of on/off squares using nested for loops that track booleans.
  • Understand setInterval() as the code-engine of rhythmic timing.

Activities:

  • Break down how to sample an audio file in JavaScript (in this case, using Howeler.js.) Load in other sound files as practice.
  • Make some beats! Start simple, then decorate. Try out different time signatures (numbers of beats and subdivisions). Also try out different tempos. Share with the class — have fun!
  • Code some visual upgrades to the drum machine.
Harmony
Harmony
undefined

Harmony, tuning, and chords.

Notes:

  • This project holds fifteen synths in three groups of five. Each group represents a different approach to tuning.
  • The wheels on the right trigger major and minor triads.
  • The sequencer at the bottom is for setting up and playing back a four-chord loop.

Goals:

  • Understand three mathematical approaches to tuning chords:
    • Continuous untempered pitch — hard to wield; easy to produce ugly chords.
    • Pythagorean Tuning/Just Intonation — resonant but inflexible and outdated.
    • Equal Temperament — the modern standard.
  • Internalize the sound of the two most common chord types: major and minor triads.
  • Appreciate the ubiquity of four-chord loops in songwriting.

Activities:

  • Build chords using each of the tuning approaches. Start with fewer notes and work up to bigger chords. Seek out beautiful sounds — which tunings make this easier or harder?
  • Use the volume sliders to further refine chords. In Pythagorean Tuning especially, you can meld several notes into a single sound by adjusting their relative volumes.
  • Discuss the mathematics of tuning — the logarithmic relationship of pitch to frequency, the concept of integer-multiple harmonics, and various puzzles of historical temperament.
  • Translate that math into code.
  • Play with chord relationships on the wheels. Which pairs of chords chords sound related and which sound remote?
  • Crystallize the findings of chord experimentation into a four-chord sequence.
  • Beef up the sequencer with better sound, more chord types, and tempo support.
Make an Instrument
Instrument
undefined

A template with code chunks to inspire your own custom digital instrument.

Notes:

  • Finish the course off with independent projects. Encourage students to build their own musical coding projects from scratch, taking inpiration from the earlier projects.
  • This project is just a combination of elements from earlier so that it can serve as a convenient jumping-off point for students who want to take some code snippets and tinker. Feel free to chop out big chunks of this project after forking, or to copy chunks into a new project.

Goals:

  • Build some kind of musical code-object — something like an instrument, a piece, or a game.
  • Present to or perform in front of the group and answer questions about the underlying tech.

Activities:

  • Fork this project (or the older projects) and focus on your favorite aspects, then build upon those.
  • Alternatively, start from scratch. Load in Tone.js and follow your ears and imagination!