I must say that at the moment I know almost nothing about 3d, and I’m starting with the beginner tutorials. So far I’ve seen three flash 3d engines:

Away3D – a powerful, widely-used and good looking 3d engine, free to use.
http://away3d.com

Papervision3D – a clean, fast, popular 3d flash engine.
http://blog.papervision3d.org/

Alternativa3D – probably the most powerful 3d engine in flash, created by russian programmers, which is still in development. However, it won’t be free.
http://alternativaplatform.com/ru/alternativa3d/

That’s it for now.

Have a nice day everyone!

I just wanted to test the (newly available in AS3) 3D Physics engine Jiglib.

My first test for Box2d was to build a Jenga-style game (Jonga) so I thought I would do the same here. Only a quickie this. I wanted to see if Jiglib would be able to allow ‘rigid boides’ in a 3D environment with good performance. I know we are limited in Flash so was prepared for a few foibles.

Jiglib has been put to great use in other formats so I had high hopes for its Flash port.

Now I have only given the library 3 or 4 hours of play but my one major probelm so far is the frame rate hit. In Jonga3d I have had to reduce the number of blocks to 15 (5 layers – I wanted 15 (45 blocks)) and I am still only getting 6fps. I was really hoping for more.

I’m not complaining too much, a 3d physics engine is a complicated library to pull off – I’m just waiting for the day I can build an unfettered 3d environment with a workable physics engine.

Jiglib has a few other problems – the jiggling static box for example – but these are understandable for v0.25

Testing Jiblib: Jonga3D

In the test I didn’t get around to implementing the mouse drag interactions so to see a collapse use the arrow keys to control the sphere – ram it into the stack.

I am using Jiglib 0.25 – Away3d version and Away3D 2.3 (Link)
I use SwfProfiler to track the fps.

Source:
Jonga3D
Source

Thanks to SleepyDesign for getting the ball rolling on this.

Tiene rato que Away3D se ve poca madre, pues bueno, su nueva versión no nos decepcionará!.

El único problema que le veo?… NO TENER TIEMPO para poder jugar más con esta herramienta!… he he he. Espero que llegue pronto un proyecto pagado en 3D que justifique meterme 100%. Por lo pronto todos ustedes: disfruten!.

It seems as though I’m trying to work out the odds of all the dice throws. I’ve been going through all the variations in making a normal map to suit my dice in the away3d scene. I’ve eventually succeeded in getting a version that works out of 3dsMax. Harder than I thought it would be, but maybe I should have thought through the maths rather than just guess at the right checkboxes.

This is my resulting test, with a correct version of the dice and the old version for comparison. It shows the effect of getting it slightly out. The die on the right has the wrong shading at certain angles. Use the arrow keys to rotate them.

The problem with my attempt at getting a normal map for the dice was that I asumed that I just needed to create the object space version of the map. Sounded simple, but then I found that the render in away3d didn’t quite work with any of the variations. The effect was that a face of the cube, when rotated around its perpendicular, would change the lighting that it had. It should stay constant. Because of the normal map being wrong, the rendering system thinks that the face is pointing in a different direction and so should change lighting as the object rotates around. I needed to investigate further.

Being a dice, the easiest way was to use Photoshop to cut and paste the different sides until we got the correct result. Then all (?) I had to do was to get the same rendering out of 3dsMax. It took a route through all the variations of LocalXYZ which should give an object space normals map. None of those variations fitted. World space is just the same, because my object is sat around the origin; X, Y and Z axes are the same for both. So I then tried Screen modes. After several combinations I discovered that turning the front view around by 180 degress gave the result that I was looking for. I finally had a normals map that worked with away3d. The following pics show the colours required by faces whose normals point along the 3 axes. Faces at other angles would be on a graduaton between them. The first image is the LocalXYZ normal map that I first tried; the second image is the correct version.

So a few points to note,

If it’s of any use to anyone, the last picture is an image of the cube within 3dsMax as I created the normals map. It’s front facing but rotated around 180 degrees. Is that because of the Z-up in Max, compared to the Y-up in away3d or Papervision. I don’t want to take the time to think about the maths too much at this time of night.

