Submit your best music themed repls!

← Back to all posts
Muco ✨ - An interactive and meditative music generating particle system.
nik93 (4)

Muco ✨

An interactive and meditative music generating particle system.

Choose a key, add and remove different particle types and let the
real time sound synthesis tickle your ears.

Try it out on: https://muco.nik93.repl.co/ and create your own ever changing ambient soundscape.

Tested on desktop: Chrome, Firefox & Safari.

Muco?

Mu-sical Co-llisions: Muco. :)

Instructions

  1. Sit back, relax and listen.
  2. Add particles by clicking on the upper left portals.
  3. Remove particles by clicking on the lower right portals.
  4. Change the key and scale by toggling the upper right button.

Idea

I like the idea of generative music. The most interesting part of
generative systems are their input vectors and the transformations applied on them.

I find it really exciting to combine the simple physics based abstractions of floating particles with the composition and generation of music.

How it works

The particle system consists of four different particle types. Every type
is mapped to a digital synthesizer running live in your browser.

When two particles collide the corresponding synth plays a random note
from it's "note pool": A sequence of notes that are legal in the current key, scale and mode.

The synths are:

  • Atmo, yellow particles, lead sounds in the middle octaves
  • Air, purple particles, pad sounds a fifth below
  • Cloud, green particles, bass sounds three octaves below
  • Haze, warm white particles, lead sounds an octave above

Because the audio synthesis happens in real time the timbre of the composition changes over time as well.

Try to influence those changes by using specific particle combinations. :)

Tech

We use Tonejs as a wrapper around the Web Audio API and parts of p5.js/p5.collide2D for drawing and positioning of visual elements.

We decided against any frontend frameworks to keep the code lightweight. After fixing, or better: working around, some quirkyness of the Web Audio API (AudioContext we are looking at you 👀) we got it working across the latest versions of Chrome, Safari (macOS/iOS) and Firefox.

Who?

I made this project together with my partner Laila. We started to work in multiplayer mode but unfortunately it had some bugs (We look forward to the new multiplayer release :)). We just pair programmed our parts.

Laila worked on the particle physics and the design.
I worked on the audio synthesis, composition and effects.

Commentshotnewtop