Using Digital Video in Flash Movies Flash

Because the strength of Flash lies in its vector animation capabilities, it makes sense that Flash prefers vector-based material. Most Web-site visitors prefer quicker download speeds, and vector animations are much easier to store as small files than are raster graphics. As a result, Flash handles raster-based material with JPEG or lossless (a.k.a. PNG) compression schemes. In the past, Flash didn’t let you import digital video files into a Flash movie because they added too much to the file size, which prevented efficient compression and delivery on the Web. So, what do you do if you want to showcase your next blockbuster feature in your Flash movie? You compromise.

If you want visitors to get a taste of some raster-based animation, it’s best to select a short section of the overall movie and extract frames from that selection. In contrast to the coming sections, which discusses the process of exporting sequences from Flash movies, this section describes how to create still image sequences in other applications and bring them into Flash. If you want to accommodate visitors who are willing to wait for larger full-length movies, then you can then link the preview in Flash to load the entire QuickTime movie (or QuickTime movie reference), via HTML and the QuickTime plug-in, into its own window or frame. Generally, though, this method of digital video integration into Flash is used for visual effects or just really cool raster content you snagged on video, such as water ripples or textures.

This section covers a basic method of converting digital video content into a Flashfriendly sequence of frames. Even though Flash 4 or 5 enables you to place QT movies in a Flash movie, they do not export or link with a .SWF file. If you want to embed frames from a QuickTime movie in your Flash movie for playback on the Web, read the rest of the section.

Extracting frames from digital video clips
The premise of frame extraction is simple: Instead of downloading large video files with Flash content, reduce the video in frame size, rate, and length to something that Flash (and slow Internet connections) can handle.

Although QuickTime video cannot be imported into Flash as one video file (because Flash does not store video files in the current implementation of the .SWF format), Flash does support image sequences in bitmap formats. So, we can convert any video clip into a short sequence of still images that can play as an animation or movie clip in Flash.

The following tutorials/workshops assume that you have some working knowledge of the applications described herein. Also, you must have some existing digital video material; we do not create or edit any video in these tutorials. We recommend that you have QuickTime 4 or higher installed on your computer, as well as any updates to your video-editing application(s). At the time this book went to press, QuickTime 4.1.2 was available for both Windows and the Macintosh.

QT Player Pro
You don’t need an expensive video-editing application to extract frames from video clips. In fact, you can do it for less than $30! Apple’s QuickTime Player Pro (see Figure below) can export any QuickTime movie as a series of individual still frames, which can then be imported to Flash. You need the latest version of the QuickTime software (currently 4.0) to export image sequences.

