Web Spectrogram using your Mic
borismus.github.io
borismus.github.io
But I found that learning about the types of models and how to actually train them to be the hardest part of this area.
Demonstration of this being done: http://arss.sourceforge.net/examples.shtml
The spectrogram image contains amplitude, but not phase information. (There are partial exceptions in special cases involving oversampling.) Conveniently, the human auditory system is primarily sensitive to the same information present in the spectrogram.
I have been told audio -> FFT —> audio (the kind of standard audio compression/decompression algorithms we use) lose that phase information and we can't tell.
I have been told the "phase information" is the imaginary part of the complex numbers that are involved in an FFT.
Click waterfall, and then click play when you have the audio on your computer playing outloud.
If you play the audio outloud, your mic should be able to pick up a barely recognizable version of the picture (try the heart first to calibrate the "row delay").
https://github.com/braeden/waterfall
Take a look at the example pictures on github ^, poor, but functional fully web version.
(index):27 The AudioContext was not allowed to start. It must be resumed (or created) after a user gesture on the page. https://goo.gl/7K7WLu
There are also warnings about mixing insecure content, specifically the non-https version of Google fonts.
(that's also why expensive studio monitors cost so much - the "this song sounds good on any type of speakers, from in ear-headphones, to cheap car radio speakers, to pro headphones to on cheap television", master once listen/play everywhere, used to be a big problem in the audio world. (it might still be, but I left that world -- consider the cheap car radio speakers as the Internet Explorer 6 of the audio world and you get the idea!)
But it's very fun in Chrome! :)