Adobe gaming evangelist Tom Krcha interviews head of development Tomáš Botek about the development process and technology challenges. Highlights:

Me: How long have you been working on the original browser game and how big is the team?

Tomáš: We have started with a web version, which took us approximately 1 year. We are a team of 4 programmers and 3 designers. We have spent a lot of time thinking about the concept of the game.

…

Me: How long did it take to port it from iOS to Android with AIR?

Tomáš: When we had the first tablet version ready (iOS version), all we had to do for the other platforms was to work with the resolutions. The transition from the iOS to Android was very quick, took almost no time.

See the full interview on Tom Krcha’s blog (http://www.flashrealtime.com/).

To help you with the coding as well as other gaming aspects, many online tutorials are available. Here are some that I found:

http://www.good-tutorials.com/tutorials/flash/game-development
Good collection of tutorials on various levels. This site shows the publish date of each tutorial.

http://active.tutsplus.com/category/tutorials/games/
Contains lots of up-to-date samples. This site shows the publish date of each tutorial and lets you sort by Most Recent, Most Commented, or Alphabetical.

http://active.tutsplus.com/category/tutorials/actionscript/
This is not the gaming area of ActiveTuts, but it has some great ActionScript utilities and apps. This site shows the publish date of each tutorial and lets you sort by Most Recent, Most Commented, or Alphabetical.

http://pelfusion.com/tutorials/35-flash-game-development-tutorials-fla-files/
Some of these tutorials are quite old. The site doesn’t display the publish dates and doesn’t allow sorting.

http://pelfusion.com/tutorials/the-most-useful-flash-tutorial-resources/
A useful list of Flash tutorial resources.

http://www.gotoandplay.it/_articles/index.php
Unfortunately, the most recent post is from 2007. This page offers lots of filtering widgets.

http://www.devmaster.net/articles/building-mmorpg/
This page is not ActionScript-specific. It lists the steps and requirements for implementing a Massive Multiplayer Online Role-Playing Game (MMORPG). It is rather old (dated 2004), but the advice is still thought-provoking if not always relevant to mobile platforms.

http://www.bytearray.org/?p=3371
This page introduces the Starling 2D framework. Near the bottom of the page, find a link titled “Click to download (Introducing Starling – rev. 1.2.5)”. This PDF download contains a lengthy Starling tutorial written by Adobe evangelist Thibault Imbert.

And for the most challenging and cutting edge information on game development with ActionScript, you can’t do better than the four Adobe gaming evangelists’ blogs:

Tom Krcha’s blog
Mike Jones’ blog
Enrique Duvos’ blog
Lee Brimelow’s blog

To get going I used Thibault Imbert’s article Introducing the Starling 2D framework. Since I’m also very new to Flash Builder 4.5, I ran into a few rough patches in getting Thibault’s example to run. Here are the problems I encountered and how I solved them. (To more experienced users, these issues may seem trivial, but for me, they caused some  real head-scratching.)

1. I kept getting an inexplicable runtime error saying that flash.display3D.textures::Texture was not defined. Even when I removed all active code from the project, I still got this error. Clearly, the problem had to do with libraries or project settings, but I thought I had followed Thibault’s instructions to a T. As it turns out, I had gone beyond the T and made a change that seemed logical but was not listed in Thibault’s article. In Project Properties, under ActionScript Compiler–>Adobe Flash Player options, the radio buttons force you to choose either “Use the minimum version required by the Flex SDK” or “Use a specific version” (and specify that version.) I decided to choose “Use a specific version” and specify 11.0.0. This setting caused the runtime error. Switching to “Use minimum version required by the Flex SDK” solved it.

2. Though the project now built and ran, the browser showed only a warning message when I ran the app in the debugger. The message said, “The application is not correctly embedded (wrong wmode value).” Thibault’s article explains why this warning is posted but doesn’t tell you exactly how to address it. The question for me was where to set wmode for debugging in Flash Builder 4.5. At first I tried adding it to the attribute line above the main class definition:

[SWF(width="1280", height="752", frameRate="60", backgroundColor="#002143", wmode="direct")]

This change had no effect. Then I realized that the setting must occur in the <projectName>.html file that was created along with the project. This HTML file resides in the bin-debug directory under the project folder. In my case, I needed to change the script call in the header of this file that calls swfobject.embedSWF(). The original script block looked like this:

<script type="text/javascript">
// For version detection, set to min. required Flash Player version,
// or 0 (or 0.0.0), for no version detection.
var swfVersionStr = "10.2.0";
// To use express install, set to playerProductInstall.swf,
// otherwise the empty string.
var xiSwfUrlStr = "playerProductInstall.swf";
var flashvars = {};
var params = {};
params.quality = "high";
params.bgcolor = "#002143";
params.allowscriptaccess = "sameDomain";
params.allowfullscreen = "true";
var attributes = {};
attributes.id = "StarlingExperiment3";
attributes.name = "StarlingExperiment3";
attributes.align = "middle";
swfobject.embedSWF(
"StarlingExperiment3.swf", "flashContent",
"1280", "752",
swfVersionStr, xiSwfUrlStr,
flashvars, params, attributes);
// JavaScript enabled so display the flashContent div in case it is not
// replaced with a SWF object.
swfobject.createCSS("#flashContent", "display:block;text-align:left;");
</script>

Because I’m using a browser that has Javascript enabled, I had to make the change here. In the attributes argument that I passed to swfobject.embedSWF(), I simply added the following new attribute:

attributes.wmode = "direct";

The resulting script block looks like this:

<script type="text/javascript">
// For version detection, set to min. required Flash Player version,
// or 0 (or 0.0.0), for no version detection.
var swfVersionStr = "10.2.0";
// To use express install, set to playerProductInstall.swf,
// otherwise the empty string.
var xiSwfUrlStr = "playerProductInstall.swf";
var flashvars = {};
var params = {};
params.quality = "high";
params.bgcolor = "#002143";
params.allowscriptaccess = "sameDomain";
params.allowfullscreen = "true";
var attributes = {};
attributes.id = "StarlingExperiment3";
attributes.name = "StarlingExperiment3";
attributes.align = "middle";
attributes.wmode = "direct";
swfobject.embedSWF(
"StarlingExperiment3.swf", "flashContent",
"1280", "752",
swfVersionStr, xiSwfUrlStr,
flashvars, params, attributes);
// JavaScript enabled so display the flashContent div in case it is not
// replaced with a SWF object.
swfobject.createCSS("#flashContent", "display:block;text-align:left;");
</script>

To handle the same situation in browsers that don’t support Javascript, you’ll need to use the <noscript> block to apply the wmode setting. In this case, you can simply add wmode as a param on the SWF object: The following <object> block applies to non-IE browsers:

<object type="application/x-shockwave-flash" data="StarlingExperiment3.swf" width="1280" height="752">
<param name="quality" value="high" />
<param name="bgcolor" value="#002143" />
<param name="allowScriptAccess" value="sameDomain" />
<param name="allowFullScreen" value="true" />
<param name="wmode" value="direct" />
...
</object>