3D transitions

Please note that this is barely more than a proof of concept, don't copy-paste the code in a real project because I haven't tested it much, plus I have very little 3D experience. More than ever, use at your own risk!

[/LAME DISCLAIMER]

One of the benefits of being a freelance is that between projects you get some free time and once you've run out of fresh episodes of Scrubs and new entries in Google Reader, you feel guilty of being a lazy ass and then you have to go the computer and code stuff. This is the result.

Don't know exactly where I saw a nice 3D transition in a video and thought "that looks cool, I should be able to do that using Papervision".

*** THE IDEA:

1) Create a one-line-of-code-extremely-easy-to-use library of 3D transitions for DisplayObjects (images, text, whatever).

2) It should be pretty easy to extend so any programmer without much knowledge of 3D can create custom transitions.

*** THE PROOF OF CONCEPT:

You can see it working here. I've achieved #1, this is the code you need to create the transition (once the image has been loaded):

[code lang="actionscript"]Transition3D.Wadus(loader,10,10);[/code]

Simple, uh?

The big deal though is #2, make it easy to extend. You can see the initial code in the SVN, the important stuff happens in Transition3D.as. The code should speak for itself, but probably doesn't, so again the idea is:

1) Provide a method that you feed a DisplayObject to and returns a BasicView instance (that has embedded viewport, renderer, scene and camera) plus an array of planes, each of them with a slice of the original object.

2) Once you get the 3D scene in place and a reference to the pieces, it's your time to shine. I've done 2 very simple animations using GTween just to prove the point, but you can go as wild or keep it as simple as you want or need.

-----

Now there would be a million things to do:

1) Being able to pass a BasicView instance because you don't need a new 3D scene for each image. Reusing a scene would save performance.

2) Create a ton of different transitions and be able of parametrizing them further than the number of columns and rows. Also there is no reason to keep it square, could we do awkward shapes?

3) Make it dispatch events so you know when the transition has finished or at which point it is. Thinking about this, might be worth extending GTween directly?

4) I'm using PPV at the moment but for no particular reason, is it worth putting in place some architecture to allow other 3D engines such as Away3D?

5) Review the process from a 3D expert point of view, maybe I'm doing nonsense craziness.

From here onwards I really don't know what to do. As I say, I'm by no means a 3D guy so I'm probably not the one to move the project forwards. Anyone interested? I'd more than happy to put the code in an independent library outside ZCode if that helps.

And last but not least, thanks to both XLeon and Cay for helping me out : )

Back to index