Photon Storm » ActionScript3

@thibault_imbert drops a Flash 3D teaser bomb

rich — Wed, 07 Jul 2010 13:55:01 +0000

A few days ago Twitter exploded when someone noticed in the Adobe Max 2010 schedule a session called “Flash Player 3D Future”. Today Thibault Imbert (Product Manager for Adobe Flash Player) put up this blog post, teasing more on the subject:

“Now you may wonder, what does this means, what kind of 3D are we talking about ?

What kind of API ? True textured z-buffered triangles ? GPU acceleration ? Even better ? What I can say is forget what you have seen before, it is going to be big

When this will be available ?

We will share plans with you at Max during this session, I tell you, some serious stuff is coming for 3D developers.”

The key part of his post is “GPU acceleration”. The software renderer inside of Flash has long been its bottleneck. It is what stops Flash being a serious contender in the desktop gaming market. It is what makes Unity developers look at AS3 3D libraries and roll their eyes. It is what makes the limit on the amount of pixels we can push around so incredibly tiny, in comparison to what even low-end GPUs can do these days. Equally screen resolutions are constantly increasing, but still we have to cram our games into small areas because performance just isn’t good enough.

Most old-time Flash developers (hey Squize) don’t expect Adobe to announce anything useful. “It’ll be some half arsed gpu acceleration, only available if you set the wmode in the html, or something equally useless”, “does anyone remember the physics demo they showed last year? that never made it either”.

Adobe have a lot to live up to from previous Max hyperbole.

I’m slightly more optimistic, but I can appreciate their scepticism. Having been playing with Chrome’s HTML5/WebGL support a lot these past few weeks, I truly believe this is Adobe’s only shot at succeeding in the 3D web space. Because time is running out for them. GPU acceleration is going to have to work across the board, and accelerate all graphical elements: bitmap, vector, 3D. A cherry on the cake? Allow PixelBender shaders to run on the GPU too.

It’s about time they truly supported Flash game developers. This would be a significant step forward. It would open the desktop games market to us, it would allow proper 3D games to be made in Flash, and it has the opportunity to give an incredible speed boost to all of graphics operations in Flash.

Don’t drop the ball on this one Adobe. I beg of you.

Read the full blog entry here: http://www.bytearray.org/?p=1836

Flod 3 Beta 2 Demo – SoundFX, David Whittaker support & more!

rich — Wed, 16 Jun 2010 22:59:43 +0000

Christian threw a new beta of Flod 3 at me today, and the list of playable module formats just keeps on getting better and better! New in this beta is support for SoundFX 1 & 2 and all variants of the David Whittaker format. It brings the list of total supported formats to 18 (listed below).

He plans on adding support for Rob Hubbard, TFMX and TFMX 7 Voices formats – and I think that will complete the set for Flod 3! It will quite simply be the best mod/chip replayer in AS3. Heck, the replay quality of standard mods is already well beyond the likes of ModPlug. All it really needs is someone to wrap it up in a sexy AIR app shell, and we’ve got ourselves an incredible new multi-format mod/chip player.

Download the Beta 2 demo (550Kb) which includes 5 tunes: Another World Intro (SoundFX), Leonardo Intro (SoundFX 2), Shadow of the Beast Title, Wrath of the Demo and Xenon 2 Megablast (all DW variants). Needless to say it’s Flash Player 10 only.

The full list of formats supported by Flod 3 currently stands at:

Delta Music 1
Delta Music 2
Digital Musician
Digital Musician 7 Voices
Future Composer 1.x
Future Composer 1.4
His Master’s NoiseTracker
SidMon 1
SidMon 2
SoundFX 1.x
SoundFX 2.x
Brian Postma’s SoundMon 1.x
Brian Postma’s SoundMon 2.x
Ultimate SoundTracker
Generic SoundTrackers
NoiseTracker
ProTracker
David Whittaker (all)

3D Ninja Test 2 – Fists of 30 fps Fury

rich — Tue, 08 Jun 2010 14:52:26 +0000

A few weeks ago I posted my first demo of an animated 3D ninja. At the time I had high hopes of creating a primitive Virtua Fighter styled game. But there were several obstacles to overcome. The poly count was a bit too high, the scene only had one model in it, and it took Away3D a fair time to parse the MD2 data for the key frames.

So last night I decided to revisit the code and see what could be improved. Here is the result – I dropped Away3D and decided to run a test with ND3D instead. It’s a much more light-weight 3D library, and doesn’t include features like lights or shaders. But what it does do, it does very well, and very fast. The MD2 parser in particular kicked several bails out of the Away3D one.

This, combined with an optimised MD2 model (many thanks to Adam Biles for help) allowed me to get two fighters in the scene, each independantly animated and textured, with a ground plane and free roaming camera. I did have a skybox in as well, but the camera perspective didn’t look right and made the fighters seem as if they were floating in space. So I’ll save that for a different project.