[Edit - If you're into normal maps in away3d, do look at Fabrice's blog. He's the one doing the clever stuff underneath.]

[Edit - I've added another post to take this further, where the map is working correctly - Jan 09]

Over Christmas, I’ve had some time to try and set up a demo for away3d using the Normals mapping that has been added recently. This is the dice demo that I ended up with. Not perfect lighting yet; if the top face stays in position and you rotate the cube on its axis, I thought that the face should remain lit the same, but it darkens as you rotate. I shall work on the code or my normals map a bit more. Arrow keys will turn the die; click and drag to hover around. Not bad for only 12 triangles though.

I had created a map a while back, but have been having trouble getting my model out of 3dsMax. I had a cube from Swift3d which worked perfectly, although it didn’t have the correct uv mapping for the textures. I have Max version 2009 and was trying to use the Collada export as standard. This didn’t seem to want to export in a form that away3d was looking for. I couldn’t see a trianglate option on the interface and I’d read that away3d only dealt in triangles. After using the ‘check for updates’ option, I found there was a new version of the exporter from the Autodesk site. This interface now has the triangulate option,

That didn’t seem to fix my problem, so I went of to the feeling software site to use their plugin. Unfortunately, this plugin is compiled for an earlier version. I did try and install it into the plugins folder and modified the registry to let it find the right location, just to give it a chance, but iin the end t threw up an error and wouldn’t load. After a bit of searching around, I found someone that had found a compiled version, see this thread or the zip file on irdonohue’s site. This gave me a good install and their plugin no showed up on the Export As… menu.

This worked fine and gave an xml file with triangles, as expected. I exported my cube of twelve triangles and had another go with away3d. It still didn’t work but I came across an earlier post talking about scale of models. Once I had rescaled my object to be much smaller, it appeared in the display and was textured correctly. Did I have to do all that fiddling about? I thought that I needed a node called ‘triangles’ in the xml, but maybe not. The xml produced by the max exporter gave triangles but in a ‘polygon’ node. It’s all about having confidence in the workflow tools, so I’ll probably stick with what I know works.

If you’re interested in the xml, (which I look at with the great little free utility XML Marker from symbolclick), these are some of the formats,

Swift3D has a format containing triangles,

Max standard FBX output gives triangles, but still calls them polygons and outputs each individually,

Feeling Software give similar to Swift but with three values for each point, for point, normal and uv,

added this later… Swift is worth a look at if you’re using simple model shapes and want a cheap way of doing animations. It has a similar timeline to Flash and is easy to use by the non-programmer. I’ve used it for simple animations and straightforward spinning around of an object. It also outputs a full Papervision set of classes, which could be used in away3d with some adaption.

Another link to look at are the series of tutorials from tartiflop. They have some interesting ideas and code to go with them. Really useful, go and have a look.

Hope someone might find this useful.

[Edit - I've added another post to take this further, where the map is working correctly - Jan 09]

Managed to squeeze in some time to practice my 3d in Flash. I put together an example of an aeroplane on a flight path. It forms the basis of what might be done if we were to get the job of taking positional data from an aerobatic plane and putting it into Flash for some interactive experience. The company that I was talking to have put sensors in the planes to give back data such as position, speed, rotation in space, G forces etc We might have a go a taking these in live to a Flash based browser system.

This is what the test looked like. Click to go to the Flash version. Use the arrow keys to zoom in/out or pan left/right. I went on the Away3d talk with Rob Bateman a couple of weeks ago and this example is based heavily on the example code that he gave us; in this case the sky box, mixing textures etc. (I would thoroughly recommend the course, by the way). I spent a while looking around the web to understand the maths behind the Flash beziers. All the paths in Away3d are based on these quadratic splines. Each curve needs to have a start point, end point and a control point. The spline curves that I’m used to are the quadratic type and are a bit easier to manipulate (or at least I have the code from previous projects). I was struggling with the creation of the path, using the format,

flightPath.push(new Number3D(0, -200, 0), new Number3D(200, -200, 0), new Number3D(500, -200, 0));
flightPath.push(new Number3D(500, -200, 0), new Number3D(600, -200, 0), new Number3D(1000, -200, -400));
flightPath.push(new Number3D(1000, -200, 0), new Number3D(1000, -200, 300), new Number3D(1000, -200, 500));

The last point of each curve is the first of the next, but I was definitely finding it hard to fill in control points based on the individual end points. It took me back to de Casteljau curves and drawing cubic splines and I spent a couple of days trying to work out the maths for the Flash quadratic curves. A useful page to help understanding is an old one from Timothée Groleau Eventually, however, I stumbled upon the the smoothing routine built into the Away3d library. Someone has obviously been there before. I must remind Rob to tell people about that. The lines then become easy; just define the end points and the smoothing fills in the rest,

flightPath.push(new Number3D(0, -200, 0), null, new Number3D(500, -200, 0));
flightPath.push(null, null, new Number3D(1000, -200, -400));
flightPath.push(null, null, new Number3D(1000, -200, 500));

The system will figure out to copy the last point from one curve to the first point in the next and will fill in the control point to suit. Phew. This is so much easier. When creating a flight path, just do,

trackPath = new Path(flightPath);
trackPath.smoothPath();

and everything works a treat. The plane is just a quick obj from 3dsMax. I’ll try and put a texture on it, if I get a moment. I need to work out how to do the banking angles next.

Had a really enjoyable day with Rob Bateman, dicussing how to use Away3d, the 3d implementation for Flash/Flex. I can thoroughly recommend the investment; we covered all the basics and several of the advanced techniques of getting 3d into Flash, without too much heavy theory on either the 3d or the javascript sides.

Away3d has become a major branch from the original Papervision software, but it has moved on quickly and has produced code that is now being ported back to Papervision now. The groups, with Sandy as well, seem to exist on the basis of lets see what you can do next basis. Papervision might be more publicised, but Away3d has a reputation for being more practical. Having had teaching from both Ralph and Rob, I’d say that the Away3d was easier to get into. This might be becuse I did Papervision early in the year and so I have become more used to the ideas by now, but I’ve had 20 years of 3d graphics in television, so it must be sinking in by now. I think what swings me towards Away3d is the demo with normal maps.This should give the appearance of much more complicated models using lighting/rendering tricks. They make a big difference in games and will do the same in Flash and Flex.

The models I tested beforehand were Collada, from 3dsMax. It seems that these are quite complex and not everyone treats the model data in quite the same way. This means that they can be a bit flaky and are definitely slower than the md2 models being shown in the demos. Md2 is a format from Half Life by id Software, and has been commonly used in some of the older games of that era. It doesn’t have bones in the way that Collada has; it stores frames of the mesh in a sequence of their animated positions. Harder to create, but quicker to playback. The tools for collada are now more common, especially since Google supported it with SketchUp and Adobe are supporting it with Photoshop now. However there is an exporter for md2 from 3dsMax from QTip. I haven’t used it, but I’ll probably give it a try. Dave Stewart, who was also there on the day, is a Max Script junkie and he also tidied up a version of a script found with Google. He may put it up on his site, with a few additional facilities. It’s worth looking at both options probably.

From my efforts with my dice model I found that I needed to add a light to see the bumps, and then I discovered that I was using the wrong type of normal map. 3dsMax by default, gives a tangential normal map, whereas Away3d need one from the object space. Visually mine has the mixture of pinks and purples, where as an object space version has much more colour, obviously lined up to the directions from the model.

Flash 10 seems to promise some improvements. The texture mapping should improve on the problems with affine texture maps, although the routines for automatic triangulation of detail are working well. (So well, that Papervision have also included them). There will also be more filter effects and we can look forward to doing things like Depth of Field using the LOD calculations. Scaleable Vector Graphics will be there, as well as the ttf font parsing.

Next for me will be to get my dice working with the Wow physics engine, or by using Tweener or TweenLite perhaps. Then I need to fly an aeroplane around….must get back to work…

With a view to being on the Away3D seminar for a couple of days, I decided to look at making a normal map. I use 3dsMax and quickly found a tutorial at http://www.game-artist.net/forums/spotlight-articles/43-tutorial-introduction-normal-mapping.html

Did all the modelling parts. All OK except for no display in the viewport. Couldn’t find the checkbox. I’ll have another look later.

To add from Photoshop layer, downloaded the nvidia Photoshop plugin from http://developer.nvidia.com/object/photoshop_dds_plugins.html Then appears as a filter.

Went to the Feeling software site, http://www.feelingsoftware.com/component/option,com_docman/Itemid,80/lang,en/
where I could download the plugin to allow me to dump out the collada dae model from Max.
It told me to download the nvidia cg software first, so
http://developer.nvidia.com/object/cg-toolkit-15beta.html

That installed OK and also … saw that the book CGTutorial is now fully available online as a series of web pages. If you’re into that
http://http.developer.nvidia.com/CgTutorial/cg_tutorial_chapter01.html You’ll find it useful, I think.

Install didn’t work because I have 2009, not 9. Tried to copy the whole directory to ‘3ds Max 9’ etc but no success. Install still fell over. I need to compile (!) and install manually.

Maybe I’ll try later, as I only have a cube to do. I’ll do it using the built in Autodesk DAE exporter. Need to adjust the UV mapping parameters. Not bad for a six polygon object tho’.

Some time ago Bartek Drozdz has started cross-engine modifiers project, as3dmod. Using as3dmod is ridiculously simple. All you have to do in order to apply modifiers to your mesh is 1) make modifier stack object for your mesh, 2) add modifiers of your choise to that stack, and 3) call its apply() method before rendering your scene. Neverless, it is always nice to have an example.