After you have some QuickTime movie footage that you want to use in a Flash .SWF file, you can begin the process of selecting a range of frames and exporting them as a bitmap sequence. This sequence will then be imported into our Flash movie .FLA file.

  1. Making a Selection: First, decide how much of the QuickTime movie you want to import into Flash. Do this sparingly. Remember that raster animation is heavy on file sizes, and people generally like faster-loading content on Web pages. Restrict your selections to movie clips of very short duration, less than five seconds if possible. If you want the visitor to see more than that, consider linking to the entire QuickTime from the smaller clip that you import into the Flash SWF file.
  2. Define Your Selection: Use the In and Out markers to define your selection.
  3. Unfortunately, QT Player Pro does not show frame numbers in the time code display. As a result, you need to eyeball your selection. You can also use the additional video controls to move through the video clip frame by frame. The selection is indicated by a gray bar between the In and Out points. Using Movie➪Get Info and selecting Time from the pop-up you can view the time code of where your selection starts and its duration. A twosecond selection is made from a QuickTime video clip shows below.

    The QuickTime 4 Player interface

    The QuickTime 4 Player interface

    Keep your selections as short as possible. Longer selections add substantial weight to the file size of the Flash .SWF file.

    Keep your selections as short as possible. Longer selections add substantial weight to the file size of the Flash .SWF file.

  4. Trimming the Movie: After you’ve defined a selection, you need to delete the rest of the video track. If we don’t delete it, QT Player Pro exports the entire movie as an image sequence. Again, we only need the short selection for use in Flash. Hold down the Ctrl and Alt keys (PC) or Command and Option keys (Mac), and click Edit on the QT Player Pro menu bar. Now click Trim. This command discards everything but your selection from the movie clip. (Don’t worry about losing this content. As long as you don’t resave your QuickTime movie at this point, your video clip file won’t be altered in any way, because we simply want to export this selection as an image sequence and then close the QuickTime movie without saving.) After you execute the Trim command, the In and Out markers automatically reset to encompass the entire remaining video, and the QuickTime movie only contains the selection that you defined previously.
  5. Exporting an Image Sequence: Now you’re ready to export the QuickTime as an image sequence. Choose File➪Export (Command+E or Ctrl+E), and you see the Save Exported File As dialog . Select a folder (or create a new one) to store your image sequence, specify a filename, and choose Movie to Image Sequence in the Export drop-down menu. Next, click the Options button to define the format settings to be used for the image sequence. You see the Export Image Sequence Settings dialog. If you are using the PC version of Flash, choose .BMP (Windows Bitmap) for the Format property. If you’re using the Mac version of Flash, choose the .PICT format. For the Frames Per Second property, choose a value from the drop-down menu (or type one) that’s appropriate to the length of the clip. For a two-second clip, a value of 4 or 5 is adequate, rendering a total of 8 or 10 frames. Click the Options button to select a bit-depth for the .BMP or .PICT sequence.
  6. In the Save Exported File As dialog, choose Movie to Image Sequence as the Export type.

    In the Save Exported File As dialog, choose Movie to Image Sequence as the Export type.

    In the Export Image Sequence Settings, you can access the file type-specific settings, such as color depth or compression. Choose Millions of Colors if you don’t want to prematurely limit the color palette used for the image sequence.

    Click OK to the BMP or PCT Options dialog, and then click OK again on the Export Image Sequence Settings dialog. Finally, click Save on the original Export Image Sequence to render your image sequence. QT Player Pro adds consecutive numbers to the end of each filename generated in the sequence. Flash can recognize file sequences with this kind of numbering. Now you have a collection of still images that can be imported into Flash. See “Importing a Sequence into Flash” later in this for instructions.

