Volvo S60 Pinball game – Things I learnt

As I mentioned earlier, this is my first game project. If you have not checked it out, please do. I had so much to learn from this project. Here is a breakdown of the new stuff I ended up using:


Box2DFlash is the best available physics engine for flash in my opinion. I had looked into APE (ActionScript Physics Engine) and Fisix Engine briefly before I finally decided to go ahead with Box2DFlash. It is basically an ActionScript3 version of an opensource physics engine Box2D developed by Erin Catto. The main reason which got me going with it was the richness, the details and the controls it offered me. If you are looking for a list of different physics engines available for ActionScript, Henry Jones has written a nice blog covering almost all of them. The examples right there on the homepage of Box2DFlash, show you the capabilities of this engine. But I have to say, setting up and then getting along is quite difficult with it. This is where QuickBox2D comes in.


QuickBox2D is basically a wrapper around Box2DFlash. Zevan Rosser, the guy who created QuickBox2D puts it rightly:

The main purpose of this library is to significantly simplify instantiation of rigid bodies and provide a simple way to skin rigid bodies with custom graphics.

If you are looking for a comparison of what a simple task with Box2DFlash would look like with that of QuickBox2D, Emanuele Feronato has written a blog tutorial using QuickBox2D and a tutorial done earlier using Box2DFlash alone. It clearly shows you how easy it is to setup Box2DFlash when used with QuickBox2D.

There is a very well-written tutorial on tutsplus which covers QuickBox2D from ground up. This series on tutsplus covers most of the basic stuff for this library but at the time of this writing, the third in the series is yet to come. Plus to understand skinning, Zevan Rosser has written this entry and for contacts (collision detections), this series of posts on his blog or just search the term “contacts” on his blog and you will see many results. For the different forces I had applied on this game on various spots, from handles, to spring, from tunnel to roads, this entry helped me understand better the available forces in Box2DFlash.

I highly recommend that if you decide to use Box2DFlash, QuickBox2D should be used alongside. The only thing is, I am really hoping QuickBox2D keepgs getting updated to be used with the latest version of Box2DFlash. I did not miss any features but it would be very nice if both the libraries update on a regular basis.


I had been thinking of starting to get into frameworks and all. Tried and worked with PureMVC on a couple projects but in this project I (based on a lot of hubbub over internet) used Robotlegs. And it was a good decision I made.

This whole idea of wiring the objects together, the events channeling through the application, model being updated only by commands, seperate Service actor for all external communications and view living its life all alone (decoupled) is so good. I absolutely loved Robotlegs. To understand better this framework, somewhere in the middle of this slideshare by Joel Hooks, he explains the workings of this framework. Plus this hello world video tutorial by John Lindquist explains quite a bit about the framework. Then on InsideRIA, there is an introductory series by Joel Hooks starting off with the basic question, what is Robotlegs?. Then ofcourse, the robotlegs community is so quick in responses. Robotlegs just clicked.


And just when I was in need of sound effects for my game, I saw this blog post by Keith Peters. SFXR lets you create sound effects and provides extensive control over the sound you want to generate. It then exports the sound in WAV format. There is an ActionScript3 port of the same (mentioned in Keith Peter’s blog’s comments).

Facebook ActionScript3 SDK

I used the new Facebook ActionScript3 SDK for the share with facebook functionality of the game. This api is updated by talented developers at so you expect quality and quality it is. I can finally say that the troubles of working for Facebook with ActionScript are over.

Overall, I had a nice experience building this game. I had been thinking of doing a game for quite some time but just was not getting any opportunity. But now that I did, I am happy with the results.

Phew! long post haan? Check out the game.

Volvo S60 Pinball game – Things I learnt

Volvo S60 Pinball game

We pushed live yesterday the launch website of Volvo S60 and the site revolves around a flash pinball game. The objective of the game is to score as much as you can for a chance to win a trip to some place in Botswana (kidding; check the website for details on prizes).

This is my first flash game development project and I have learned so much from it. I will be sharing the technical details about the game and the things I learned in a few days but for now, play the game and tell me if you liked it or not.

Volvo S60 Pinball game

The National – Infograph Facebook Application

I finally got an opportunity to work with the Facebook ActionScript API. Though, at first, everything look quite confusing and all over the place but I eventually got the application working. The funny thing however is that the final application I was able to develop does not use the ActionScript API instead I ended up using Javascript API. Why?

