Antti Kupila

Personal Blog, Portfolio and Online playground

View over the green room at Sid Lee, Montreal

Flame – 3D music in Actionscript 3

A couple days ago i happened to stumble upon a really cool 3d engine called papervision3d. It’s been out quite some time already, and i’ve heard of it before, but i’ve never really gotten to it to actually play around with it. Well, no i have – and boy, i love it. It’s amazing! Huuuge props to Carlos Ulloa + everybody else who have contributed to this magnificent open source project.

This also gave me a reason to get back and play with as3 a bit again. Due to loadsa other stuff it’s been a while and i had already forgotten how great it is compared to as2 ;) Actually it’s not so nice working with projects in as2 anymore, but you’ve gotta do what you’ve gotta do ;)

Anyway, flame. Or well, yeah, that’s what i wanted to call this experiment. Codename: flame maybe? Either way the first time i iTunes‘ CoverFlow i really liked it. In general i love pretty much everything Apple does visually, and CoverFlow was no exception. So i got my dose of inspiration pretty easily. Also papervision3d is so amazingly easy to work with (compared with the results) that i just had to sit up way too late a night or two, doing some nifty demos. At the same time we also had this technology specialization module at school, where we were supposed to do some technological individual project, so this fit in pretty nicely. I heard of the deadline pretty close to 24h before :)

Well, you probably wanna see what i did? Sure.
As it’s written in actionscript 3 the Flash 9 player required. A fast computer is recommended.

Click to see flame live!

So, what is it? When you start it, it asks for an artist. Type in something you like and flame will find similar artists, that you probably also will like. You can then browse the artists in a cool 3d interface using the arrow keys. The amount of artists is limited due to performance issues. Also the images look like crap because of the original low resolution (about 160px), sorry for that.
All the data comes from last.fm, thanks! :)

When you find a cover image that seems interesting, why not listen to a song or two? Alrighty, just press the up arrow (or enter) and you’ll enter listening mode, where flame will play short samples from a couple songs. If it’s all quiet, a sample for the artist you’ve chosen doesn’t exist (yeah i know, could maybe have some indication .. but hey, the version number is 0.1.1, can’t expect miracles). There are also a couple known bugs and probably several more that i don’t know of, but i’m guessing you understand this is just an experiment.

As probably everybody who has worked with flash and external data knows crossdomain.xml is a bitch. I created a simple php script that acts as a proxy for the data, allowing flash to load the files (this means that every single image goes through my server, even if it comes from last.fm). Another pretty cool thing was the music. Last.fm doesn’t provide links to the mp3 files, so what i do is send the link to the artist’s page on last.fm to another script, which will screen scrape the page, find some stuff i need and out of it figure out what the url to the mp3 is. Works like a charm, as long as the artist has streamable music :) Big thanks to Joel Larsson for helping out with this one!

That’s about it for an introduction, go play with flame and feel free to leave a comment or two.

Oh, before you ask:
Yes, the sourcecode will be released as soon as i’ve cleaned it up a bit and tweaked a couple small things ;)

Update: the source is available here

I hope you get inspired enough to do your own cool demos with papervision3d