3D in Flash
The first time I experimented with 3D flash is a very clear memory. I was young, and naive, full of hope and romantic dreams. Her name was Sandy.. 3D... 3.0, and she tempted me with her new thinking and careless and free download. I learned a lot about 3D from Sandy, and to this day, I reminisce of our beautiful times together. But sometimes love just isn't meant to be. The pressures of designs needing exact dimensions on displayed objects, vector graphics, and perfectly predictable placement of objects tore us apart. 3D just isn't how most designers design. They think they want 3D, but the moment something has lines that aren't perfectly parallel to the edges of the browser (as 3D often does) they are not amused. And let me tell you, telling an illustrator that he/she should learn 3D math so that they can predict how your program will display their objects when moved around does not go over well.
Elemental 4D
The Engine
On September 13, 2008, at the Michigan Flash Festival, I released Elemental 4D, a 3D engine designed specifically for use in real-life media applications. The response to the presentation of the engine was an absolutely overwhelming success, so I'm releasing it here on actionscript.org as well, to hopefully gain a slightly broader audience. It is free, and completely open source, and downloadable here:
Download / Documentation Page
For the technical among us, Elemental 4D is a fully forward kinematic 3D engine. Its transformation object holds easily accessible local and concatenated vector as well as euler angle data. And multiplication of tuples is handled via quaternions, hence the name 4D. It uses ZYX order euler angles in left hand cartesian space, the origin being the Flash object registration point.
For the less technical, it does lots of stuff and it does a good job of it.
The Goals
The initial goals of Elemental 4D are what make it completely different from any other 3D engine. The ideas were not traditional, not meshes, textures, nodes, or anything like that. Here they are:
  • Every 3D object should extend MovieClip, therefore be able to be used on stage in normal design environment.
  • Vector graphics must stay vector when rendering.
  • Keep normal Flash functionality. Events, methods, properties, display list, etc.
  • Objects with a Z coordinate of zero display exactly as if they were normal 2D MovieClips.
  • Full forward kinematics that can be used right on stage, 3D objects within 3D objects, also called containers.
  • Functionality that completely mimics normal Flash coding and design.
  • Simplicity of coding process. A scene can be put together with no code, one line of code can rotate it to show the 3D.
  • Elimination of cameras in favor of a stage. All camera functionality can be achieved by moving a container with the objects anyway.
  • The ability to incorporate other 3D engines (mainly Papervision and Away) into Elemental 4D scenes to have all their abilities as well.
  • An API that can be ported to Flash 10, which allows for more than just affine transformations (full perpective skewing).
  • As few classes as possible, as simple to use as possible.
  • Elimination of meshes and textures, normal Flash objects to be used.
Making a Scene
There are two main things you need to do to build a scene in Elemental 4D. One: you need to make a Stage3D instance. And two: you need to put 3D objects in it. It's a pretty simple concept.
You can do this in script, or you can just open up the linkage of a MovieClip, set its base class to the Elemental 4D class desired, and work with the objects right on the stage. Since the Z coordinate always starts at 0, and the when the 3D object is at a Z of 0, everything looks the exact same as in 2D, you can accurately set up the entire scene on the Flash stage. There are 6 properties on every object in the elemental4d.display package that are used for 3D. Since there is an x and y already representing the 2D x and y, I use X, Y, and Z, and for rotations, rotX, rotY, rotZ. None of these conflict with the normal Flash properties, and they will not conflict with any Flash 10 properties. The X and Y axis mimic Flash's x and y axis, and the Z axis gets closer the larger the value.
The elemental4d.display package
There are 16 total classes in the Elemental 4D engine. 2 are simple motion classes that are not necessary to the engine, and 4 are in the geom package where most people will never touch them. Of the 10 in the display package, the main 4 you need are Stage3D, Shape2D, Shape3D, and Sprite3D.
The Stage3D class is what you put everything in. Just treat it like any other movie clip that you are putting other movie clips inside of. I recommend that you put it right on the stage, and then set its linkage in the library to the base class elemental4d.display.Stage3D since it's just easier that way. I suggest you do the same for every Elemental 4D display class.
The Shape2D class is actually only a 2.25D object. It's a MovieClip that moves through 3D space, but doesn't rotate in 3D space, so it stays flat to you like a 2D object does. This is really great for media.
Note: The name Shape2D can be deceiving. The idea behind the term Shape is that it is the simplest of 3D objects, the way Shape is the simplest of 2D. That means it can't contain other 3D objects, but it does extend from MovieClip, it can hold other normal MovieClips, it can have timeline animations, and scripts written in it etcetera. That same applies for the Shape3D class I'm about to show you.
The Shape3D class is a 3D plane. It is a MovieClip that moves and rotates in 3D. This is also sometimes called 2.5D.
The Sprite3D class is a 3D container. You put any number of 3D objects into it, it acts much like a normal Sprite does for 2D.
Besides those main 4, there are a couple other classes you should be aware of. MovieClip3D and Face3D are two classes that go together. They were designed for building primitives. Since our Flash 9's affine matrices cannot show true perspective on themselves, we have to treat them different when they are in close proximity to each other. Fortunately, I took care of all that for you. The only thing you need to do when making a primitive is use MovieClip3D instead of Sprite3D for the container, and Face3D instead of Shape3D for the faces. They will act the exact same to you, but the rendering engine will know.
During the whole building of this engine, I was torn about something. The point of the engine was to not be a triangle/texture based engine. Yet that meant it could not take 3D models. I felt bad about this, and I considered making a class for geometry based 3D models. But I started to realize it was a bad idea. I would either put way too much time into something that is not even the niche of this engine, or only do it half way, and have it be worthless. But then I figured out a different way.
Some of you may recognize this as the Papervision PaperPlane primitive. In fact, it is. In fact, it's being rendered by Papervision, but it is placed in an Elemental 4D scene, and is being controlled by Elemental 4D, using Elemental 4D rotations and coordinate space.
This is a scene with 3 logos. The Papervision logo is being rendered by Papervision, the Away logo is being rendered by Away, and the Elemental 4D logo is being rendered by Elemental 4D. They are all in an Elemental 4D scene, rotating in the same container, kinematics intact.
I introduce Elemental 4D's ExtendedStage3D class. Through a simple translation object, most 3D engines can have their objects used by an Elemental 4D scene without any problems.
I encourage you to ask questions, and especially to look for errors. There's bound to be bugs in the beginning somewhere! And I promise to try to keep adding tutorials to the tutorials section.

(='.'=) <------ Mad Bunny Skills
Bryan Grezeszak | madbunny.us