Adobe Premiere 5.1
Adobe Premiere is a cross-platform video-editing application used by serious hobbyists and professional videographers. Unlike proprietary video systems such as Avid, Premiere uses the QuickTime and/or the Video for Windows architecture for processing video. Premiere’s functionality extends from creating Web-based video to CD-ROM video to professional broadcast-quality video. You can also use Premiere to generate image sequences from existing projects or movies.

  1. Open Premiere 5.1, and start a new project. If you’ve left the preferences for Premiere at their defaults, you are automatically presented with a New Project Settings dialog as soon as Premiere finishes loading.
  2. Specify the settings for the new project. See below for reference. The following list delineates the various settings.
    • General Settings, Timebase: For NTSC video, use a timebase of 29.97 fps; use 25 for PAL/SECAM video.
    • General Settings, Time Display: For most consumer video material, including mini-DV, use Drop-Frame Time Code. You may want to use Non Drop-Frame Time Code for DVCAM or other professional video types, if that’s how the source footage was recorded.
    • Video Settings, Compressor: Even though you may have used other video compressors (or codecs) for your video footage, the None type configures our export settings correctly for image sequences.
    • Video Settings, Depth: If you have video that includes an alpha channel or matte, use Millions+ for the Depth setting.
    • Use these Project Settings for DV format video that you want to export as an image sequence.

      Use these Project Settings for DV format video that you want to export as an image sequence.

    • Video Settings, Frame Size: All DV-captured material is 720 × 480. Some MJPEG video capture cards, including the Iomega Buz, capture at 720 × 480 as well. You need to uncheck the 4:3 Aspect box for this frame size. Most MJPEG video capture cards use a 640 × 480 frame size.
    • Video Settings, Frame Rate: Use 29.97 for NTSC video; if you are using PAL/SECAM, use 25. For a thorough explanation of frame rates and timebases,
    • Keyframe & Rendering Options, Field Settings: Lower field first (for most DV-captured material. Check your video capture card’s user manual to confirm your card’s field dominance).
  3. In the Project window, import an existing QuickTime (.MOV) or Video for Windows (.AVI) file. To maintain true cross-platform compatibility, you should use QuickTime movies. To import a movie, double-click in the Project window, and select a file in the following Import dialog.
  4. Next, you need to determine the length of the clip. Double-click the imported movie in the Project window. Premiere loads the clip into the Monitor window . Using the Mark In and Mark Out buttons, set the In and Out points of the clip to reflect the selection you want to bring into Flash. You want to keep the duration of the clip fairly short, around a few seconds. The longer you make the selection, the larger your Flash file.
  5. Use the Monitor window to set the In and Out points of the Movie Clip.

    Use the Monitor window to set the In and Out points of the Movie Clip.

  6. Put the clip into the timeline. Open the timeline window with the Window➪ Timeline menu item . Set the Time Units pop-up menu to two seconds. Click and drag the movie from the Project window onto any Video track in the timeline window. Make sure you place it at the very beginning of the timeline, at frame marker 00:00:00:00. If you can’t see the clip in the timeline, you might have to select a smaller time unit, such as two, four, or eight frames. If you are not sure that your clip is at the zero point, click and drag the clip in the video track as far left as possible To check this, click the time ruler and drag the edit line to the zero point. Whenever you drag the edit line along the video in the timeline, the Monitor window automatically pops up and plays the video as you drag.
  7. Build your video project in the timeline window. For an image sequence, put your Movie Clip on any video track at time 00:00:00:00, which is at the very beginning (far left) of the time scale.

    Build your video project in the timeline window.

  8. Now you’re ready to export this selection as a sequence of individual images, which we can animate in Flash. With either the Monitor or Project window highlighted, select File➪Export➪Movie (Command+M or Ctrl+M). In the Export Movie dialog, click the Settings button in the lower-right corner.
  9. Specify the export settings. A summary of key settings follows.
  10. Use these settings to export an image sequence that Flash can import.

    Use these settings to export an image sequence that Flash can import.

    • General Settings, File Type: On the PC, choose Windows BMP Sequence.
    • On Mac, use PICT Sequence. You can also try Animated GIF if you don’t mind having the color palette of the sequence limited to 256 colors.

    • Video Settings, Depth: If you have an alpha channel that you wish to also export with each image in the sequence, select Millions+.
    • Video Settings, Frame Size: If you want a smaller Flash movie file size and are willing to sacrifice some image quality, shrink the frame size to 320 × 240 for both DV and MJPEG captured material. Sequences are rendered in square pixel formats. Because DV uses nonsquare pixels, you need to resize the actual frame to achieve the correct aspect ratio. That is, if you have 720 × 480 captured clips, you need to export 640 × 480 (or some 4:3 variation) for proper still images.
    • Video Settings, Frame Rate: The frame rate depends on the length of your clip. If you have a 2-second clip, then a setting of 6 fps results in a 12-frame sequence, which is imported into Flash. Higher frame rates equal more individual frames that Flash needs to animate. Basically, you want to obtain a balance between a minimum number of frames and a smooth, believable sense of movement without the sequence becoming too jerky or jumpy.
    • Special Processing: Because the Special Processing dialog gives you a live preview of each effect, you may want to experiment with different settings. Noise reduction can smooth pixilated edges, while the de-interlace option averages the lower and upper fields for each frame rendering.

    Otherwise, the field you specified in the New Project settings is used as when rendering the frame. De-interlacing is not recommended if you are scaling down any DV-format video that you want to convert to an image sequence. Meaning, if you’re outputting an image sequence at 720 × 480 (normal DV frame size), then you should turn de-interlace on. If you are outputting at any size smaller than the original interlaced video, then leave the de-interlace option off.

  11. After you specify the settings for the export, you should create a new folder or choose an existing folder to store the image sequence. When you name the export, don’t worry about adding a number to the file name. Premiere does this automatically. For example, typing apple_ for the filename directs Premiere to call each frame of the sequence as follow: apple_01, apple_02, apple_03, and so on. In Windows, the appropriate file extension is added as well, such as apple_01.pct.
  12. Click OK and Premiere generates a still image sequence from the clip. You’re now ready to import the still images into Flash.

