Home
Products
Community
Manuals
Contact
Login or Signup

Audio Visualisation - How to make it look fancier?

BlitzMax Forums/BlitzMax GUI Programming/Audio Visualisation - How to make it look fancier?

Grisu(Posted 1+ years ago) #1
Hello!

I'm trying to make a fancy realtime audio visualisation via FMOD inside a realtively small window canvas (i.e. 274x87 pixels).



Are there any tutorials / algorithms on how to anaylse audio in realtime and to make a visualisation or it?

Example (source, media and exe included):
http://188.165.211.46/~knot/prp/test.zip

Thanks in advance.
Grisu


Kryzon(Posted 1+ years ago) #2
Hi class, today we're gonna learn the visual importance of shape, color-schemes, gradients, background textures, anti-aliasing and post-processing filters such as 'Glow' and 'Pixelization':



Design a cool visual and then work towards making it real-time.
If you need reference, study the GUIs used by DAW (Digital Audio Workstation) software, such as MOTU's MachFive, Ozone, FLStudio and others.


Grisu(Posted 1+ years ago) #3
Thanks for these references.

What kind of code you used for the glow effect?

I have searched the forums for a working crossplatform "drawimagerect" code, but couldn't find one so far.


Kryzon(Posted 1+ years ago) #4
Hi Grisu. I've seen the update to your pocket radio thread - looking very nice!

The examples above were mocked by hand in Paint.NET. Using code would've taken an exorbitant effort.

You can do these filters realtime using OpenGL\DirectX shaders. You can go a long way just using shader model 2.0 which is compatible with hardware up to 2003.
It's a matter of rendering the graph to a framebuffer, performing a gaussian filter while copying it to another another framebuffer, then compositing the blurred version with additive blending over the original.

For reference, you can google tons of material:
http://developer.download.nvidia.com/SDK/9.5/Samples/samples.html#Glow
http://kalogirou.net/2006/05/20/how-to-do-good-bloom-for-hdr-rendering/
http://www.realtimerendering.com/blog/quick-gaussian-filtering/
http://rastergrid.com/blog/2010/09/efficient-gaussian-blur-with-linear-sampling/
(recommended keywords are "real time glow" and "real time bloom".)

You can also use anti-aliased polygon rendering to build smooth graphs like the ones from MachFive, and perform a myriad of effects on them.

Learning shader programming is paramount; the amount of effects you can do with this is more than enough to justify your investment in learning it.
Cya!