[kml_flashembed movie="wp-content/070522/BLITZ_Papervision_UI_DEMO.swf" height="384" width="512" /]
Browse by clicking the album art above. Click selected album to flip and see video.
We recently took a stab at doing an iTunes like UI in real time 3D with Flash using Papervision3D. Even with such a fantastic code base in our hands the challenges of making something usable in a 3D world seem very daunting at first. But I’m very excited about this new frontier in web development and was eager to just dive in and make something.
The first real road block was discovering Fuse Kit was not yet ported to AS3. I had come to rely on it for all of my programmatic tweening. At first I tried using the Flash Tween class , but it ended up taking many lines of code to do simple movements in 3D. A friend of mine turned me on to Tweener, and it is awesome. I love it. In one line of code I can transform all of the properties on any object and get a host of useful call back events that I can assign methods to. It made animating in 3D with code quite a pleasure.
In this one line of code we tween the x, y, z, and the rotation of all three axis in one shot. The
variable is a string that specifies which particular easing equation is to be used. The Tweener object is implemented in a Singleton style so it’s always immediately available to start adding tweens, and again, Tweener Is Awesome!
With the addition of the new animated property in the MovieMaterial Class getting an FLV to appear on the back sides of the album covers was a snap.
UIMaterial.doubleSided = true;
UIMaterial.animated = true;
Or if you want to update the FLV at your discretion you can do this instead:
is a feature of the
, and it’s
subclass that allows you to decide when you’re texture is updated by taking a snap shot of your MovieClip based texture at anytime and dynamically updating all of the models that are using it.
Be sure to check out http://blog.papervision3d.org/ for more info on this great code library!