Playing Video in Flash

Macromedia/Adobe have made it much easier to include video in Flash movies in the latest version, Flash 8. This lesson assumes that you are using Flash Professional 8 and shows you how to make a Flash movie that contains a movie player configured to play a specific movie clip. There will be nothing else on the stage. First, of course, you need to obtain a video clip. Video takes up a lot more space on the computer than audio, so you use a clip no more than a few seconds long and with modest dimensions, not exceeding 640*480 pixels. You can use a video that you have found on the internet or make your own - if you make your own it is better to use a digital 'still' camera that can make video rather than a DV camera since the 'still' camera will produce files that can be more easily loaded into the computer and converted into the FLV (FLash Video) format that Flash needs. Your digital 'still' camera probably produces files in the AVI format but Flash is capable of importing and converting several other formats too including Apple's MOV format. If you don't have a video file of your own then you can use the MOV file located at Program Files/Macromedia/Flash 8/Samples and Tutorials/Tutorial Assets/cafe_townsend/

Make a new Flash file and save it. Choose File>Import Video and browse to the video file. Step through the wizard, accepting the default settings. This will encode the video in FLV format while applying 'medium compression' to roughly halve the file size. The Flash video file will be saved in the same folder that you saved the FLA file into. The Flash video will be set up to progressively download - this is less likely to have synchronisation problems than an 'embedded' video (see the bottom of this page for more info on embedded video). Flash will automatically place a FLV Playback component on the stage and size it to the dimensions of the video file. Having checked these dimensions in the Property Inspector, you should adjust the size of the stage to the same dimensions (Modify>Document). With the FLV Playback component still selected, use the Properties inspector to set the X and Y values of the component to zero so that the component is aligned with the top left corner of the stage. Now choose Window > Component Inspector and note that Flash has automatically set the 'contentpath' parameter so that the player can find the FLV video file.

Press Ctrl-Enter to watch the video and if all is OK then go ahead and choose File > Publish to create the SWF and HTML files that you will need to include the Flash video in a web page. Note that in this case two SWF files are published, a main one and an additional one which contains the control panel (play, seek, mute) for video playback.

To put the Flash video into a web page using FrontPage:

  1. First make sure that you have a saved page ready to accept the video (create and save a new page if necessary).
  2. Then import both SWF files and the FLV file into your web using File > Import. Put the imported files in the same folder as the web page that you plan to insert the video into.
  3. Then double-click the HTML file that Flash created in order to open the web page in a browser. View the HTML source by choosing View > Source then select and copy the lines beginning with <Object> and ending with </Object>.
  4. In FrontPage, open the page into which you want to paste the video in design view, click where you want to place the video, choose Insert > Web Component > Advanced Controls > HTML (or simply switch to code view) and paste in the HTML code that you previously copied. Now if you switch to Preview mode you should see your Flash video running in your web page, just like this:

The tiny video above uses about 2MB for 20 seconds - imagine how big the files would be if you made a taller, wider video lasting several minutes... Note that when I carry out the above procedure Flash reports an error but this does not seem to be a problem - I don't know what the error is but it must be either minor or non-existent.

You may be aware that it is possible to import videos directly into FrontPage without using Flash. The advantage of using Flash is that the Flash video file format is compatible with more computers than other formats such as AVI or MOV which many computers are not able to play. Also, the Flash procedure described in this lesson attaches a control bar to the video allowing the use to Play/Pause, to seek and to mute the movie. You can change the 'skin' parameter of the FLV Playback component if you want in order to change the appearance of the bar of the controls that it provides e.g. you could choose a skin that includes a volume control instead of just a mute control.

More info on embedded video

If, when encoding video into Flash, you choose the 'embed video' option instead of progressive download and if you choose to embed the video as 'embedded video' and not a 'movie clip' then there will be the following differences:

  • a risk that the sound and image in your video may not be properly synchronised when played back
  • the timeline will expand to accommodate the video
  • instead of adding an FLV Playback component to the movie, an embedded video object will be added
  • no separate FLV video file will be created since the video will be embedded into the SWF file, making it large
  • the FLA file will also be VERY large
  • there will be no control panel to control the movie during playback, and thus no corresponding SWF file.