Concept
Harmonic Market is a fun interactive project I built in p5.js. It takes real-time crypto prices (Bitcoin, Ethereum, or Solana) and turns them into sound and light. I chose exactly this idea because I am a finance major and very passionate about crypto. The main idea is quiet simple: the market has its own voice and you get to decide how to listen to it. Instead of just staring at numbers on a chart, this project lets you actually feel what the market is doing through sound. What does a calm market sound like? What about a super volatile or crashing day?
When you use it you become like a performer. You move your mouse around the screen to tune in to the market. Moving left and right changes how nice or tense the sound feels, it can sound smooth and beautiful when you’re in the right spot, or rough and weird when you’re not. Moving the mouse up and down changes how loud and intense everything gets. The live market data controls the base pitch and how wild the sound is, while you control the harmony on top of it. Every session sounds different and every market condition feels completely unique.
Pictures
How does the implementation work?
I mapped the mouse controls to musical ideas so it feels natural. Moving the mouse left and right changes how “in tune” the sound is. When you go left, the sound gets very tense: noise gets louder and the waveform on screen starts shaking. When you move right, everything snaps into nice harmony: the wave smooths out and green particles float up from the center. It just makes sense to me: left = tension, right = resolution. Moving the mouse up and down controls how loud and intense everything feels. Up = louder and bigger visuals. Down = quieter. If you hold SPACE, it gives a temporary 50% boost and makes particles orbit.
I made the feedback to be strong and responsive so you always know what’s happening. There’s a harmony meter on the left and an intensity meter on the right that show live numbers and colored bars. The labels “DISSONANT” and “CONSONANT” fade in and out depending on where your mouse is. I also replaced the normal cursor with a growing circle that gets bigger when intensity is high because it feels more like playing an instrument than just pointing.
How This Was Made
The whole idea and main structure came from me. I wanted to make financial data feel emotional and musical instead of just showing numbers on a chart. The concept of using mouse X to control consonance/dissonance was my original idea since I got very inspired by how people talk about markets in musical terms.
I used separate functions:
- drawOrb() — draws the glowing center orb that pulses and reacts to market volatility
- drawWaveform() — draws a three-layer wave across the screen that shows the harmony
- drawConnectorLines() — draws lines from your mouse to the orb (more lines = more harmony)
- updateSound() — controls the three oscillators and makes the sound change smoothly
- spawnAndUpdateParticles() — creates green sparks when it sounds good, red when it sounds tense
- fetchMarketData() — gets live prices from CoinGecko every 9 seconds
So, I wanted to smooth the mouse movement so the sound and visuals don’t jump and I had a very hard time with it, so I used ClaudeAI in lines 97-102. Also, I used ClaudeAI to make the harmony sound much more musical and intentional. It picks a musical interval from the scale based on mouse position, then multiplies the base pitch by that ratio (lines 107-114).
What I’m Proud Of
I’m most proud of the left/right harmony mapping. It’s not just turning volume up and down, it actually changes the musical relationship between the sounds, and you can really feel and see the difference. When you’re far left it feels chaotic and clashing. When you’re far right it feels calm and beautiful.
I’m also happy that it’s pretty easy to understand without reading instructions. The intro screen explains the controls clearly, the meters give constant feedback, and most people figure out the mapping within about 30 seconds.
Areas for Future Improvement
There are a few things I’d like to add later:
- Use more market data (like trading volume or market cap) to control reverb, rhythm
- Add touch support so it works nicely on tablets with two fingers
- Maybe let the user sing into the microphone and have the market data affect their voice instead of just synthesized sounds
Live Demo:
Click inside the frame to start • Move mouse to harmonize with the market