{ P I X E L W E L D E R S }

This isn’t the type of thing I normally publish here, but hey: the times, they are a-changin’. This is a cover of the Flight of the Conchords’ song by the same name. At first it was an experiment in Pro Tools, but then it also turned into an experiment in After Effects. I’d suggest you plug in a sub; the end of the world has a lot of bass.

The Original

The Robot Remix

There comes a time in every blogger’s life when he has to decide whether to use his/her platform for questionable (read: non-development-related) purposes. Everyone has their price. Baby announcements, for instance, often show up on development blogs (though not this one yet, thankfully). Marriage, definitely. Pet deaths, occasionally. And, of course, family members starting their own businesses.

My NYC-based sister, as it turns out, is just catapulting into the world of fashion design with the launch of her first line of clothing. This event coincided with a recent obsession of mine with Flash-Wordpress integration, which lead me to offer to develop a mini-site for her to showcase her wares. A discussion of the techniques I used in combining the Wordpress platform and some light Flash development would actually be on-topic here, but I feel that the disclaimer above has absolved me from any real dev talk in this article.

So, all you PXW readers who like to dress pretty (or, more likely, have relations and ladyfriends who do), allow me to present the inaugural summer collection of Mrs. Emily.

Background

For the past two months or so, I’ve been hard at work on a game that I hope to unleash upon the world next month. Truth be told, I’m a bit nervous since I’ve been getting more and more ambitious as I develop. That’s something they tell you never to do. Choose a scope and stick with it, they say. It’s great advice, but I have so far failed to follow it.

I’ve also recently become involved with GaDeMo, which is kinda like NaNoWriMo for games. Right now it’s just a few of us from the Chicago Experimental Game Meetup, but I’m guessing it’ll grow. Anyway, working on two games at once naturally makes you think a bit differently. You build things a bit more generically because you want to cram it into two different projects simultaneously. At least I do.

All the GaDeMo stuff will eventually be open-sourced, but I figured I’d get a head start on it here and on the GaDeMo blog. I’ve published this over there already, but why not put it here too? Surely someone here will find this useful as well.

The System

This is a stats system for RPG-like tracking of character or item characteristics. It’s half a dozen simple classes, but it’s built to be expanded in the future. Here’s an example use. Say I’ve got a party of characters. Programmatically speaking, each one is probably an instance of some kind of Character class, and each one will have a variety of stats. One solution would be to extend the Character class in various directions and just add your stats as properties of those descendant classes. Of course, then you have a lot of classes that do nearly the same thing, and you have nothing reusable for future games.

A better solution would be to have some sort of object that each Character could instantiate, which would then hold all that Character’s stats. You could do this with a generic Object if you wanted; however, then all manipulation of stats would have to be done either in the Character or in some external class that has access to the Character’s stats. Then you’ve got logic spread all over the place, which is again not a good solution.

Implementation

But what if this stats object could take care of stat management too? For example:

	var stats:Stats = new Stats();
	stats.addStat( new Stat( StandardStats.HP, 0, 100 ) );

This creates a stats object, and then adds a stat called HP with a lower limit of 0 and an upper limit of 100. Now, anytime you want to see how many hit points this character has, you can call:

	stats.getStat( StandardStats.HP );

Okay, that’s pretty simple stuff. It’s one step up from a generic object. But in your typical RPG, you’ll notice that pretty much everything affects your stats. Most of the items in your inventory probably affect them one way or another, battle affects them, spells affect them, the list goes on. Say, for example, our Character has armor that adds 10% to his HP, and a sword that adds +2 HP.

	stats.getStat( StandardStats.HP ).addAffector( new AdditionAffector( "Sword of Justice +2 HP", 2 ) );
	stats.getStat( StandardStats.HP ).addAffector( new MultiplierAffector( "Armor of Punctuality +10%", 0.1 ) );

Now there are two ways to check your stat.

	stats.getStat( StandardStats.HP ).baseValue 	// before Affectors
	stats.getStat( StandardStats.HP ).totalValue		// after Affectors

This gives you the freedom to specify how items affect stats. Perhaps a certain curse ignores all Affectors. Maybe an item does something randomly using a base stat instead of a total stat. Whatever. It’s up to the the developer.

Future Plans

Now obviously this is a ridiculously simple implementation. I imagine it will grow quite a bit as I develop these two games, and probably future games as well. The next steps, I think, would involve integrating an Inventory system and maybe a Skills system of some sort. The end dream would be to just add an item or skill or whatever you want and the stats just kinda take care of themselves. A system like this, really fleshed out, could save a game developer a lot of time.

Download

PXW Stats System v0.1

