Using a WiiMote to Control an X-Wing


I spent this afternoon putting together a quick demo for my Rich Internet Interfaces Beyond Mice and Keyboards talk I’m giving at the DePaul University iTea Seminar tomorrow. The example is a simple one that illustrates using a WiiMote as an interface to controlling a 3D model. This can be easily used as a game control and or more general UI control. I believe it is a more natural way to interface with 3D elements navigating in 3D space and can be generalized to let people more intuitively navigate through and interface with software such as the operating system. After a few hours of looking for the WiiMote, charging it and some coding, I’ve put together this simple demo:

I can’t claim credit for putting together code to display a 3D X-Wing. I’m not interested in that. I quickly found what I was looking for here: – the source code repository for PaperVision – the open source 3D engine for Flash. At the very bottom there’s sample code for displaying a 3D X-Wing.

First things first, you will need the WiiFlashServer that interfaces the WiiMote with your Mac. That code and supporting documentation can be found here: There are 2 pieces to the puzzle here. The WiiFlashServer which listens to the WiiMote and sends messages to your app and the WiiFlash Actionscript API which can receive those messages.

Once you download the Actionscript API and put that in your project directory, include it in your application:

import org.wiiflash.Wiimote;

var wiimote:Wiimote;

Initialize the Wiimote like so:

wiimote = new Wiimote();
wiimote.addEventListener( Event.CONNECT, onWiimoteConnect );


The only thing we really have to do now is to use the pitch, yaw and roll values of the WiiMote and use them to control the X-Wing, like so:

function handleFrames(e:Event):void
var rotX = 0;
var rotY = 0;
var rotZ = 0;

if (!isNaN(wiimote.roll))
rotX = wiimote.roll/Math.PI * 180;

if (!isNaN(wiimote.yaw))
rotZ = wiimote.yaw/Math.PI * 180;

if (!isNaN(wiimote.pitch))
rotY = wiimote.pitch/Math.PI * 180;

// no easing - animation too jagged
//group.rotationX = -rotY;
////group.rotationY = rotZ;
//group.rotationZ = -rotX;

// added easing to smoothen motion
group.rotationX += ( -rotY - group.rotationX) / EASING;
group.rotationZ += ( -rotX - group.rotationZ) / EASING;

You can see from the code there’s a section I commented out. You can use the raw WiiMote values to feed to the X-Wing directly but I found that the values can be jumpy and discreet causing the X-Wing to turn and move with a lot of jitter. I added a simple easing function to make the movements smoother.

As you can see, it’s not rocket science. With a little bit more work, we can easily add other controls like button presses to control the firing of the X-Wing.

Here’s the link to the source if you’re interested. Thanks for watching.

Popularity: 6% [?]

Weekly Favorite Links

No Comments

Some of these links are kinda old, but I figured I’d share them with my audience anyways. The focus of this week’s links are robotics and user interfaces.

Boston Dynamics Big Dog Quadruped Robot Showcasing real time walking and balancing. Your jaw will hit the floor when you see it recover from slipping on ice.

Dean Kamen, inventor of the infamous Segway, shows off his “Luke” (as in Luke Skywalker) prosthetic robotic arm. I thought this was amazing and even more profound than the segway.

Hot along the heels of the movie Iron Man, this is a real life exoskeleton suit reminiscent of Ripley’s powersuit in Aliens. It augments the wearer’s strength and is quite mobile.

Other Links

  • The Eco Zoo is a site done in Papervision3D (an open source 3D library for Flash). This is probably the coolest Papervision site I’ve ever seen bar none.
  • Browse the Flickr universe not just metaphorically in this Papervision browser.
  • Some really creative advertisements.
  • Livescribe digital pens. Not only does it digitize what you write, it also records the audio to go along with it. I want one of these, but I’ll wait for Mac support.

Popularity: 1% [?]