Starscream, Boba Fett and Jabba the Hut…er…Jasmine the Cat…FlarToolkit AND 3D Animated Models with Keyboard Control

Here’s a link to the live demo to try yourself:

Boba Demo

Direct your iphone here (don’t waste paper, if you can help it!!):

Boba –

Starscream –

Print the markers here:

Boba –

Starscream –

There are keyboard controls for both models. ASDW to move Starscream and directional arrows to move Boba Fett. Each character also has jump, taunt and attack controls. The UI controls are still pretty rough, and not quite as polished as online games available over broadband connections from o2 or similar providers. There are about 14 other animations I haven’t had time to program.

I re-factored the earlier multimarker flar prototype to use the FLARManager 0.3 from Eric Socolofsky at I was able to trace out the string names of the individual 3D channels of the MD2 models I’ve been using. I can now play the individual animations I want to play instead of looping through them all.

This snippet might help those that are trying to figure out the string names of the 3d channels of their MD2 Quake 2 models:

//_channels = new Array();
//			_channels = animatedBoba.getAnimationChannels();
//			trace("channel count", _channels.length);
//			for each(var channel:AbstractChannel3D in _channels) {
//				_numFrames = Math.max(_numFrames, channel.keyFrames.length);
//				channel.updateToFrame(_currentFrame);
//				trace("",;
//			}

I also implemented Saqoosha’s hole effect using Papervision3d, in the form of trap doors, with some slight modification to what cube faces are visible. I think this has to do flipped coordinate space, when comparing a standard PV3d scene and to the flarnode. Here’s the mod:

Instead of :

var hole:Cube = this.scene.addChild(new Cube(new MaterialsList({all: cmats, bottom: cmatb}), 300, 300, 300, 1, 1, 1, Cube.ALL, Cube.TOP)) as Cube;
this._green = this.scene.addChild(new Cube(new MaterialsList({all: new ColorMaterial(0x00ff00)}), 300, 300, 300, 1, 1, 1, 0, Cube.TOP)) as Cube;

Changed to:

var __hole : Cube = new Cube(new MaterialsList({all: __cubeSideTexture, bottom: __cubeBottomTexture}), 80, 80, 80, 1, 1, 1, Cube.ALL, Cube.FRONT);
var __green : Cube = new Cube(new MaterialsList({all: new ColorMaterial(0x00ff00)}), 80, 80, 80, 1, 1, 1, 0, Cube.FRONT);

I went through at least 10 different asymmetrical patterns for the Starscream flar marker. Most of the time the camera would keep losing the pattern or confusing it with the Boba Fett pattern. Bad lighting and problematic marker patterns were the biggest issues.

I don’t have to use keycodes very often, but when I do it’s always a pain trying to remember what uint corresponds with what key. Here’s a snippet I picked up for using as3 to generate keycodes:

The end result isn’t quite this:


….but each time I revisit this prototype it’s seems to be getting closer….

In the future I want to implement mac3d’s adaptive filter, to help eliminate problems with marker detection caused by poor lighting conditions.

Also what fun would spawning 3d characters  in AR be without laser canons and collision detection!?!