Happy day, folks. I just took possession of a little something from the UPS man that I’d like to share with you. In fact, I’ve been asked to share it with you, which I admit is more than a little flattering. It’s Unity Game Development Essentials, sent to me courtesy of PACKT publishing:

PACKT has asked me to review this thing, not even knowing how eagerly I have been awaiting an excuse to try Unity out. I’ve been seeing some very intriguing developments in the Unity camp, and I’m starting to feel a little left out over here in Flashland.

This is actually my first solicited book review, so I plan to spend some time on it. My guess is that writing book reviews is a little like having children. The first one gets all your attention, and anyone after number three is lucky to get his picture in the photo album. So PACKT, you got lucky.

So check back in a week or two if this is something you’ve been considering. I’ll see what I can come up with. In the meantime, here’s a sample chapter to get you started:

Chapter 4 - “Interactions”

If you have even a passing interest in great music and social media, take a look at Thru-You. Holy crap.

I’ve been spending a lot of time lately working on a fighting game for a client. It’s pretty standard Street Fighter fare, only much simplified due to time and budget restrictions. However, it made me start thinking about the limitations of the old 2D fighters and what a more powerful processor, faster graphics, and a WYSIWYG animation editor could do for them. I went to my lab immediately.

The first thing I wanted to know was, is there a way to make an animation that can be shared among characters in a game? And could characters be “skinned,” so the same character could change appearances, add/remove body parts or attachments, etc. and retain the same animations? I see it all the time in big-budget 3D games; each character has a skeleton, to which animations may be applied. Each animation can be applied to any character, and each character can use any 3D character model (each of which can of course be “skinned”). So you have three components in the system:

• Skeleton
• Animation
• Skin

Never having been involved with a big-budget game, I can’t tell you the best way to design a system like that. However, as a Flash developer, I can find a good way to do it in 2D, in your browser.

This is a quick example of the system (v0.1) in action. This looks like a timeline animation, but it’s actually done with code. To prove it, click the stage to toggle the animation speed. Notice that it slows down to “bullet time,” but totally smoothly, without the jerkiness of a frame-based animation going down to 3 fps. Also, because of how the system is designed, it can be combined with a physics engine (Box2D, for example) for ragdoll falls from any point in the animation. Think of the possibilities!

Anyway, just wanted to put that out there. I’ve got a couple projects in line first, but I’d like to explore this further to see what kind of gameplay could come of it.

Usually I like to post glamorous stuff, like 3D swirly things and experiments. Occasionally, however, I feel the need to release a little code in the interest of helping a few people out. This code is a review of sorts, since I already posted a similar utility back in June. However, since then I have been expanding my code library and I thought I’d share the latest and much improved version. It’s really a simple concept, but having this in my toolbox has lightened my workload as an ActionScripter considerably.

Advantages

This utility allows you to publish any symbol from Flash and access it at runtime from an ActionScript-only project, such as in Flex Builder. This has a few advantages:

• Easy storage of many assets in one file
• Ability to change graphics without recompiling the main application
• Faster load times with only one HTTP request (as opposed to many separate images and sounds)
• Ability to import vector graphics and animations at runtime
• Smaller main SWF size

The one disadvantage that I can think of is that you’ll need to recompile your library SWF every time you make a change. However, I think the advantages above outweigh this.

Differences in v1.5

Here are the main differences from the last version:

• The class is no longer static. This allows for more than one instance of SWFLibrary at a time.
• The class can now return instances of Sprites, MovieClips, and Sounds from a library SWF.

Usage

1 - In Flash, select “Export for ActionScript” in the symbol’s Linkage settings in the Library (ex. ‘Character’).
2 - Publish the Flash file as a SWF.
3 - Load the SWF into an instance of SWFLibrary
4 - Access the symbol through SWFLibrary, using the class name chosen in Step 1.

A SWFLibrary can be used with four lines of code. Here’s what you’ll need:

// creates an instance of SWFLibrary, adds a listener, and loads a SWF
var gameAssets:SWFLibrary = new SWFLibrary
gameAssets.addEventListener( Event.COMPLETE, handleAssetsLoaded );
gameAssets.load( "myCustomGameAssets.swf" );
 
// accesses the asset (assumes there is a symbol exported as 'Character' in the loaded SWF, as seen in step 1 above)
// this code should run after the Event above has fired
var mySprite:Sprite = gameAssets.getSprite( "Character" );
addChild( mySprite );
 
// gets the asset as a MovieClip (assuming, of course, that it actually is a movieclip)
var myMC:MovieClip = gameAssets.getSprite( "Character" );
addChild( myMC );
 
// getting a sound
var mySound:Sound = gameAssets.getSound( "SoundLinkageNameHere" );
mySound.play();
// === ===

