For a recent project, I had the need for a swf to ‘load itself’. This is challenging in an AS3-Only Project because all code and compile-time assets are baked in, and baked-in to ‘frame 1′ of the application. Flash can’t show ANYTHING until all filesize for frame1 is loaded.

Solution? – The (un)documented Frame Metadata Tag. Thanks to Keith Peters’ bit-101 for background info. I’ve created a great demo that is simple to follow.

FYI – This is basically how Flex works, showing a preloader before it loads (in a 1-swf setup).

UPDATE

If you want your ‘SystemManager’ class in this demo to be more configurable. Consider using ‘Custom Compiler Arguments’. See this post.

Next Steps

• Checkout the sourcecode (See ‘Member Resources’ below) for a simple example.

Member Resources

[private_Free member]Enjoy this members-only content!

• Download a FDT 3.x FrameTagMetadataDemo project containing all files. For Flash Builder, create a new project, unzip the download and drag in the files.

[/private_Free member]

A good designer-developer workflow is incredibly powerful in Flash Platform Development. Isolating the ‘art’ from the ‘code’ will allow both parts of your project to progress with limited dependence on the other. This will lead to more innovative ideas, a more flexible project, and less headaches for staff.

There are many ways to incorporate your assets into a Flex (or AS3-Only project). Run-time loading reduces the footprint of your primary swf, but compile-time assets are more straightforward to implement and deploy.

For my projects (often AS3-Only projects authored OUTSIDE of the Adobe Flash CS5 program), or Flex 4.x projects – the assets are created in Flash CS5 and imported at compile-time.

The Flash ‘Embed’ tag handles this. There are many flavors of this. What I like is to have one fla generating one swf, that contains linked symbols (MovieClips and Sprites). I extend ONLY MovieClip and Sprite within Flash. For custom classes, I’ll make the connection between the code and the asset outside of Flash FLA. This reduces the ‘code’ that is in the faces of your artist, and reduces any programatic reason to open the Flash FLA. Thus, your artists can work in Flash-IDE and your developers can work not-in-Flash-IDE (Flash Builder, FDT, FlashDevelop, whatever…)

FYI, I use swf, not swc for one reason. The swc makes the assets available (in intellisense) in a global sense. I find that to be unnecessarily confusing. I like all the assets to be accessed only through the AssetManager class.

FYI, the AssetManager, is a nice buffer. Allowing you to have unique names for linkage in the FLA and Class names in the AssetManager (if desired). Over time, one can change without affecting the other, and without having to change code spread throughout your application.

Next Steps

• See the sourcecode (See ‘Member Resources’ below) for a simple example project and assets file.

Member Resources

[private_Free member]Enjoy this members-only content!

• Download this FDT 3.x AssetManagerDemo project containing all files. For Flash Builder, create a new project, unzip the download and drag in the files.
• Download Flash CS5 Empty Assets Template File.

[/private_Free member]

The ‘Flash Killer’ HTML has some impressive demos. I see a long future for both technologies. More on my 2-cents later. For now checkout some cool demos.

REQUIREMENTS

You need a HTML5-supporting browser. Most of the worlds browsers do NOT support this. The new FireFox 4+, Opera, and I.E. will work well. Test your browser here. http://html5test.com/

GAMES

Biolab Disaster

While I’m far too young to remember 8-bit gaming in the 1980s, Biolab is a homage to those simpler but addictive titles from 20-30 years ago. The game is a space-themed platformer with colorful chunky sprites, great animation and sound effects. The developer, Dominic Szablewski, has also released the canvas-based library at ImpactJS.com.

Biolab is a fine game. In fact, it’s better than many released in the 80s so I’ve heard.

Crystal Galaxy

Crystal Galaxy is a sideways scrolling space shooter reminiscent of R-Type. However, the game’s unique in that the mouse controls the direction of the ship as well as its location.

Unusually, Crystal Galaxy doesn’t use the HTML5 canvas element. Every sprite is an individual HTML div moved around the screen. It works quickly in all browsers and is even playable in IE6! The authors at EffectGames.com also provide free tools and libraries to help you write your own titles.

Crystal Galaxy is fun, and you won’t be able to resist another go.

Canvas Rider

As you might expect, Canvas Rider is a version of Line Rider implemented using the HTML5 canvas element. The game is simple: you ride a bicycle over a series of obstacles to reach a goal – but the realistic gravity and physics make it a serious challenge.

What makes Canvas Rider more special is the online track editor and the thousands of tracks submitted by fans of the game.

Agent 008 Ball

Agent 008 Ball is a glorious-looking game of pool for one player. The objective is to pot as many balls as possible before the timer runs out.

Again, Agent 008 Ball uses the HTML5 canvas element, but it’s the photo-realistic graphics and real-world physics make the game stand out.

Pirates Love Daisies

Pirate Love Daisies is a Tower-Defense-like game which pushes the boundaries of what’s possible with HTML5 and JavaScript. It was written by Flash developer Grant Skinner who was commissioned by Microsoft to create a game which showed off the new technologies in IE9.

Thanks to the original poster here. http://blogs.sitepoint.com/5-awesome-html5-games/