Facebook Actionscript API is good and it has its advantages but the thing that is really annoying is its login process. Since the session is meant to be created and handled within flash; there is no way it can know if the user is already logged-in and thus already has a session; unless used javascript. This is where you see new windows opening up just to give you a message saying “You can now close this window” (which technically makes sense but to a user it is a WTF! moment).

At this point, my application was ready and I had sent around a test link to colleagues. Everything was working but then my peers started asking me that why does that window opens up even if they were already logged-in etc and I was not able to explain them what exactly was happening.

So then I started googling, trying to find a better way and soon found out that setting up the connect process in javascript is a better option even for flash applications. Though, there are a number of solutions out there to get you started using the Javascript API I am mentioning but I ended up using Philip Bulley’s solution.

Overall, it was a good experience for me to get started in the Facebook world of development. Take a look at what I’ve been able to create.

The National – Infograph Facebook Application

Castrol – Cheer with Castrol

I just pushed one of my recent projects live. A few new things I learnt during this project and experimented with were;


I have never used it before and yes I am very late on it. SWFAddress is indeed a helpful tool for Flash and Ajax developers.

Local Shared Object

A very handy utility to store temporary (or permanent) settings or data on user’s machine to make the user-experience even better. I used LSO to store the values of the fields and other choices the user selects.


I have already blogged about it before; I am absolutely in love with Casalib. I used a number of classes of this package in this project but video loading using VideoLoad class of this package has never been so easy for me.

Have a look and have your say. Oh! and it is in Arabic though.

Castrol – Cheer with Castrol

Code Tip: Copying image files along with an AIR application

*** UPDATE ***
In my post below; I am mentioning 1 out of 2 possible ways of embedding image (or any other format for that matter) into an AS3 project but here is link to a detailed post by Renaun Erickson mentioning both the techniques.

I have been developing an Adobe AIR application for the last 2-3 weeks and so far, it has only been a simple yet big (in terms of content) interactive presentation running on the desktop. Just recently, I was asked to see if there is any way some images could be copied to user’s desktop when the application is being installed or is being run so that the user can select those images to set as wallpaper.

As always, I started my journey with googling but soon realized that there is no direct way of copying images from development environment to a user’s desktop via AIR application. The solution I figured out was as follows and please, if someone knows a better way around this; let me know.

As a note; my main development IDE was Flash CS4 Professional and I used FlashDevelop as code-editor.

I first embedded the images I wanted to carry with my application using the [Embed] metadata tag; which is a part of Flex SDK. Attached a Class to it obviously and then instantiated in code.

private var Wallpaper :Class;
private var wallpaper :Bitmap = new Wallpaper ();

Then it was about creating a folder on user’s desktop. It uses File class of AIR API.

var directory :File = File.desktopDirectory.resolvePath ( 'Wallpapers' );
directory.createDirectory ();

Then it was about writing a JPG file.

this.file = File.desktopDirectory.resolvePath ( 'Wallpapers/Wallpaper.jpg' );

The above code doesn’t write the file instantly as you can see we haven’t yet connected our embedded image to this file in anyway but instead it creates a placeholder, a blank image file which has nothing but 0 bytes yet.

The FileStream class of AIR API is the one providing the necessary methods of opening/reading/writing bytes on a file but since it only allows ByteArray to be written on to a File instance, I had to first convert my embedded image data into ByteArray data. as3corelib comes in handy again. JPGEncoder class of this package provides us with encode method which converts BitmapData to ByteArray.

var imageByteArray:ByteArray = this.jpgEncoder.encode ( this.wallpaper.bitmapData );

And finally, it was about opening the File instance and feeding this imageByteArray data to it using our FileStream instance.

this.outputProgressed.addOnce ( this.onProgress_CopyFiles );
this.fileStream.openAsync ( this.file, FileMode.WRITE );
this.fileStream.writeBytes ( imageByteArray );

I used openAsync instead of open because I wanted the other code to run at the same time while the images were being copied in the background. Plus, since I used Robert Penner’s AS3Signals as my main event mechanism throughout this application, I used the lovely addOnce method to make sure the listener object gets removed once the event is fired.

P.S. Robert Penner has compiled a list of examples of AS3Signals for those who are interested in giving it a try.

Code Tip: Copying image files along with an AIR application

Things I learnt recently

For the last few months, I have been experimenting and playing a lot with different techniques and code frameworks just to improve my Flash/ActionScript skills overall.

Stuff like SWC compilation, creating code-snippets are not something new and people have already mastered these arts but as I feel very new in Flash world and as I feel there is a lot for me to learn, I thought I should share some the things I recently discovered.

SWC compilation

