What it does
MoodBeats turns how you feel into actual music. You type something like "anxious but hopeful, like something big is about to change" or tap one of the quick mood buttons, pick a genre, tempo, and instrument, and it composes a track for you. You get a chord progression, a melody, a title, a key, a BPM, and a short description of the vibe, all playing back live with a waveform that moves to the beat and chords that light up as they play.
How I built it
The whole thing runs in one HTML file with no installs and no external player needed. The audio is built from scratch using the Web Audio API. I generate every sound with oscillators instead of using audio files, so each instrument (piano, guitar, synth, strings, marimba) is its own waveform with its own volume envelope. The chords are scheduled on a timeline based on the BPM so everything stays in time, and there is a simple kick drum on the faster tempos.
The mood part reads your text and scores it across ten emotions like happy, sad, anxious, calm, romantic, and nostalgic using a keyword system I wrote. It picks the strongest emotion and pulls from a set of chord progressions, melodies, titles, and descriptions that fit that feeling, then adjusts the tempo and key based on what you picked. Because there are multiple options per emotion, you get a different track each time even for the same mood.
The waveform is drawn on a canvas and animates while the song plays, and the progress bar and chord highlights all sync to the audio clock.
Challenges I ran into
The biggest one was getting clean audio out of the Web Audio API. My first version had clicking and popping every time a note started or stopped. I fixed it by adding fade in and fade out envelopes to every note so the sound ramps up and down instead of cutting hard. Keeping the chords, melody, waveform, and progress bar all in sync was also tricky since they each update on different timers, so I tied everything to the audio context clock instead of regular timers.
What I learned
I learned how sound actually works at a low level. Before this I thought you just played audio files, but now I understand oscillators, frequencies, envelopes, and how a chord is just a few frequencies played together. I also got a lot better at mapping something fuzzy like an emotion onto concrete musical choices like a minor key for sad or a faster tempo for energetic.
What's next
I want to add the option to layer a real AI model to write the melodies so they are different every single time, let people save and share their tracks with a link, and add a proper drum pattern editor.
Built With
- css
- html
- javascript
- web-audio-api
Log in or sign up for Devpost to join the conversation.