PowerPoint to Flash

I’m often asked to convert PowerPoint presentations to Flash movies. While there are several third party applications that will do this, none truly meet my clients’ needs. These presentations need to behave exactly like a PowerPoint presentation. They must maintain all text and vector art. Most of the third party conversion utilities simply convert the presentation into a sequence of images, which break down in quality as the presentation is scaled. The rest overlay the slides with their own branded interface, so the presentation cannot be viewed full screen.

Well, there is a way to do this manually. The technique is not perfect, but if you spend some time setting up the PowerPoint file, you’ll find the results are beautiful. You can create a fully scalable, editable Flash movie from a PowerPoint presentation that can be completely controlled by ActionScript. Although there are many steps to the process, once you get the hang of the technique it can be competed very quickly. It’s also a good idea to keep a Flash document around as a template so that you don’t need to recreate the work you’ve already done.

First, you’ll need to prepare the PowerPoint document. Make sure you’re not using any complicated gradients or animations. These will be interpreted poorly when they’re brought into Flash. Also, make sure there are no objects that fall outside the confines of the slide area. This will ensure that all the slides align correctly when they’re imported to Flash. Now, save a copy of your presentation without any background images. You may want to also choose a contrasting background color to easily see the content of each slide. You’ll import the background images into Flash at a later time.

Second, choose File > Save As… from your PowerPoint document and save the presentation as a Windows Metafile (*.wmf). This will save your entire presentation as a sequence of files. WMF files keep all text.

Next, create a new Flash Document and resize the Stage to 720 x 540. Change the background color to black. Choose File > Import > Import to Stage… and import the first WMF file. When asked to import all of the images in the sequence, choose Yes. This will place each slide from your presentation onto a sequence of frames.

Then, create a new layer under the slides layer and import the images to use for your background. You’ll probably need two images, one for title slides and one for the regular slides.

Now it’s time for some manual labor. You’ll need to go through every frame of the movie and delete the solid background shape from your slides layer. Once this is complete, you should see the content of each slide with the correct background image behind it.

Finally, add a frame to the end of your movie. Place some static text on that frame that says something like “End of slideshow, click to exit.”

Alright, now it’s time to move on to some ActionScript. Create a new layer for your actions. There are a few statements you’ll need to include right away. First, you want this movie to play full screen so add an fscommand.

[code lang=”as3″]
fscommand("fullscreen","true");
[/code]

To make sure the Stage resizes correctly specify the scaleMode.

[code lang=”as3″]
Stage.scaleMode = "exactFit";
[/code]

Finally, you don’t want the movie to begin playing through all the slides right away before the user starts clicking, so add a stop function.

[code lang=”as3″]
stop();
[/code]

You’ll need to include some functions that will be used frequently to navigate the presentation.

[code lang=”as3″]
function gotoNextSlide():Void {
if (_currentframe < _totalframes) {
gotoAndStop(_currentframe + 1);
} else {
quit();
}
}

function gotoPreviousSlide():Void {
gotoAndStop(_currentframe – 1);
}

function gotoHome():Void {
gotoAndStop(1);
}

function gotoEnd():Void {
if (_currentframe < _totalframes) {
gotoAndStop(_totalframes – 1);
}
}

function quit():Void {
fscommand("quit");
}
[/code]

Next, we need to handle all the keyboard and mouse events so that the user can navigate through the slides. We’ll do this by creating a new listener object.

[code lang=”as3″]
var myListener:Object = new Object();

myListener.onKeyDown = myOnKeyDown;
myListener.onKeyUp = myOnKeyUp;
Key.addListener(myListener);

myListener.onMouseUp = myOnMouseUp;
Mouse.addListener(myListener);
[/code]

Here are the listener functions.

[code lang=”as3″]
function myOnKeyDown():Void {
if (Key.isDown(Key.DOWN) || Key.isDown(Key.PGDN)) {
gotoNextSlide();
} else if (Key.isDown(Key.UP) || Key.isDown(Key.PGUP)) {
gotoPreviousSlide();
} else if (Key.isDown(Key.END)) {
gotoEnd();
} else if (Key.isDown(Key.HOME)) {
gotoHome();
}
}

function myOnKeyUp():Void {
if (Key.getCode() == 27) {
quit();
}
}

function myOnMouseUp():Void {
gotoNextSlide();
}
[/code]

That should do it. You’ve now transformed a PowerPoint presentation into your own Flash movie.