Flare3D Vs Away3D in the creation of a simple game

February 14, 2011 • 3D, Actionscript 3, Flash, Game design by Emanuele Feronato • 26 Comments

If you followed the blog during the latest days, you probably know about the Sokoban prototype made with Flare3D and Away3D.

I was making the prototype with Alternativa3D and Papervision3D too, but I dropped both engines because they can’t compete against Flare3D and Away3D.

It’s time to compare the engines, to see which works better, for the purpose of making a simple game. If you are looking for benchmarks or killer applications, then this is not the post for you. The web is full of such benchmarks.

I am comparing the engines using different parameters, such as ease of use and learning curve.

This comparison has been made after only a couple of hours spent messing with the engines, so take it as a beginners’ guide to choose the best Flash 3D engine.

INSTALLATION

Since the first thing you have to do is install the library, let’s start from the beginning.

Flare3D: you need to register to download the swc file.

Away3D: just go to download section and get all libraries.

What’s better: I prefer Away3D because I think dealing with as files is way better than doing it with swc files. The reason is simple: if I have doubts about a method, I can browse the source code. Also, as files encourage users to improve the library, adding their own classes.

DOCUMENTATION

Once downloaded the library, it’s time to look at the documentation to start our first project.

Flare3D: the official tutorials explained everything I needed to create the entire prototype. I did not have to look elsewhere.

Away3D: the tutorials section mainly hosts links to external tutorials, most of them outdated. As an example, some tutorials refer to Number3D class which has been removed from the latest Away3D version, which now uses Vector3D. Also, the examples aren’t much more than a snippet of code.

What’s better: Flare3D. You can learn a lot from the official tutorials.

SHADED MATERIALS CREATION

To play with basic light effects, we need to create some shaded material

Flare3D: these are the materials I used:

private var floorMaterial:ShadedColorMaterial=new ShadedColorMaterial("",0x000000,0x888888);

private var wallMaterial:ShadedColorMaterial=new ShadedColorMaterial("",0x000000,0x880088);

private var goalMaterial:ShadedColorMaterial=new ShadedColorMaterial("",0x000000,0x00ff00);

private var crateMaterial:ShadedColorMaterial=new ShadedColorMaterial("",0x000000,0xff0000);

private var playerMaterial:ShadedColorMaterial=new ShadedColorMaterial("",0x000000,0x0000ff);

very easy as you can see, the first parameter is the name (which you won’t use), the second the ambient color and the third the diffusion color

Away3D: these are the same materials:

private var floorMaterial:ShadingColorMaterial=new ShadingColorMaterial(0x888888);

private var wallMaterial:ShadingColorMaterial=new ShadingColorMaterial(0x880088);

private var goalMaterial:ShadingColorMaterial=new ShadingColorMaterial(0x00ff00);

private var crateMaterial:ShadingColorMaterial=new ShadingColorMaterial(0xff0000);

private var playerMaterial:ShadingColorMaterial=new ShadingColorMaterial(0x0000ff);

it works in the same way, but you can define just the material color if you want.

What’s better: both engines are simple

SCENE SETUP

Time to prepare the scene to render the game

Flare3D: look how do I create a scene:

1	scene=new Viewer3D(this);

Away3D: things are a little more difficult here:

view=new View3D({x:320,y:240});

addChild(view);

theCamera= new SpringCam();

view.camera=theCamera;

var light:DirectionalLight3D = new DirectionalLight3D();

light.direction=new Vector3D(CUBESIZE*10,- CUBESIZE*6,CUBESIZE*4);

view.scene.addLight(light);

I had to add the scene, a light (or your shaded material will be rendered completely black, since there isn’t a default light) and a spring camera. I needed the spring camera to create the 3rd person camera which follows the player. The lack of updated tutorials about the spring camera made me go through a lot of tries before I got everything working.

What’s better: I loved the simplicity of Flare3D.

LEVEL CREATION

Once the scene has been created, I added the cubes to build the level.

Flare3D: this is how I added a wall:

cube=new Cube("",CUBESIZE,CUBESIZE,CUBESIZE,1,wallMaterial);

cube.setPosition(CUBESIZE*j,CUBESIZE*3/4,CUBESIZE*i);

scene.addChild(cube);

You can set the position, the material and the size of the cube in a few seconds.

Away3D: and this is how I did with Away3D:

1 2	cube=new Cube({material:wallMaterial,depth:CUBESIZE,width:CUBESIZE,height:CUBESIZE,x:CUBESIZEi,y:CUBESIZE3/4,z:CUBESIZE*j}); view.scene.addChild(cube);