After a symbol has been retrieved from SWFLibrary, it may be treated like any other object.

Download

DOWNLOAD SOURCE

So have fun with this. Hopefully it saves you as much time as it saves me.

After a couple of months working on this project, I am ready to release my labor of love. Presenting: Tutorio.us!

To explain what this is, and instead of writing something new, I’ll just quote directly directly from the website:

So there you have it. Go take a look and let me know what you think!

After a long Papervision-induced hiatus, I’ve come back to FIVe3D- mainly because I still think it’s a great library. Since it’s still relatively new, however, there’s not a lot of example code out there. Thus, here’s another chunk from your friends here at Pixelwelders. This class creates a cube out of Sprite3D planes.

Fig. 1: 27 Cubes

Fig.2: The VectorCube Class

/**
 * A vector Cube class for Mathieu Badimon's excellent FIVe3D library
 * @author Zack Jordan
 * { P I X E L W E L D E R S . C O M }
 */
package com.pixelwelders.five3d
{
	import five3D.display.Sprite3D;
 
	public class VectorCube extends Sprite3D
	{
 
		public var faces		: Array;
 
		public function VectorCube( size:Number, colors:Array = null )
		{
			super();
 
			if ( !colors ) colors = [ 0xFF0000, 0xFF0000, 0xFF0000, 0xFF0000, 0xFF0000, 0xFF0000 ];
			createCube( size, colors );
		}
 
		/**
		 * Creates a new cube at the size specified
		 * 
		 * @param		size			Size of the cube to be created
		 * @return					The new cube
		 */
		private function createCube( size:Number, colors:Array ): void
		{
			faces = new Array();
 
			var xP:Array = new Array(	0, size / 2,	0, -size / 2, 0, 0 );
			var yP:Array = new Array(	0, 0,	0, 0,	-size / 2, size / 2 );
			var zP:Array = new Array(	-size / 2, 0, size / 2, 0, 0, 0	);
			var xR:Array = new Array(	0, 0,	0, 0, -90, 90 );
			var yR:Array = new Array(	0, -90, 180, 90,	0, 0 );
			var zR:Array = new Array(	0, 0,	0, 0, 0, 0 );
 
			for ( var i:int = 0; i < 6; i++ )
			{
				var face:Sprite3D = new Sprite3D();
				face.graphics3D.lineStyle( 1, 0x000000, 1 );
				face.graphics3D.beginFill( colors[ i ] );
				face.graphics3D.drawRect( -size / 2, -size / 2, size, size );
				face.graphics3D.endFill();
				face.singleSided = true;
 
				face.x = xP[ i ];
				face.y = yP[ i ];
				face.z = zP[ i ];
				face.rotationX = xR[ i ];
				face.rotationY = yR[ i ];
				face.rotationZ = zR[ i ];
 
				faces[ i ] = face;
				addChild( face );
			}
 
		}
 
	}
}

So what is this good for? Really, it’s just an easy way to create six faces and arrange them into a cube. You don’t have to worry about depth sorting or any of that stuff because each of the faces is one-sided. However, if you are using more than one of these in your presentation, make sure you specify that container.childrenSorted = true, where container is the Sprite3D containing your Cubes. Otherwise you’ll get some weird results.

Another note: the faces Array is public so you can continue to draw on each face of the cube, and even add children. So really, this is just a starting point; I’ll let you find something useful to do with it.

I just spent the last three weeks a little bit out of the action, wandering Europe in a motorcoach. On said motorcoach, there were only two things to do: play with my laptop, and play poker with the other passengers. By the end of the trip, I ended up winning about thirty Euros from my playing partners (most of which were 17 and younger). Obviously, I have no ethical qualms about gambling with minors. The only thing that disturbed me about this scenario was the fact that 30 Euros is pocket money in France and practically a mortgage payment in the US. Stupid dollar.

So between games, I started this little project in Papervision. I’m not sure how far I’ll take it, but it might end up being my entry into the PaperKing3D contest. I found some great images of a Victorian-style deck of cards, and painstakingly clone-brushed a full deck out of the few cards I could find. I then put together the actual game– which is obviously not finished. However, it does actually deal out the cards and keep track of players- the next step is to actually make it judge hands (flush vs. full house, etc.).

The best part of this little demo is what happens when you mouse over your cards (the closest hand). That is Bartek Drozdz’s bend modifier in action. I think it’s pretty eye-catching.

Anyway, that’s it on Pokervision for today; hopefully I’ll have the time to finish this (multiplayer 3D poker, anyone?). In the meantime, I’ll be working on another, possibly more awesome project that I’ll be presenting at tomorrow’s Chicago Flash Meetup. I’ll post more details here later this week.