- About the Projects
- Prerequisites
- Planning the Projects
- Project: Navigation Cue Points in a .flv File
- Project: ActionScript Cue Points for Captions in an XML File
- Project: Basic Caption Display Template
- Project: Channeling Cue Points to the Caption Display
- Project: Code for Audio-only Captions
- Project: Advanced Captioning Template
- Project: Synchronized Images Template
- Exploring the Support Classes
- Final Thoughts
This chapter is from the book
This chapter is from the book
This chapter is from the book
Project: Navigation Cue Points in a .flv File
In this project, you’ll create a .flv video file you can use in the remaining projects in this chapter. You’ll also use Flash to insert Navigation cue points into the video. You’ll use an excerpt from a public domain video called The Children Must Learn. View the source file the_children_must_learn.mov (located in the source_media folder you downloaded for this chapter) to get a sense of where the captions might appear.
Steps
- Creating a new .fla file
- Importing the source video
- Choosing video options
- Adding the first navigation cue point
- Adding more navigation cue points
- Skinning the video
- Navigating the video
Step 1: Creating a New .fla File
Create a new Flash document and immediately save it as working.fla.
Step 2: Importing the Source Video
Now, import a video clip into the new .fla file. Select File, Import, Import Video to launch the Import Video wizard, as shown in Figure 3.3.
Click the Browse button and select the the_children_must_learn.mov video (located in the source_media folder). Click Next.
Step 3: Choosing Video Options
In the Deployment page of the Video Import wizard, leave the Progressive Download from a Web Server option selected, as shown in Figure 3.4, and click Next. The other options on this page of the wizard include two ways to stream a video from the Flash Media Server (formerly called Flash Communication Server) plus an option to embed the video into your .swf (neither of which we want to do here). Using the Flash Media Server (or a service provider) is an additional expense. Embedding the video into your .swf results in lower quality and audio that drifts out of synch over time.
)
Figure 3.3 The first screen in the Import Video wizard asks you to browse to your source video.
)
Figure 3.4 Select the Progressive Download option in the Deployment page of the Import Video Wizard.
In the Encoding page of the Import Video Wizard, select the Flash 8—Medium Quality (400kbps) encoding profile from the drop-down menu. Click the Show Advanced Settings button to expand the window so it shows additional options, and then click the Cue Points tab in the newly exposed section of the window. Figure 3.5 shows the dialog box you should be viewing.
Step 4: Adding the First Navigation Cue Point
At this time, because Flash unfortunately provides no audio preview, you’d be hard pressed to set cue points for captioning. Instead, let’s just insert Navigation cue points. Specifically, we’ll insert them every time the video image displays a new page of the "Let’s Learn About Goats" booklet.
Scrub the video to as close to 3.187 seconds as you can (displayed as 00:00:03.187); then click the plus button in the upper-left corner of the Cue Points list to add a cue point at this location in the video file. A new entry is created for this cue point in the Cue Points list. Set the cue point type to Navigation by selecting this option from the Type column. Next, type a name for the cue point in the Name column—for this example, use the name The Goat Family because that’s the title of the page of the booklet displayed in the video (see Figure 3.6).
)
Figure 3.5 The Encoding dialog box, shown here with the Cue Points portion of the Advanced Settings.
)
Figure 3.6 The advanced settings of the Import Video Wizard let you insert cue points.
Step 5: Adding More Navigation Cue Points
Scrub the video to 5.247 seconds (where the booklet in the video reads TYPES OF GOATS), and click the plus button to add another cue point. Name this cue point Types of Goats and remember to select Navigation from the Type column. Add three more Navigation cue points at the times shown in Figure 3.7.
)
Figure 3.7 These are all the Navigation cue points you’ll insert.
Step 6: Skinning the Video
Click Next to arrive at the Skinning page in the wizard, as shown in Figure 3.8.
Here you can select a general theme for the look and feel of the video controls. There are themes for Artic (cool blue), Clear, Mojave (beige), and Steel (gray). Each skin has one version where the controls appear on top of the video (these skins have Over in their names), and one version where the controls appear underneath the video (these skins are identified with External in their names). Although we’re only working on producing the .flv file at this point, select one of the skins with a name that ends in All—just so you can see the navigation feature at work. Click Next and then, at the last step, click Finish.
)
Figure 3.8 You can select the look and feel for your video controls in this Skinning dialog box.
Step 7: Navigating the Video
It should take a minute or so to compress the video file, depending on your computer. When it’s complete, the progress bar disappears and you should see that, next to your working.fla file, a .flv file is present and named the_children_must_learn.flv. Select Control, Test Movie; the .swf will load the .flv you just created at runtime. It’s sort of magical the way the FLVPlayback component gets configured automatically. You can pause and click the double-arrows in the video controller to jump to the Navigation cue points we added.
You can add the text for captions using the same technique we just used to add Navigation cue points. However, we’re not going to do that because it’s too difficult to select the times without an audio preview, which is simply not supported in Flash. We’ll use another technique to create captions in the projects that follow. Realize that the primary goal of this project is to create a .flv file you can use in subsequent projects—and to see how you can use Flash to inject cue points.