Position, size and material of the cube have been created in seconds.

Both engines place the pivot point of the cube in its center.

What’s better: Both engines are easy to use.

PLAYER INPUT

Although keyboard input can be managed by both engines with KeyboardEvent.KEY_DOWN, Flare3D provides Input3D class to handle (also) keyboard events. To check for UP arrow key you just need to write:

1	if (Input3D.keyDown(Input3D.UP)) { }

This is useful although no critical, but just for your information Flare3D does it.

CUBE ROTATION

The player can rotate clockwise and counterclockwise by 90 degrees.

Flare3D: this is how you rotate a cube around its Y axis:

1	player.rotateY(playerRotation);

being a method, you have to call another method (getRotation().y) to get the rotation.

Away3D: things are a bit simpler with Away3D:

1	player.rotationY+=playerRotation;

the same property can be used to set and get player rotation.

What’s better: there’s not that much difference, but I preferred Away3D‘s property approach.

CUBE MOVEMENT

One thing a 3D engine must do is moving an object in a three dimensional environment.

Flare3D: to move the cube according to its angle, I used this code:

switch (playerAngle) {

case 0 :

movingCrate.translateX(playerMovement);

break;

case 90 :

movingCrate.translateZ(-playerMovement);

break;

case 180 :

movingCrate.translateX(-playerMovement);

break;

case 270 :

movingCrate.translateZ(playerMovement);

break;

}

the cube is translates along an axis according to the angle it’s facing.

Away3D: basically the concept is the same:

switch (playerAngle) {

case 0 :

movingCrate.moveForward(playerMovement);

break;

case 90 :

movingCrate.moveRight(playerMovement);

break;

case 180 :

movingCrate.moveBackward(playerMovement);

break;

case 270 :

movingCrate.moveLeft(playerMovement);

break;

}

but moveLeft method is more intuitive than translateZ method.

What’s better: again, not that much difference, but I prefer Away3D‘s way to move objects.

CAMERA MANAGEMENT

The last thing we need to do is making the camera follow the player.

Flare3D: really, really awesome:

1 2	Pivot3DUtils.setPositionWithReference(scene.camera,CUBESIZE3,CUBESIZE6,0,player,0.1); Pivot3DUtils.lookAtWithReference(scene.camera,-CUBESIZE2,-CUBESIZE3,0,player);

… and that’s it.

Away3D: it wasn’t easy, due to the lack of documentation, although in the end I have to say it’s quite intuitive:

theCamera.target=player;

theCamera.positionOffset=new Vector3D(0,CUBESIZE*8,CUBESIZE*4);

theCamera.lookOffset=new Vector3D(0,0,- CUBESIZE);

theCamera.damping=20;

theCamera.view;

the spring camera is very powerful, but you will need practice and patience to make it work properly.

What’s better: come on, I just need a fixed 3rd person camera: Flare3D is better.

VISUAL GLITCHES

Both engines have visual glitches, which I hope I will be able to remove somehow.

On the left, Flare3D, on the right Away3D

FINAL CONSIDERATIONS

At this very beginning of the development, I would recommend Flare3D because of its documentation and its ease of use.

Obviously more has to come, such as textures and light. Stay tuned.

Rate this post: 1 Star

(22 votes, average: 4.64 out of 5)

Loading ...

Flash Templates provided by Template Monster are pre-made web design products developed using Flash technology.
They can be easily customized to meet the unique requirements of your project.

Be my fan on Facebook and follow me on Twitter! Exclusive content for my Facebook fans and Twitter followers

This post has 26 comments

InspiritGames

on February 14, 2011 at 8:02 pm

Emanuele please check, here is example on Alternativa 3d engine:
http://inspiritgames.com/blog/2011/02/flash-3d-sokoban-prototype-with-alternativa3d/
Malcolm

on February 14, 2011 at 8:25 pm

Nice comparison! Personally I love Unity3D but I like to have options.
qborreda

on February 14, 2011 at 8:26 pm

I loved the comparison of the two libraries. Only had some little experience with Away3d so I’m still unbiased, and willing to know a little more about Flare3d ..

I’ll be following these tutorials.

Grazie Emanuele!
Emanuele Feronato

on February 14, 2011 at 8:31 pm

great example inspiritgames, can I post on the blog, with credits to your site?
InspiritGames

on February 14, 2011 at 8:56 pm

