PixelMill's Learning Center for Microsoft (R) FrontPage (R)
take our guided template test drive for FrontPage 2002 & FrontPage 2003
knowledgebase | sample sites | reference
Knowledgebase: How-to

Edit Swish Movies that Come in Templates

FrontPage 2002/2003, Swish

Several web templates come with Swish Movies. These movies must be edited with the Swish program, which can be purchased at www.swishzone.com. Swish allows users to create Flash movies and features lots of easy text and animation effects. Although Swish is easier to use than Macromedia Flash, there is still a bit of learning curve to get acquainted with the user interface and figure out how to create a movie. This tutorial will help a new user take an existing Swish movie from a web template and modify it with some basic text animations. The Swish Help menu contains lots of helpful tutorials with further education that we highly recommend.

Please note that not all developers include the .swi in their template. You may need to contact individual developers about their specific products if you have questions not covered here.

First, some quick terms:
In your web folder, look for an .swf file. This is the file that is actually embedded into your web page. Now, look for an .swi file. This is the Swish file. If you don't have an .swi file, then you may not be able to use Swish to edit the movie. (Some templates may contain .swfs without any "source" Swish or Flash files. This means that the movie either requires no editing, or that you can edit the movie within the HTML.)

Here's the basic process that you'll be going through:
1. Edit the .swi file with your own animation and text.
2. Use the .swi file and Swish to "export" an .swf file to replace the existing .swf file.

Edit the .swi file with your own animation and text.

Open your FrontPage Web and double-click on the .swi file. This should automatically open Swish.

The existing Swish file probably has lots of text that you will want to replace. The easiest thing to do is to delete (1) the existing text layers (2). Click on each of the layers that have a "T" and hit the "delete" button (1). Be sure not to delete the underlying image layer (3) or you may lose your picture!

Diagram of Swish interface

When you're ready to add your own text, hit the Insert Text button (4). A text box will appear in the middle of your movie. Move it to the position that you want it, then edit the text using the Text palette on the right side of the screen. You may change the font color, size, font, and more.

Diagram of inserting text into Swish movie

Fx effects in Swish

Settings dialog box in SwishNow you're ready to add animation effects to your text. With the text selected, click on the "Fx" button and choose your effect. (In this example, we will "fade-in" the text.)

The effect dialog box will pop-up. You may change some of the other parameters. In this example, we want the text to move slightly to the right as it fades in, so we change the X-Position as well. (You can also change how long the effect takes by changing the Duration # frames field.)

Click the "Close" button to exit the Settings dialog box. You will now be able to see the effect on your Timeline. You may move the effect around on your timeline, drag on the ends of the effect to make the effect shorter or longer, or double-click to edit the properties.

In the picture below, the purple arrow marks the starting point, and the dotted line shows the movement of the text.

Diagram of Swish

Check out the Help tutorials to learn how to create more effects.

Use the .swi file and Swish to "export" an .swf file to replace the existing .swf file.

After you've gotten your Swish movie the way you like it, you will first need to publish an .swf file. Go to File > Export > SWF.

You will need to browse to your FrontPage web, to the location of the original .swf movie. Make sure that the name of the .swf movies are the same, then click Save. You will need to click OK to replace the existing file.

That's it! This should replace your .swf file that is on your web page. Go to File > Preview in Browser to view your new movie and effects. Here's the movie that we edited in this example (hit Refresh to see the short animation effect):

Related Links