Controlling topic navigation and synchronizing text with a video presentation is a great way to bring a corporate-type presentation to life on the web. Compared to static slide shows, this simple-looking presentation captivates audiences because it combines audio, video, and animation. This template features video synchronization to content located on labeled frames in the Timeline. When the user clicks one of the buttons, the video and content update themselves to that topic automatically.

Preview the synchronized text/video presentation template

Here are some examples of how you can jazz up this presentation for your needs:

• Add your own video, resize it, and position it anywhere on the page
• Add company graphics and colors to any part of the presentation, including the background
• Add buttons, text, and so on to the navigation bar at the bottom
• Move the navigation bar to the top or the sides
• Add your own text and graphics that appear synchronized with your video
• Add FLVPlayback UI components for customizable video controls

This article provides an overview of the template structure and process required to transform the supplied file into a customized presentation suited for your own needs. (The article and the supplied files are an ActionScript 3 update to the former version of the article written for Macromedia Flash Professional 8.)

Updated features include the following:

• ActionScript 3 source file and ActionScript 3 class package
• ActionScript 3 FLVPlayback component
• Code editing not required to modify the template
• Full-screen button and full-screen mode
• Timeline-based synchronization method
• Updated user interface graphics
• Alternate dynamic XML-driven sample file

Note: If you are using Flash Professional 8 or an ActionScript 2 file in Flash CS4 Professional, please see the previous version of this article.

Requirements

To make this most of this tutorial, you need to install the following software and files:

Flash CS4 Professional

• Try
• Buy

Flash Media Server 3 (optional)

• Try
• Buy

Note: Although it is optional for this tutorial, Flash Media Server enables you to use streaming video downloads instead of progressive video downloads. For more information, see the "Working with streaming video" section of this article.

Flash Player 9 or later (required for ActionScript 3 files)

• Download

Note: Flash Player 9,0,115 or later is required for the playback of high-definition video in H.264 format.

Sample files:

• vidtemplate_synch_preso_cs4.zip (ZIP, 3.3 MB)

Prerequisite knowledge

This article is geared towards beginning- to intermediate-level developers who are interested in getting up to speed on video synchronization techniques. While programming experience is not necessary to understand the article, you may find it beneficial to review the Video Learning Guide for Flash.

This work is licensed under a Creative Commons Attribution-Noncommercial-Share Alike 3.0 Unported License

Page 1 of 6

Next Page

About the author