Everyday Flash

Creative use of technology // A blog about 3D Flash and Actionscript by Bartek Drozdz

A 3D racing game in Flash with Away3D

Scion Street Racer

I am proud to announce my latest project. It’s a 3D racing game done in Flash with Away3D. I worked on this project together with Calisto Labs and our client was Snowball Media. My task was to create the 3D game part. It was great fun to work on this project. The team at Calisto Labs did a awesome job and everything went smoothly!

The project required to use my Actionscript and 3D modeling skills together on a scale like I never did before. I spent a lot of time with Blender and Unity in the last months, and without this experience I feel the project would be beyond my abilities. Also, having a direct comparison between Flash and Unity allowed be to see things in a larger perspective.

Flash vs. Unity… again

I built the game with Away3D FP10. I must say that Flash 3D has gone a long way since I first started to play with it, and Away3D is a very solid engine. The 2K polygon limitation is a thing of the past, and the correct perspective projection in FP10 makes everything look so much better. The team also added some other crucial features to create 3D environments – ex. frustum clipping.

Before starting this project I was working on a Unity3D racing demo, so I managed to get quite a few ideas on how to build such a thing. However, when I moved back to Flash, I was a bit desperate because I realized how much stuff I got used to in Unity is just not there in Flash. A built-in physics engine would be the most important one.

Home-made physics and collision detection

For physics in Flash I was tempted do use JigLib at first. But soon I found out that JigLib is way too complex, creating a realistic car behavior would be very difficult and it would probably eat too many CPU cycles. I estimated that Away3D will take around 90-95% of available processing power, so there’s no space for any other complex piece of code to run in the same time. I always think that when it comes to 3D in Flash performance is quality, and there is no excuse for poor performance, even if you want something to look “realistic”. So I ended building something very very simple.

Once I got the car driving around, I needed to add some collision detection. In Unity you quickly get used to the fact that any 3d object is a collider which makes collision detection a no-brainer – just implement a listener method and get a call whenever your object collides with another one. And if you need to add realistic collision response, you just make the object a rigid body and there you go! (Ok, you may need to adjust some settings, but still it’s pretty straightforward).

In Flash it seemed like a much more complex task. I was thinking in the lines of creating a system based on the geometry of the track. I started to study curve equations just to realize I wouldn’t make it even if I had a year to complete the project! Then I remembered, that a good way to test collision with complex shapes is a bitmap.

The way it works is that it takes the car’s position and checks against a map of the track that has different colors for different areas – ex. red for the road, green for the sideways and so on… Since it samples only a few pixels per frame and all it does is check their RGB values, it’s lighting fast. Truly, Flash is the art of minimal!

Scenery

The most fun part was to create the scenery. I’ve never tried to import such a large 3D scene into Flash so I wasn’t even sure if Away3D would handle it. It turns out it did handle it pretty well. Instead of using Collada I went with Wavefront (OBJ) format for the meshes as I feel it gave me more flexibility. OBJ is a simple format which makes it a bit easier to see what’s going on while Collada is bloated and overly complex for my taste. I used Blender to model the track and the few objects that you can see around it – lampposts, houses and the tunnel.

Lightning

Lightning is very important in low poly scenes, because it adds a lot of detail and atmosphere to the scenery, without adding any polygons. Even thought the scenery is simple, I ended up having more that 60 lamps. Of course all those lights needs to be baked on the textures, there’s no way to run them in real-time. Blender has a very good texture baking tool and all this works fine for static objects. But what about objects that move, like the car?

For lightning the car, I reused the concept from collision testing. But instead of a collision map I made another one – a light map. Basically it’s a bitmap with white areas where the scenery is lit and dark ones where it’s not. By sampling a single pixel on every frame I can see if the car is passing through a lit area. Then, all I have to do is to apply a color transform on the car texture to make it brighter. Again – a minimal solution, but it works!

Now that you know all about it, go ahead and try it out!

Categories: 3D, Away3D, Blender, News & Events, Unity3d

comments RSS

17 Comments

  1. Nice work, congratulations. Thanks for share your experience.

  2. Awesome work, really impressive to run this in Flash Player. Really nice to see 3d advancement in the flash community.

    It would be great if you could share some code related to the tricks you talk in your post.

    Nice work Bartek!!!!

  3. Congrats Bartek! This is totally awesome!

    I stared working on a PV3D + Jiglib game about a year ago, still intend to finish it some day :)

  4. Jarek

    While technically impressive, I find it really difficult to play – is there a way to maybe change the camera position?

    Anyway – congratulations on the work!

  5. Great job, Bartek!

    I really like your solution for realtime ’shading’, using a lightmap :)

  6. Nice work! but just curious is there any reason why you’ve chosen flash instead of unity3d for this kind of project? (apart from the player penetration of course)

  7. Great work I am very impressed, keep on raising the bar.

  8. Karl Knocking

    Quite impressive for Flash, but Unity may have been the better solution..
    So the collision detection is basically a 2d detection if i got you right?
    BTW: i managed to drive into the tunnel wall..

  9. Wow looks great. Away3d can look pretty sharp with the right skills around. I still think there is a 2k limit for the general masses since there are so many slow machine out there. That is what makes taking advantage of the video card with Unity so nice. But Flash still wins at fast loading, quick interactive experiences nicely.

  10. @Rahmat @Karl The choice of technology wasn’t mine. Obviously Unity is much more powerful.

    @ryan I think that Flash got faster thanks to the FP10 native 3D features, and in this respect you can push more polygons and keep the same level of performance. Of course Flash is sensible to CPU power, so on older computers it will get slow. But I saw Unity run on old graphic cards and it sucked too :)

  11. Andy

    Thanks SO much for these recent posts…I’m freaking EXCITED again!! I didn’t even know that this kind of 3D stuff was so feasible now in Flash and I had NO clue where to even begin. (I had barely heard of Unity either.) This seriously opens up a whole new world to me and I’m psyched so THANK YOU!

  12. Good job!!

  13. Great work, the screen shot looks very realistic.

  14. JB

    Nice Job.
    Wonder if you have seen the Alternativa3D Golf GTI
    http://blog.alternativaplatform.com/en/2009/07/09/golf-gti-tracks/

  15. @JB Yes, I have seen it – it’s fantastic. Alternativa is really good at handling large sceneries.

  16. Why did you choose away3d for this project? And why not PV3D or Alternativa.

  17. awesome. you’re great man. thank you also for sharing ideas for us.

Leave a comment



  • FITC10


  • FITC10