Feel free to do it. I will prepare papervision engine example this week.
BTW light system will be added to the alternativa 3d engine in next build (1-2 weeks) and without any performance drop. As developers promised. You can check speed comparison with alternativa developers comments here: http://blog.alladvanced.net/2011/01/15/speed-test-comparison-between-away3d-alternativa3d-and-flare3d/
Tweets that mention Flare3D Vs Away3D in the creation of a simple game - Emanuele Feronato -- Topsy.com

on February 14, 2011 at 9:31 pm

[...] This post was mentioned on Twitter by mbroadcast, designcollider. designcollider said: Flare3D vs Away3D. I'm highly interested in trying one of these some time.. http://goo.gl/XqsAL [...]
MichaelIV

on February 14, 2011 at 10:18 pm

“I was making the prototype with Alternativa3D and Papervision3D too, but I dropped both engines because they can’t compete against Flare3D and Away3D” Are you serious Emanuele?
I worked with all four engines.PV3D and Away I know every piece inside out.Well PV3D is dead indeed.But saying about Alternative that it can’t compete with Away and Flare?Absolute nonsense .I am expert in Away as it was(and still is) my favorite engine for the past 2 years.But I can tell you from my test, Alternativa is superior to it in performance ,garbage collection (on which Away has a real problem by now) and sorting algorithms.And I don’t even mention signals system which gives Alternativa its power,its architecture and more.One real disadvantage of Alternativa at this time is the lack of lights. However Anton Volkov said recently (CTO) that they are going to introduce lights in a couple of weeks with no performance drop!(Somehow I tend to believe these guys) .To summarize :Away3D is still superior in one thing -an overall number of features + Prefab.Ah not to forget- IT IS OPENSOURCE!.For the performance and architecture design it is can hardly compete with Alternativa at this stage.See my blog for performance benchmark between Away,Flare and Alternativa3D.
MichaelIV

on February 14, 2011 at 10:22 pm

For all the guys willing to see performance tests between Away3D,Flare3D and Alternativa3D:
http://blog.alladvanced.net
rnrn

on February 15, 2011 at 12:22 am

Alternativa3d version has no visual glitches :) best.
Andras Csizmadia

on February 15, 2011 at 12:56 am

Not so while i had a game project utilizing Box2DFlash and a choosen 3d lib.
I’ve made some initial tests at the beginning of the project to measure capabilities of current open sourced 3D engines.
When i’ve tried Away3D, i’ve noticed huge fps drops with the FP10! optimized version, the ported but mostly identical code for Papervision3D/FP9! was running much more smoothly (and it went to production release).

I’m a bit surprised reading that many peoples performance tests are showing different results.

Best,
Andrew
Albert

on February 15, 2011 at 8:22 pm

Nice comparison.
Ciril Bonardo

on February 15, 2011 at 8:52 pm

Performance test at

http://blog.alladvanced.net

Is totally irrelevant: just a few textured boxes rotating.. Is it a performance test ??

What about collision detection,physics, animations, loading times,size of the assets, support on multiple platforms, time used to develop the game itself, integration with tools and suport ??

Evaluating a a 3D platform for the speed of rendering rotating cubes is similar to evaluating a PC comparing how fast they draw letters on a DOS window.

I use Unity because WORKFLOW and functionallity and will choose a 3D engine for AIR and Flash with same criteria, not only because they are fast to rotate a cube.

Evaluating a 3D engine with rotating cubes demonstrates lack of knowledge and an absurd simplification of the 3D technology and ecosystem.

Choose workflow and BUSINESS MODEL.

my 5 cents. CIAO
Ciril Bonardo

on February 16, 2011 at 4:13 pm

I double checked the code and Im astonished:

Flare3D 189 lines of code
Away3D 216 lines of code
Alternativa3D 382 lines of code

To made a simple basi game.

Cmon guys !! Papervision innovated a lot by making a cube rotate on the screen.
10 years has passed since then.

After using Unity IDE it doesnt make any sense tu use this low level engines if everything should be done by code with criptic commands.

Ill Choose workflow and a company with a solid business model.

Another 5 cents. Ciao.
Piergiorgio Niero

on February 18, 2011 at 12:13 am

cool stuff!
good job
George Profenza

on February 18, 2011 at 1:48 am

Nice article.

