Welcome!

Think Labs is an ongoing effort by Seven2 to provide research and educational opportunities in the web development and mobile field. To see what we’ve been cookin’ up, check out our blog postings.

Created by
Seven2 Login

Categories
Tags
Team Think Labs | Your friend, Away3D
682
single,single-post,postid-682,single-format-standard,ajax_fade,page_not_loaded,,,wpb-js-composer js-comp-ver-4.2.3,vc_responsive
blender_export

Your friend, Away3D

The natural progression of gaming has classically been towards realism. Players want to feel immersed when they play a game and the best way to achieve this is through a photo-realistic 3D world. 3D games also allow for more innovative and complex gameplay that flash is now capable of. When a game is not restricted to one plane, much grander ideas can be achieved. Although there are many avenues for achieving 3D Gaming in flash, I’m going to focus on Away3D.

What is Away3D?

Away 3D is a free 3D graphics engine for ActionScript 3. The most recent version, Away3D 4, utilizes a computers graphics card to process 3D information, which frees up the CPU to handle the rest of the processing. This significantly improved the speed of 3D Graphics within Flash and increased the amount of objects that could be on the 3D Stage at one time without slowing down.

The Process, Holmes

So! Lets get cookin’. While Away3D comes equipped with library of perfectly good simple objects, its always more fun to build your own assets. The first thing we need to do is get your beautiful 3D Model into a format that flash can understand.

Step 1: Export from Blender. This time, we’ll be exporting a .obj file.
 
 

Step 2. Import to PreFab3D.

Step 3. Export as ActionScript file

Making it work with ActionScript 3

Now for the fun part! Here’s how we turn a regular flash stage into a 3D camera:

First, download away3D and flash player 11. Once you’ve got those babies set up, we make our way to the code.

I’m gonna trust that anyone just hopping into this has a basic understanding of setting up an AS3 file, so we’ll skip to the good parts. The first thing a 3D Scene needs is… a scene!

var scene:Scene3D = new Scene3D();

Secondly, we'll need a view and a camera. It is worth noting that there are several types of cameras in Away3D, but for this example we'll be using a SpringCam, because of how it elastically follows a target object.

view = new View3D({scene:scene}); //adds the scene to the 3D view
springCamera = new SpringCam(); //adds the springcam
springCamera.x = myShip.shipShape.x;
springCamera.y = myShip.shipShape.y;
springCamera.z = myShip.shipShape.z;
springCamera.damping = 10; //how much it resists the boing
springCamera.mass = 50; //how heavy it is
springCamera.stiffness = 5; //stiffness of spring, how hard to extend
springCamera.positionOffset = new Vector3D(0,20,350); //camera location in relation to target object
springCamera.target = myShip.shipShape;
view.camera = springCamera;

Then, we’ll populate this scene with a series of 3D objects (including your custom 3D Object).

var earth:Sphere = new Sphere({material:"earthmap1k.jpg",radius:150,segmentsH:18, segmentsW:26});
var myShip = new ship_test();
view.scene.addChild(eart);
view.render();

Bing bang boom, add some actual programming, a little collision and a few more shapes and you’ve got a very simple game!

This was the file I was using to explore design patterns and 3D Flash, so its far from polished, but the basic principles are:

use the arrow keys to move up down left and right across the screen, hit spacebar to move forward in 3D space. The objective is to collect the little red square and drop it off at the sun, but the fun part of the game is smashing into the earth. I hope to continue to develop this in my spare time and to see how far I can push 3D Flash.

Put an egg in your shoe, and beat it.

Time to spread your wings and fly. Have fun exploring the world of 3D in flash! Here are some handy demos for Away3D demos, so please enjoy looking at them:

http://www.everydayflash.com/blog/index.php/2009/12/11/3d-racing-game/

http://www.youtube.com/watch?v=3S4hIAFl_gI

Getting Started links:

http://www.flashmagazine.com/tutorials/detail/create_the_earth_and_heavens_in_less_than_an_hour_with_away3d/

This first link is how I got started. It does a great job of explaining textures, primitives, and cameras, without being overwhelming.

http://away3d.com/tutorials/

If you are interested in a big more exploring, away3D’s site is a great resource.