I have been using (and still use) Flash Professional IDE as my main development IDE for project compilation for the last three years or so but recently I had a little chat with one of my seniors (Philip Bulley, the guy who got me going in Flash) about the different ways of compiling a SWF file. I had my arguments (typically because I was in my comfort zone using Flash IDE) but he convinced me as always to adopt to ActionScript-only projects so I can just use Flash IDE for assets creation.

Reasons like fast compilation, adding wrapper on top of classes whenever need be (since in Flash, if you have a movieclip structure in place and later on you feel there is a need to change/alter it, it is very difficult) and a pure Object-Oriented feel (instantiation of assets, removal when done) were good enough for me to give it a thought. I am looking forward to feature projects which will certainly be based on ActionScript-only approach using FlashDevelop.

FlashDevelop’s code snippets and code generation

Everyone knows about the usefulness of code snippets and if these snippets are quickly accessible, what else do you want. In my classes, most of the public functions (after implementing an Interface) are same and I use to write them and indent them and comment them again and again. Too be honest, after exploration of code snippets in FlashDevelop, I feel like I have been so stupid. Trust me, whichever your ActionScript Editor is, create and store your little gems, and use them as needed as all of the editors come with this feature of storing snippets.


Oh Robert Penner, I owe you for that one; you are the man :). AS3Signals is simply fantastic. With different tests showing the speed of this event mechanism and a presentation and a video tutorial showing how easy it is to use Signals, there is no reason ActionScript Developers should give it a try. Lot can be (and has been) said about as3signals, but I will keep it for you to explore. Oh and btw, an enhancement to as3signals is going on as well which, to be very honest, is going over my head. 🙂

formatString function

I just didn’t know how handy could … rest really be before I got into this situation (i.e. formatString function). Check this little function I created out of curiousity. Little things matter a lot sometimes.

Casalib ActionScript Library

I downloaded CASALib quite a while ago and the utility functions (the ones I have used so far) are very handy in everyday projects. Everytime I google for some helper class, I find it under casalib library, right under my nose.

Look at Inactivity class of time package for instance, wouldn’t you want to decrease stage’s framerate when the user is idle for some time (i.e. the mouse is not moving at all), I would, on all projects actually. Essentially, it is a matter of adding timers and checking if the last mouse position is equal to the new position, but who would do that if someone has already done that and with additional functionality. So, kudos to Casalib for a great package of useful classes.

FlashPlayer 10 3D

I am done with it. I am done playing with FlashPlayer 10’s 3D capabilities. Oh! why did I develop two projects using it, I should’ve used Papervision3D.

Anyways, I will give any external 3D library a try on my next 3D-based project.

That’s it. There is obviously a lot that I need to learn and master and I will Insha Allah.

Things I learnt recently

Adobe AIR

Ok, it has been some time since the last time I blogged. I have picked Adobe AIR as today’s topic as I think I have collected some really nice examples of it lately. Adobe AIR has been here for quite a while (over two years to be precise) and I have had the love for it right from the beginning.

Ok, so what is Adobe AIR anyway? In short Adobe AIR is a runtime which enables Flash Developers to use their existing ActionScript skills to create applications for desktop. Which means that we Flash developers can now bring our web applications to desktop without learning any new programming language. You can read more about it here.

Essentially, Adobe AIR is a tool which can work both online and offline, is cross-platform and has access to platform’s own filesystem and thus can read/write files locally.

Let me show you some examples.

Whoever has a Twitter account and a lot of following/followers, has to be using either TweetDeck or DestroyTwitter. Both of them are built using AIR. TweetDeck allows integration of Facebook and LinkedIn accounts as well.

GMDesk allows you to access your email right from your desktop. TimesReader allows you to read NewYork Times newspaper’s desktop version.

I don’t know if anyone has seen it already but the movie “Avatar” has an interactive trailer built using AIR which is done quite brilliantly and can be found here (Click on “See how it was made”, then the third thumbnail from the list to download the application).

And Adobe AIR is also used in Motion Pictures industry because of its ease-of-use and the interactivity it provides. Here is a full interview of OOOii owner Kent Demaine of him explaining the way they used Flash and AIR to let the actors interact with the holographic interfaces on set of movies like “Minority Report” and “Star Trek”. More about OOOii here.

And for those interested in numbers, Adobe AIR has way passed 200 million mark long ago.

So yes, Adobe AIR is very cool and the scope it provides to us Flash developers is huge. I am working on an AIR application as well and will share once done. Cheers. 🙂

Adobe AIR