Monday, April 13, 2009

D-I-Y Augmented Reality

The idea of augmented reality has been around for decades, if not longer. Basically, we seek to add information to a user's experience in the real world through interpretation, analysis and enhancement. For example, the the heads-up display on a fighter jet is an example of augmented reality.

Lacking the resources of the Pentagon, however, there are still augmented reality systems that can be created by virtually anyone with a computer, webcam, some (free) software, and the time and dedication to work on it. In this case, we are talking about taking the video stream from a webcam, looking for a recognizable pattern (called a marker), interpreting it, and using it to add a 3D object to video stream before it is displayed. When done properly, the object will appear to be standing on the marker and will move along with it.

Here are some examples:

http://www.youtube.com/watch?v=3bW9Xgm7fj0


http://www.youtube.com/watch?v=00FGtH5nkxM


If you'd like to try that last one yourself, here's the link:

http://ge.ecomagination.com/smartgrid/#/augmented_reality


The neat thing about all this is that all the tools you need to do this are free. Here's an example of the production pipeline that I use:















Here's a site I put together with these tools. It isn't pretty, but if scroll down to the bottom of that page, you'll find a link to view/print the marker. Then you can come back to that page and try it out. There are also some simple instructions for using the application which simply displays a student response system unit (a "clicker") on the marker and allows you some limited interaction with it.

http://realserver.ait.iastate.edu:8080/ITS/AR3/bin/index.html

As you can see, this is a Flash-based system. When you create one of these programs, you are actually writing ActionScript 3 code and taking advantage of the high penetration rate of the Flash plug-in. According to Adobe, over 98% of internet-connected computers in the world have Flash 9 installed and would be able to view the application.

At the core of the system is the FLARToolkit. This set of ActionScript classes is responsible for recognizing the marker, figuring out its orientation in the real world and sending on that information as a transformation matrix that decribes how the marker must be tilted, turned, or rotated to appear as it does in the video stream. Of all the elements in the production pipeline I presented, this is the only one that can't be substituted (at least at this point).

Papervision3D is a real-time 3D rendering engine for Flash. It is responsible for reading and displaying the 3D model; in my case the clicker. Part of that rendering function is taking the transformation matrix returned by the FLARToolkit and applying it to the model. Other rendering engines exist (such as Away3D) and could be substituted for Papervision, but many of the tutorials asume that you are using Papervision.

FlashDevelop is an Integrated Development Environment (IDE) that you actually use to write the code. It relies on the Flex SDK to compile ActionScript 3 programs. Flex itself relies on Java 1.6, so you need to install that, as well. Links to those packages and some intructions can be found on the FlashDevelop site. Other IDE's, such as Eclipse, exist and may be used, or if you have Flash CS4, you can use that.

The ARToolkit is the original package written to perform marker recognition and tracking. The FLARToolkit is a port of it. The only thing I use from the original AR package is a program that develops the data set needed to track custom markers (mk_patt). It is probably easier to use an Adobe Air application that does the same thing.

For creating the markers, and for texturing the models, I use The GIMP, an open-source paint program. Obviously, you could substitute Photoshop, Paintshop, or any one of dozens of other programs.

I make my models in Blender, a very powerful open-source 3D modeling program. However, you can subsitute other packages as long as they can output Collada files, which is what Papervision prefers. Other file types, such as those from Google's SketchUp program can be used, but the workflow might be slightly different.

It's not my intent to go into detail about how to create this type of AR, but I did want to provide the links to the tools I used and a couple of resources to get you started.

FLARToolKit
Papervision3D (Get the lastest zip version)
FlashDevelop (Get the latest release candidate, then check the Documentation for installation instructions and links to other required programs.)
The GIMP
Blender
ARToolkit (The documentation for the pattern maker program is here.)

Any single one of these programs requires signficant investment of time to learn. There are tutorials and documentation for all of them, however. I suggest simply using a search engine to find information as the need arises.

However, to get you started, here are a couple of very useful resources.

Mikkoh's Blog An excellent source of basic information including some working source code that you can download and play with. Also has a link to the Adobe Air app I mentioned earlier.

Video tutorial A very nice beginner's tutorial on building a basic application that can form the basis for more advanced experiments. Also includes downloadable source code.

You can also download the source code for my example application from the main page.

I've only presented the most basic information here, but it should be enough to get you going.

Good luck!