Feel free to have a play with the demo.

Ninja 3D Test 1

rich — Thu, 27 May 2010 09:07:32 +0000

I had a desire to see if it was possible to create a simplistic “Virtua Fighter” or Tekken style game in Flash 10. The biggest initial hurdle was getting a convincing model displayed and animating it. And then seeing if the frame rate shot through the floor like a dead weight, or was actually playable.

After a lot of messing around with Milkshape, md2.qc custom files and the Away3D MD2 parser doing some really weird shit, I finally managed to assemble this tech test (click the picture to launch, FP10 required):

Ok so it’s not going to set the world on fire, but I was genuinely surprised at the speed, even when running a full animation sequence. And the model could be optimised significantly too.

More tests will follow as time permits, but this is very encouraging at least.

FlxBitmapFont – A Bitmap Font class for Flixel 2 released

rich — Fri, 21 May 2010 00:37:54 +0000

Today I released my FlxBitmapFont package to Google Code. This allows you to use bitmap fonts directly in your Flixel 2 games:

The bitmap fonts are just an extension of a Flixel Sprite, meaning you can throw them around, collide with them, scale them, rotate them and generally cause havoc. Or of course they could just be UI elements, proving a score/lives count. But at least the choice is yours

11 fonts are included, 2 sample programs and comprehensive documentation in the form of a PDF file. I’ve also published that here on my blog: http://www.photonstorm.com/flxbitmapfont and I will update both my blog and the Google Code archive as needed.

Anyway I hope you have fonty fun with this! Look out for a number of new Flixel classes from me in the coming months, or catch me on the flixel forums where I help moderate the place.

Dealing with the FlxU.overlap kill in Flixel 2

rich — Mon, 22 Mar 2010 22:47:53 +0000

FlxU.overlap in Flixel 2 uses the new FlxQuadTree to handle collisions. It allows you to pass in either a single object (say an FlxSprite), a group of objects (FlxGroup), or even a group of groups! To be honest the more you give it, the more useful it proves to be.

However it’s got one annoying side-effect: if you don’t specify a custom function to deal with the collision, it will kill() your objects. This is often a far from ideal end result. For example if you had a bullet and an enemy being compared – you may want the bullet to be killed instantly, but the enemy to be only “hurt” by this, reducing it’s health.

The only way I’ve found to do this so far is to override the “kill” method of FlxSprite (in my Enemy class) and then perform the logic in there. Reduce health, update animation, health < 0, then kill it for real.

This isn’t ideal, but it certainly works – so if you’re stuck in a similar bind with FlxU.overlap, this may help.

Also it’s worth mentioning (as this caught me out too) – if you do specify a custom function for overlap, make sure it returns a Boolean. False will ignore the overlap, true will say you’ve dealt with it. If you don’t return this value it appears to default to killing your objects again.

FlxSnake – A simple Snake game for Flixel 2.23+

rich — Fri, 19 Mar 2010 16:59:30 +0000

I’ve been playing with Flixel a lot recently, and over on the forums someone was having trouble getting a “snake” game to work. I always applaud people who “start simple”, rather than diving in the deep end and sinking without trace.

So I spent lunch time today knocking together a simple snake game in Flixel 2.23.

There are no graphics (just blocks), but it shows how to use an FlxGroup to handle single to many collision checks, simple sprite controls and of course a basic snake game mechanic. The whole thing is just one single class file with no external requirements.

It’s up on my GitHub account here: http://github.com/photonstorm/FlxSnake

And if you want to join in, the forum thread is here: http://flixel.org/forums/index.php?topic=1261.0 (I’m a moderator on the Flixel forums, so drop by and say hi!)

The 8-bit Rocket auto-biography is out

rich — Mon, 15 Mar 2010 18:47:13 +0000

20 man months of work.

Copious amounts of writing, editing, re-writing, re-editing and editing once more.

Stacks of demo games and hundreds of lines of quality source code.

All to make this the finest 650+ pages of AS3 game development ever commited to dead tree.

Jeff and Steve, the 8-bit Dynamic Duo have done it! Their book is finally out …

The Essential Guide to Flash Games: Building Interactive Entertainment with ActionScript

Despite having a slightly odd title (how many games have you ever played that weren’t interactive?!) this book looks awesome. I’ve pre-ordered my copy from Amazon UK and will give it a proper write-up when received. I have major respect for people who hold down full-time jobs / families, and still manage to produce such a mammoth book as this.

There is a bit of blurb on the Friends of Ed web site about it, although not as much as I would have liked. For example no contents listing, no sample chapter, a poor quality cover image and no index even. Given how many books on web development FoEd produce it begs the question why their own site is so shit. But I digress (and hopefully they will update this page over time). So for now the best place to learn about the contents is from the horses mouth so to speak, here on the 8-bit Rocket.