For this purpose, I digged out old Away3D boobies demo and added two Bloat modifiers to it. Ever wanned to be a plastic surgeon? Then check out this thing, and its complete code

After messing around with away3D, i am second guessing how suitable it is.  It appears to me that away3D is really meant for 3D flash games.  So, I have decided to try out Papervision3D.  There are many existing websites that use this technology.

Here is the blog for developers : Link

I have seen some amazing sites with pv3d. I’m excited.

If you are exporting from blender to actionscript directly so you can get your models into flash as script you can use the Blender to .as3 exporter which so kindly supports all flash 3d engines currently Away3D, Papervision3D and Sandy3D.  Dennis Ippel made the Blender exporter a while back but the update supports papervision 2.0.

• Post on the exporter and how to use
• Sandy 3.0 Example
• Away3D Example
• Papervision3D 1.7 Example
• Papervision3D 2.0 Example
• ActionScript 3.0 exporter at the Blender wiki

The benefits of COLLADA are nice but there are so many differences that you can run into trouble.  With the exporter it is a direct faces and vector export without all the bloat of DAE/COLLADA xml.  This works if you are only developing for flash and dont’ need to use the models in other platforms/systems/engines that aren’t in flash.

Found a terrific Flash 3D engine.  Tried a few of their demos and check out bits of code.  Very nice.  Now I need to find a way to hack this into Flex.  Fun!

Away3D’s Link

Last week i’ve posted a web roundup article regarding Flash 3D Engine called Papervision 3D. This time, i will be showing you more cool articles but about another awesome 3d engine called Away3D. You can find more about them at their official site.

Starting up with Away 3D

Setting up Away3d with Flex

Getting Started with Adobe Flash and Away 3D

Away3D Basics - The Camera(s)

Away3D Basics - The View and the Scene

Create the Earth and heavens in less than an hour with Away3D

Intermediate / Advanced Tutorials

Away3D Animator class tutorial

Away3D Surface Tracking tutorial

Away3D Fog filter tutorial

Away3d experimenting with light and shading

Multiple views and Masking in Away3D

Cool Demos with Source

Marble Atom

ImageViewer3D

]]>