Forking Ramen

Been busy at work lately! I’ve got a tight deadline on a big project that involves a system demo with an avatar character.

I’ve been working in XML and dynamic Flash for so long with my inFlite system (more info soon) that I have a hard time thinking in terms of time line based animation. So, I’ve forked RAMEN and am creating a version for work. I’m getting the opportunity to add a few cool features (which probably won’t mean anything since I haven’t shared much about RAMEN here): timer based animation triggers, image distortion, targeting MC’s inside of a loaded SWF, shape objects, eventmanger objects, blah blah blah.

The hardest thing with be to get it to talk to Lectora so that I can make a cohesive template.

WiiFlash Tip #2 – Smoothing out the edges, part 2

.crux. added a comment about a different way to smooth out the data from the Wii controller – create an array of the last 10 values and average them. I’ve modified my code to try out this idea, and it’s not too bad. The data does wobble a little, but it’s more precise than my method. If you increase the size of the array, it gets smoother, but will also increase the cpu power required. Partial code below.

 private var WiiRollDegAry:Array = new Array();

public function get roll():int {
return averageIntArray(WiiRollDegAry);
}

private function updateData(pEvt:WiimoteEvent):void {
WiiRollDegAry = addValueToLimitedArry(WiiRollDegAry, int(TheWiimote.roll * TO_DEG));
}

private function addValueToLimitedArry(a:Array, v:int):Array{
a.push(v);
// increase to smooth out data
if (a.length > 10) a.shift();
return a;
}

private function averageIntArray(a:Array):int {
var len:int = a.length;
var c:int = 0;
for (var i:int = 0; i < len; i++) {
c += int(a[i]);
}
return int(c / len);
}

WiiFlash Tip #3 – Blindly pointing

Not so much a tip but a point in the right direction. These tips are really out of order!

Once you have WiiFlash working and you have your senor bar, you need be able to read X and Y values based on where you’re pointing the controller. I tried a few approaches for this, but none worked better than the code that Andrés Santos developed. Check out his wiimoteIR class and demo code. I’m using a very slighly modified version of it in my classes and it’s working great.

WiiFlash Tip #2 – Smoothing out the edges

This is tip #2 in my series on WiiFlash.

Once you have data coming in the from a Wii controller, the first thing you’ll notice is how precise it is. I don’t have it in front of me, but the precision goes about 15 places past the decimal (4.042584267432343…). If you just convert the data from radians to degrees, WiimoteObj.roll*(180 / Math.PI), and apply it to a sprite with an enter frame event, you’ll see it wobble all like mad.

There are two things that you must smooth out to best use the Wii controller – the roll, pitch and yaw of the controller, and the animation of the Wii mouse pointer.

1 – Smoothing Roll, Pitch and Yaw Data

I’m only going to demonstrate for the roll value – it’s the same for pitch and yaw. There are probably numerous ways to optimize this code, but it’s working me right now. My method involves comparing the current value to the last value and checking to see if it’s outside of a tolerance value. If so, then the value is updated, if not, then it’s ignored. I’ve found that 10 degrees works well for me, but you can change it depending on how precise you need it to be. This code assumes that you have an instance of the Wiimote class, WiimoteObj, and have the listeners set up to call the updateWiiMoteData function when the WiimoteEvent.UPDATE event occurs.

private var WiiMPitchDeg:int;
private var WiiMPitchDegPrev:int;
// to convert radians to degrees
private static const TO_DEG:Number = 180 / Math.PI;
// smoothes out roll, pitch and yaw values, smaller = more precision
private static const WIGGLE_TOL:int = 10;

private function updateWiiMoteData(pEvt:WiimoteEvent):void {
WiiMRollDeg = int(WiimoteObj.roll*TO_DEG);
var rDelta:Number = Math.abs(Math.abs(WiiMRollDegPrev) – Math.abs(WiiMRollDeg));
if(rDelta < WIGGLE_TOL) WiiMRollDeg = WiiMRollDegPrev;
}

As you can see it’s pretty simple and works well.

2 – Smoothing out the Wii mouse cursor

This one is very easy. All that you need to do is to slightly tween your cursor sprite from it’s current location to the location that the Wii more is pointing to. Here’s my function, same assumptions as above. wiiPoint is a Point object containing the location you calculated for where the controller is pointing to. I’m using Tweener for the animation.

 private function updateCursor():void {
var newx:int = 0;
var newy:int = 0;
var newr:int = 0;
try {
newx = wiiPoint.x;
newy = wiiPoint.y;
newr = WiimoteObj.roll;
} catch (e:*) {
// no good data – the ‘mote hasn’t seen the IR points
newx = 0;
newy = 0;
newr = 0;
}
Tweener.addTween(CursorSprite, {x:newx, y:newy, rotation:newr, time:.1, transition:”easeOutQuad” } );
}

For your VirtualMouse object, be sure to set it’s x and y properties to the location of the cursor sprite, not where your code says the Wii is pointing at.

REALLY cool Flash site/gallery

Credit to Jason Merrill for finding this site:

Inspiration. WHITEvoid, an interactive design firm in Berlin, developed a really cool user interface that makes liberal use of real 3D in Flash. You have to experience it to appreciate what I mean.  Check it out at whitevoid.com/application.  It gave me some ideas for a portfolio gallery and other uses of 3D for “non-real world object” interactivity.  Oh and if you get a chance, just for fun, check out their “MIDI Gun” on the site.