Congrats Jeff and Steve – I wish you all the best with sales. All you have to do now is stop calling my games advergames and the world will be perfect

Save MovieClip as PNG Example

rich — Thu, 25 Feb 2010 00:18:58 +0000

A couple of guys on Twitter asked me if I would write-up how I generate PNG files from MovieClips in my SWF, at run-time. So I put this example together and am sharing it here.

We use this technique in our virtual world WebbliWorld to save a PNG version of the users avatars after they have customised them. But there are all kinds of other reasons you may need this. My example includes two methods: Saving the PNG locally using the local file system, and Saving the PNG to a web server using AMFPHP.

This technique requires Flash Player 10 and the Adobe AS3 Core Lib.

Here's a very simple example (included in the zip download below):

Essentially it all boils down to this:

1) When you are ready to save your image, create a Bitmap version of your MovieClip.

PLAIN TEXT

Actionscript:

private function getMovieClipAsBitmap():Bitmap
{
var bounds:Rectangle = theMovieClip.getBounds(theMovieClip);
// The * 2 is because we're scaling the clip up by a factor of two, to result in a larger PNG
// If you don't need this, remove it and comment out the m.scale call below
var theBitmap:Bitmap = new Bitmap(new BitmapData(bounds.width * 2, bounds.height * 2, true, 0x0));
var m:Matrix = new Matrix(1, 0, 0, 1, -bounds.x, -bounds.y);
// Simply scale the matrix to make a bigger PNG. Here we are doubling it. Comment this out if you don't need it.
m.scale(2, 2);
// Need to crop the PNG to a given size? Pass it a Rectangle as the 5th parameter to draw()
//var r:Rectangle = new Rectangle(0, 0, 50, 40);
theBitmap.bitmapData.draw(theMovieClip, m, null, null, null, true);
return theBitmap;
}

2) Convert this Bitmap to a ByteArray.

PLAIN TEXT

Actionscript:

private function getMovieClipAsByteArrayPNG():ByteArray
{
var data:Bitmap = getMovieClipAsBitmap();
var ba:ByteArray = PNGEncoder.encode(data.bitmapData);
return ba;
}

3) Send this ByteArray to either the local filesystem, or AMFPHP.

PLAIN TEXT

Actionscript:

// Uses FileReference to save the PNG locally to the hard drive (see "saveToServer" for an alternative)
private function saveLocalPNG(event:MouseEvent):void
{
var ba:ByteArray = getMovieClipAsByteArrayPNG();
file.save(ba, "BirdyNamNam.png");
}

Complete source code is included in the zip file including an AMFPHP PHP script for saving on a web server.

Hope someone finds this useful.

Download the Soure Code zip.

Blockparty 2010 Invtro and the Opensource demo engine evoTinyEngine

rich — Tue, 23 Feb 2010 19:31:26 +0000

Blockparty is an annual demo party held in the US, and 2010's is about to hit in a few months time. As with all good demo parties there is usually an invitation demo to announce it, and to whet the appetite somewhat. This year EvoFlash created this little beauty, and of course it's AS3 to the core:

I've not been to a demo party since 1999, but boy does this make me wish I could be there. Nice one guys, nice one.

There are some lovely effects as you'd expect. Evoflash have been at this for years now, and obviously have a highly streamlined demo pipeline going on. With impressive pre and post render effects; gorgeous blooms, radial blurs, reflections and shadowing. And what's more - they have released it as open source, free for demo coding plebs like me to use!

Called evoTinyEngine it's a small framework that offers you three core elements: Assets, the main Engine and Modifiers. The Modifiers can be stacked up on-top of each other. The Engine handles the construction and destruction of all the Modifiers for you, and there are some really nice things ready to use. Everything is based on 16th note beats, which allows for tight syncing with the audio in your demo.

I haven't dug through the code much yet but I'd be willing to bet there are some insane routines in there, that would be well worth studying for game development as well as demos.

Photon Storm » ActionScript3

@thibault_imbert drops a Flash 3D teaser bomb

Flod 3 Beta 2 Demo – SoundFX, David Whittaker support & more!

3D Ninja Test 2 – Fists of 30 fps Fury

Ninja 3D Test 1

FlxBitmapFont – A Bitmap Font class for Flixel 2 released

Dealing with the FlxU.overlap kill in Flixel 2

FlxSnake – A simple Snake game for Flixel 2.23+

The 8-bit Rocket auto-biography is out

Save MovieClip as PNG Example

Blockparty 2010 Invtro and the Opensource demo engine evoTinyEngine

(Now let's see if this blog post kicks off a 20+ comment flame war about "is it really a demo?" yadda yadda ...