Music Visualizer with Flash 10 3D effects


So I finally got around to setting up Flex 4 with FlashDevelop 3 and thought I would have a go at making another music visualizer, this time using some of the new features in Flash Player 10.

Setting up Flex 4 turned out to be much easier than I expected (was just a case of swapping it for Flex 3 in the FlashDevelop compile settings), and while you don’t get code completion for the new Flash 10 classes everything else runs fine.

While there’s lots of great new features in Flash 10, the one thing I wanted to try out was the new built in 3D transforms and drawing API. So I set about trying to make some kind of 3D sound tunnel, the aim was to get something that looked like an old Llamasoft game, although I’m not sure quite how successful that was.

Anyway, the code turned out to be surprisingly easy to write, it seems that Adobe have gone to some real effort to make sure that the new 3D effects in Flash 10 are as easy to use as possible. In many ways it’s actually quite similar to how Five3D works, you can rotate any display object on any axis, move the vanishing point of the scene and even adjust things like camera focus and field of view, although as far as I know you cannot actually move the camera itself.

While this is all great, there are a few limitations to these new 3D effects as Keith Peters has pointed out in his posts about the visual quality of 3D in Flash 10 and the effect this has on nested display objects with 3D transforms. Some of this, such as the lack of anti-aliasing, you will be able to see in the demo below.

Despite these issues, I think the Flash 10 3D effects will come in very useful on some future project where low file sizes and simple code might be more important than higher visual quality.

Check out the demo and source code below, as usual the music (or you could just call it noise) was made using the Hobnox AudioTool ToneMatrix, which is their version of the Yamaha Tenori-On.


Click here for demo and source code


Leave a Reply

Please log in using one of these methods to post your comment: Logo

You are commenting using your account. Log Out /  Change )

Google+ photo

You are commenting using your Google+ account. Log Out /  Change )

Twitter picture

You are commenting using your Twitter account. Log Out /  Change )

Facebook photo

You are commenting using your Facebook account. Log Out /  Change )


Connecting to %s