Synthesizer Day 23

During this project, I realized my learning has been centered on just expanding on what I already know. So it’s time to break the ice! I need to learn new things and explore things beyond my knowledge. I realized that the thing I love most is creative coding. Those are the projects I enjoy, and the ones I have the least knowledge in. Okay, okay I know you’re all are like ‘Hey! We don’t care just tell us what you did’ sorry for my psychobabble…

For this days project, I want to explore Web Audio, so I followed  Stuart Memo course. And my gosh it was tricky but so much fun! The first thing was trying to get the browser make sounds and for that, I used Chromes console

And once my computer started generating sound, it was a glorified moment! [please ignore the console error, it made a sound. stupid me recorded the error *dope*] For the longest time now, I wanted to try to do a sound project and here I am making it generate sound mind you it’s just a beep, but a sound none the less.

This project was filled with learning moments from sound, frequency, Oscillator, and waves. Now when checking browser compatibility, it turns out it’s gaining some browser support

[note: guys I truly recommend you use ‘Can I use?’ to check if an element is compatible with a certain browser]. During the course, we learned how to make a synthesizer. So started off by structuring the site.

The started using the web Audio, but since I can’t record sound in gifs, you’ll have to believe me that sound is coming out. Then moving on to adding the keyboard. For this, I used this lovely library by the instructor himself which resulted in

Then started adding note frequency based on the clicked key, and removing it when the key is up. and it was lovely! The to visualize the waves we added a canvas to draw the wave

And Bam! This was amazing! A fun project where I learned about Audio, and what can I do moving on. Now I wanted to change the look a bit so


Still [meh] but a bit better. You can check out the project here. This was fun, and a learning experience. I guess that is it. See you tomorrow, till then, happy coding 🙂

0 replies

Leave a Reply

Want to join the discussion?
Feel free to contribute!

Leave a Reply

Your email address will not be published. Required fields are marked *