To be soaked in its whispers

This is Mumu’s project documentation for The Code of Music, Week #2.

Showcase first!!

Unfortunately… I didn’t finish the visualization part. I wasn’t satisfied with the results so I decided to not implement it. But on the music side, results are satisfying! I guess the main theme (light rain) is still pretty prominent even without visual signals.

Inspiration

When we discussed about the layers of music, I was thinking about this track that follows a gradual, evolving structure, which perfectly resonates with a rain-themed piece I’ve been really into lately. Its atmosphere is ethereal and light, like a delicate drizzle falling onto leaves, glass, and fabric—gentle, steady, and immersive.

During my discussions with an LLM, I started thinking about how to sonically capture “a damp drizzle”—not just by using literal rain sounds, but by layering, filtering, and shaping the rhythm in a way that envelops the listener in rain.

How do you see the rain? Especially the kind of light rain—not a downpour—the kind where you could use an umbrella, but you don’t necessarily have to?

ChatGPT: Light rain exists in the space between presence and dissolution. Unlike a heavy downpour, it does not announce its arrival with force, nor is it as mild and inconsequential as a drizzle. It is a hesitation, a wandering, a state between dream and wakefulness.

To use an umbrella is to place a barrier between oneself and the rain, as if rejecting a silent invitation. To walk without one is to let oneself be immersed in its whispers, becoming part of the rain—like a sheet of paper slowly absorbing ink.

This kind of rain is made for walking, for thinking, for losing oneself in the blank spaces of the world. It blurs the city, turning it into an unfinished sketch. The streets are damp, the air faintly scented, and the contours of people are softened. It does not rush you to run, nor force you to escape. Instead, it gently asks: **“Would you like to stay a little longer?”

**It is like words left unsaid, like a dream just waking, like emotions yet to fully land. Its significance does not lie in the volume of precipitation, nor in weather forecasts, but in the way it slows your steps, lifts your gaze slightly, and reminds you that you are alive—a being softly touched by the world.

To refine this concept, I created a Mood Board filled with visual and auditory references that convey a similar feeling, helping me solidify the overall direction.

Sample Selection

I decided to work with a 75 BPM foundation and selected B minor samples that evoke rain, enhancing the soft and fluid texture. I also choose some bass, piano, ice crackling, and ocean waves, forming a layered and flowing soundscape.

Splice has student discount btw. It’s a website that is super useful for finding samples & no need to worry about copyrights.

PR Mockup

After an initial collage of samples, I settled on the following structure to build up the layers gradually. I ended up using only half of the original material to maintain a concise yet evolving progression.

First Draft

Second Draft

Final Structure

File name	Jump in at	Duration	Loop count
bass1.wav	3	4	2
bass2.wav	5	/	/
drum1.wav	1	1	9
drum2.wav	6	2	2
flute.wav	6	2	2
ice.wav	8	/	forever
piano.wav	2	2	5
rain.wav	0	/	/
waves.wav	4	/	/

1 unit = 1 duration of drum.wav (which is at 75 bpm)

This means different sounds fade in at staggered points, rather than entering simultaneously, and I can take control of them using the buttons. (The Jump in points are just for my own reference; they are not involved in the code. So it’s way more flexible and interactive.)

Coding

Quantized Playback

Based on professor Luisa’s code, I did some minor changes and now the code can support my Loop Count system.

simple demo ↓

Moody…

To make the track feel more like a “damp drizzle”, I found that a low-pass filter (LPF) effectively simulates the softness of rain, making the sound feel wrapped in moisture.

While exploring Tone.js, I found that its Filter library allows for frequency response control—this means I could gradually reduce the high frequencies, creating a misty, rain-like effect that feels like being surrounded by foggy precipitation.

I decided to incorporate a slider UI, inspired by class projects, to let the listener manually adjust the “wetness” level of the sound.

Implementation:

1. Created masterFilter (a Tone.Filter) and routed all Tone.Player objects through it instead of directly connecting them to toDestination().

2. Used a slider to control masterFilter.frequency.value, allowing users to shift between:

   • Clear (high frequencies intact, crisp sound)
   • Wet & Foggy (high frequencies reduced, immersive rain effect)

Result:

• Moving the slider left makes the music muffled, distant, and enveloping, as if standing inside a rainstorm.
• Moving the slider right makes the sound crisp and clear, like the lingering dampness after a rain shower.

Visualization

Hi…Long story short: I wanted to use this GLSL shader that I wrote this week for this assignment and successfully implemented it in p5.live.

However, integrating GLSL with music data took me a long time to experiment with, but I couldn’t get it to work as expected.

My idea was:

• Use low-pass filter values to control the wavering frequency of the water ripple.
• Use waveform data to determine the spacing between ripples.
• Playing instruments will increase the raindrops on the screen.

Here’s a demo of the shader:

I hope I can finish this part in the future!!!