Here are some opinions:
Flare3D is nicely documented but is commercial(496$), even though the trial is free. It has a nice 3dsmax exporter (again commercial software), which runs on Windows only.
Away3D is free and opensource. Also, Dennis Ippel wrote a nice exporter for Blender (http://www.rozengain.com/blog/2008/01/02/export-your-blender-objects-straight-to-away3d-papervision3d-and-sandy/) which is constantly updated to supported the latest version of the engine. Blender is free and opensource also.

The tutorials for Away3D is out of date unfortunately, but I presume the team is busy with the Away 4.0 using the new 3D API.

Also, Away3D has quite a few extra features (compared to Flare3D) which means there are a lot things you don’t need for the demo.

I would strongly recommend giving Away3D lite a go. It’s pretty easy to extend the Templates(BasicTemplate or FastTemplate).
Thanks to the templates, I’ve setup a basic viewer for this site: http://www.mugbook.it/ (sorry for the shameless plug)

As for the glitches, you need to play with the sorting method.
GameCla.im

on March 4, 2011 at 12:15 pm

Being open source is a massive bonus to me, I dont wanna fork out a load of money for something Im not gonna get on with, im not taking that risk!
Cool Stuff with the Flash Platform – 2/18/11 | Finding Out About

on March 4, 2011 at 11:38 pm

[...] Feronato had several worthy posts this week including the summation of his comparison of Flare3D versus Away3D in the creation of a simple game. Next he followed up his Flare3D prototype tutorial by adding textures. Finally, he posted a link [...]
Flashplayer 11, Molehill, Flare3D 2.0 in FDT 4.2 / crusy.net

on March 8, 2011 at 2:40 pm

[...] kein Away3D? Ich habe keines der beiden Frameworks bisher ausprobiert, aber hier klang Flare3D irgendwie [...]
Bruce Hammond

on April 22, 2011 at 2:58 pm

If you work in both 3dsMax and Flash, I feel that Flare3D is the way to go, without question. The Flare Exporter format (.f3d) packages a lot of info that you otherwise need to code manually in other apps, thus streamlining the coding process.

After wrestling with PaperVision for several years, Flare3D was like a breath of fresh air to me; it took me one day… my first day with Flare3D… to have a simple game up and running. The documentation, though still full of holes, I found to be more illuminating than documentation for other apps.

That said, Flare3D still has a way to go. Version 1.2 – which is what you currently get if you buy the app – is in sore need of true z-sorting; 1.2 uses a much more basic Priority Render system.

Molehill will be the big game-changer, I guess we’d all agree. The apps discussed here all currently have beta versions geared to Molehill. And the Flare3D team promises that Flare 2.0 will have a per-pixel z buffer.
Roundup of the Best Away 3D Tutorials | Papervision Tutorials

on May 26, 2011 at 9:07 am

[...] View the Source [...]
Addy

on May 31, 2011 at 1:03 pm

Hi Emanuel,

I think this was an awesome post. our company has been looking at a few 3d engines in flash and we are considering flare 3d. thanks again for a wonderful post.
Removing all ads from the blog

on June 10, 2011 at 7:02 pm

[...] promote it. In the same way there’s a comment talking about purchasing a Flare3D license in this post and I receive questions about which software to use more than daily, by email, Facebook private [...]
NemoStein

on October 4, 2011 at 3:42 pm

Feronato,

This post is kind of old, and we all know the new (just released this morning) FP11 Stage3D (Molehill).

3D engine vendors are burning down to release their engines first, and with all that intensive fight, documentation are a bit outdated in all of them.

I recently ran into Alternativa3D 8 and Away3D 4 Broomstick, but both are lacking a lot of features, and Broomstick is almost impossible to figure out how to do things.

Well… The thing is…
Would you do some more testings and tell us what you think about them?
tomcat

on January 26, 2012 at 2:58 am

Hi Emanuel,

Interesting comparison. I am tryin gto convince our guys thta flare3d is better and need to put a proto together. can you share the code?

tomcat
yusef

on October 19, 2012 at 4:12 pm

if someone is looking for the best why not udk which export stage3d and also unity but the problem is for example unity make a big swf 2 mg for an empty scene!
I didn’t test udk but probably it is even bigger
about documentation there are some books explain everything for away3d from beginners books to professional books you can search in amazon.com but for flare3d the only resource is their website with some tutorials for how to do things but not a good documentation
unity fps tutorial

on February 7, 2013 at 9:25 pm

Get to know the power of Unity 4′s character animation system, Mecanim, with this comprehensive example package. Inside, you’ll find eleven example scenes d… More Information

italian geek and PROgrammer

This post has 26 comments

Malcolm

qborreda

Emanuele Feronato

rnrn

yusef