Adobe After Effects 4.1
Adobe After Effects is an extremely powerful video-compositing tool. You can think of After Effects as Photoshop for video. You can add custom filters and motion control to any graphic or video with After Effects. After Effects comes in two versions: regular (Standard) and professional (Production Bundle). The Production Bundle version of After Effects uses the exact same interface as the regular version, but it has superior filters for compositing video. While it’s easier to use Premiere or QT Player Pro to extract frames from a video clip, you can also use After Effects to do it. If you’ve already constructed a project in After Effects, it’s much easier to use it to extract a few frames from a larger project. Otherwise, you need to render the entire project and then go to another application, such as Premiere, to extract those frames from an already rendered (and possible very large) movie file.

Before we begin the steps to extract frames in After Effects, we briefly discuss the workflow in After Effects. Like Premiere, After Effects uses a Project window that links all your graphics, sounds, and video clips to compositions, or comps. A composition can be thought of as the real project container, but you can have more than one composition for a project. In fact, for some killer effects and presentations, comps are often nested within another comp. If you’ve used After Effects primarily for full-motion video effects, then this section shows you how to repurpose your video content for Flash.

  1. Open an existing After Effects project file (.AEP), or create a new project. If you have an existing After Effects project, then open the Time Layout window of the comp you wish to render and skip to Step 5.
  2. Import the video clip that you want to use in Flash, via the File➪Import➪ Footage File command (Ctrl/Command+I). Note the duration and frame size of the clip you have imported.
  3. Create a new composition (Command+N or Ctrl+N), and conform the settings of the comp to those of the imported Movie Clip. For example, if the clip’s frame size is 320 × 240 at 15 fps, then make the comp’s setting 320 × 240 at 15 fps.
  4. Drag the video clip from the Project window to the new composition’s Time Layout window. If it’s not showing, then double-click the composition’s name in the Project window. By default, the comp’s name is Comp 1. Once you drag the video clip into the Time Layout window, it shows up as a layer in the composition.Now, you have to define the work area in After Effects. All extracted frames are drawn from this area. You should keep the length of the work area quite short (a few seconds or less) as each extracted frame adds a lot of weight to the Flash movie.
  5. Move the Time Marker in the Time Layout window to the desired In point of the composition. The In point is where we start extracting frames. Make sure your Composition window is also open, so you have a visual reference for the Time Marker. If it’s not showing, double-clicking the comp’s name in the Project window reopens it.
  6. In the Time Layout window, click and drag the Work Area Start tab while holding down the Shift key. Drag the tab to the Time Marker’s position, and the tab snaps to it.
  7. Move the Time Marker to the Out point of the composition, and shift-drag the Work Area End tab to this position . You’ve now defined the work area in After Effects, and we’re ready to render a series of frames from the comp.
  8. Use the Work Area tabs in the Time Layout window to set the In and Out points of the image sequence.

    Use the Work Area tabs in the Time Layout window to set the In and Out points of the image sequence.

  9. Choose Composition➪Make Movie (Command+M or Ctrl+M). In the Save Movie dialog, browse to the folder where you want to store your frames, enter a prefix filename for the frame sequence, such as comp, and click Save. After Effects automatically numbers the sequence by adding _0000, _0001, _0002, and so on to the filename on the PC version, or .0000, .0001, .0002, and so on to the filename on the Mac version. If you’re using the PC version of After Effects, you get an automatic .AVI extension to the filename. Even though we’re rendering frames as individual files, don’t worry about the .AVI extension.You then see the Render Queue window.
  10. Click the underlined Current Settings text field next to Render Settings, and adjust the frame size and rate to match the size you want for your Flash movie . In the following example, a DV format clip at 720 × 480 is halved in size by choosing Half in the Resolution setting. Choose Work Area Only for the Time Span setting, and note the length of the duration information listed directly beneath this setting. Hopefully, your comp’s work area isn’t longer than five seconds. For the Frame Rate setting, click the Use this Frame Rate option and type a value that won’t overgenerate frames. For a 3-second comp, 4 frames per second will yield 12 frames that can be imported into Flash. Then, click OK to proceed to the next setting dialog.
  11. Use the Render Settings options to control resolution, time span, and frame rate for image sequences.

    Use the Render Settings options to control resolution, time span, and frame rate for image sequences.

  12. Click the underlined Lossless text field (or whatever your default may be) next to Output Module. In the Output Module Settings dialog , choose BMP Sequence (if you’re using a PC) or PICT Sequence (if you’re using a Mac) from the Output Module, Format setting. Don’t change the default settings in the Video section. If you are using nonsquare pixel video such as DV, you may want to resize the frame for each still image extracted. For a 360 × 240 (half-resolution DV) frame size, check the Stretch option and choose Medium, 320 × 240 in the drop-down menu. Select High for the Stretch Quality. Click OK to proceed to the next step.
  13. The Output Module Settings control the file format, video, stretch, and audio characteristics for a queued composition.

    The Output Module Settings control the file format, video, stretch, and audio characteristics for a queued composition.

  14. Click the underlined filename field next to the Output To setting of the Render Queue window. Make any changes to the filename structure to meet your preferred formatting. On the Mac version of After Effects, you need to add a .PCT extension to the filename. By default, the Mac version outputs a series beginning with Comp 1 Movie.[#####], but Flash won’t recognize this as the beginning of a sequence without a .PCT extension. So, you should change the format of the filename to Comp 1 Movie.[#####].pct. Click Save to proceed.
  15. When you’re ready to render a sequence of frames from After Effects, click the Render button in the Render Queue window. After Effects then generates a series of frames ready to bring into Flash.

Importing a sequence into Flash
After you have created an image sequence from another application, you can import the sequence into Flash as a series of keyframes with bitmaps. Flash can autoimport an entire sequence of numbered stills and place them frame by frame on the timeline.

Movie Clip storage
Rather than import an image sequence directly into a layer within a scene, you can import the sequence into a Movie Clip symbol. This makes it easier to duplicate an image-sequence animation through the Flash movie in any number of scenes.

  1. Create a new Flash (.FLA) file or open an existing one.
  2. Create a new symbol of the Movie Clip type (Insert➪New Symbol), and give it a descriptive name.
  3. Choose File➪Import and browse to the folder containing your image sequence. Select the first image of the image sequence, and click OK. You are presented with the message shown below.
  4. Whenever you import a file whose names contains a number, Flash asks you whether you want to import the entire numbered sequence of files.

    Whenever you import a file whose names contains a number, Flash asks you whether you want to import the entire numbered sequence of files.

  5. Click Yes in the dialog shown in Figure below and Flash automatically imports every image in the numeric sequence.
  6. Go back to the Stage and drag the Movie Clip into a scene.
  7. Use tellTarget actions (for Flash 3 or 4 compatibility) or Movie Clip methods (in Flash 5 Dots notation) to control the Movie Clip if necessary. For more information on intramovie interactivity, see Part IV, “Adding Basic Interactivity to Flash Movies.”

Optimizing bitmaps
Like any imported bitmap, you can trace each bitmap in the image sequence. Tracing effectively converts raster information into vector information. Depending on the complexity of the bitmap image, though, the efficiency of tracing can vary wildly.


All rights reserved © 2018 Wisdom IT Services India Pvt. Ltd DMCA.com Protection Status

Flash Topics