Newsletter: Learn More ||| Multimedia Presentation Software |||
Create Vector Video with Flix Pro
Contents
Top
Introduction
Flix Pro is the first software that can turn a standard video file into a vector animation with its unique automated trace bitmap function. It enables you to take your input video and still images (any source that Flix can input) and output the video as a vectorized video in the .swf format (Flix's vector video output will play in any Flash player version 3 - 6).

Standard video is made up of images that are divided into blocks. Flix's vectorized video, on the other hand, consists only of vectors - lines and curves defined by mathematical equations that can scale to any size without distortion. In this way you can take advantage of the vector rendering properties of Flash.

Flix can output four different types of vectorized video: color, gray scale, two color (any two colors) and outline (also with any two colors). This walkthrough will guide you through the process of creating each of the four types of vectorized output from Flix.
Top
Source Video & Output File Size
Flix can produce high impact and very low bitrate vectorized streaming video for use on websites and in Internet advertising and marketing. If creating small file sizes is the goal, this effect works best with source video in which there are clearly defined foregrounds and backgrounds and where there is not a great deal of detail. Two color output and outline output will have far smaller file sizes than either the color or gray scale output (color will be the largest, followed by gray scale and then 2 color).

For this tutorial we have provided a 5 second sample AVI file that has a clearly defined foreground and background. The more complex an image, the larger the resulting file size will be. If the source video contains complex shapes and many colors, the converted vector video can have a larger file size. You will probably need to try a variety of settings in the Vectorize tab to find a balance between file size and image quality.

If file size is not an issue, the vector output can create complex and attractive animated images for high bandwidth internet connections, CD ROMS, broadcast quality video and film. Flix is a powerful tool for animators since it can turn any video into an animation that can be broken apart, manipulated and edited in the Flash authoring tool.
Flix Vector Animation
Top
Vectorize Tab Description

Below is a basic description of all the features and options contained in the Vectorize tab.
Preview
You can use this area to obtain a preview of what the vector output will look like from a single frame in your video. The preview displays what the input frame looks like and what the output vectorized image will look like.
  • Duration: This is the duration of your source video clip.
  • Output Frame Size: This is the size (in bytes) of your output frame. This can only be determined once you click the "Preview" button.
  • Preview Time (h/m/s): This is the time, in hours, minutes, and seconds, of the frame you wish to view as a preview of your vectorized output. It will select the first frame of the second that you select.
Output Color Options
This is where you set the output color options for your vectorized video. Flix can output four different vectorized images from the same source. You must select one of the three choices available. The default selection is "Color."
  • Color: outputs 24 bit colors

    Video Animation - Color Output

  • Grayscale: outputs grayscale



  • Two Colors: outputs 2 specified colors which you can select using the 2 color picker buttons. The default colors are white (left button) and black (right button).



  • Two Colors Options: if you select the two color output, there are a variety of options.
  • Threshold: Determines whether a color will be set as black or white (or either of the two colors you select). Higher threshold results in more black (or the color you select on the right). Lower threshold results in more white (or the color you select on the left). If you select the two color option you must provide a value for the threshold (between 0-255). You will probably need to experiment with this setting to determine the appropriate threshold for your particular image.
  • Don't Fill Shapes: If you select this option, your output will appear as outlines only.



  • Colors: Here you can select any two colors for your two color output.
Vectorize Settings
  • Detail (1-100): Determines the amount of detail/color to keep. 1 is the minimum detail and 100 is maximum detail. A higher value for detail will result in increased detail and larger file sizes.
  • Use more passes for bitrate control: By selecting this feature, you will decrease the values by which Flix steps when it is using its automated feature to create your vectorized output (whenever you select a maximum bitrate). If you do not have a maximum bitrate selected this feature will be grayed out.
  • Restore Preset: By clicking this button, all the settings in the Vectorize Tab will revert to the default settings associated with the preset you select, or if no preset is selected, this button is grayed out. (Note: changing settings in the Vectorize tab will not cause the preset to change to "Customized".)
Output Detail Options
These settings determine the amount of detail in your output vectorized video. Each of the settings is on a scale of 1-100, except for Blur which is on a scale from 1-10. Higher values for all other output detail options will result in loss of detail and smaller file sizes (values are in units of pixels).
  • Remove Right Angles (1-100): Removes right angles by converting them into diagonal lines.



  • Remove Jagged Edges (1-100): Removes jagged edges by converting them into a straight line.



  • Remove Stragglers (1-100): Removes small, enclosed shapes that fall under the threshold (area) that you set.

     
    Before
    After

  • Fit Curves (1-100): Higher thresholds result in looser curve fitting - attempts to fit curves over line segments.



  • Peak Reduction: When curve fitting is enabled, the Peak Reduction threshold will determine how many pixels to allow for the peak of a fitted curve above the line it is using as the basis for curve fitting. This prevents abnormal shapes and lines from being drawn as the result of curve fitting. The lower this number the shorter the "peak" that is allowed.



  • Fit Straight Lines (1-100): Higher thresholds result in looser line fitting - attempts to fit straight lines over line segments.



  • Blur (1-10): Blurs the source image. A value of 10 will result in maximum blurring. The default setting is for Blur to be deselected. Blurring can be useful to reduce the amount of detail in an image.

    Before
    After
Top
Starting Out
  • To output vectorized video, you must select "Vector" in the File Tab (video output options).
  • Next, in the File Tab click the "Browse" button for your input file and find the source video file you want to use.
  • Once you've selected an input file, Flix will automatically fill in the output SWF file name. If you are happy with the output filename and destination as it is, move on. If not, you can change the name and/or destination.
  • In order to encode or preview vectorized output, you will need to fill in other settings in Flix. At a minimum, you must enter an image size, a video framerate, and a quality setting in the Video tab, a swf framerate in the SWF tab, audio settings in the Audio tab (if you want your output to contain audio), and a detail value in the Vectorize tab.
Top
Settings & Presets
One of the things that makes working with Flix so easy is that it comes with preset options (you can also edit these and create your own customized presets specifically for encoding vectorized video). If you want to use a preset, you can select one in the preset box.

If you select a preset, Flix will automatically fill in all the other information that must be filled in before you can encode (for color or gray scale output - if you want 2 color output you will need to enter a color threshold value). In addition, the presets include settings for the Output detail options in the Vectorize Tab. You may use these settings, or set any values that you desire. Choosing a preset will also assign a maximum bitrate to your output video. You may change any of these settings. If you change any of the settings that are automatically set in the SWF, Audio and Video tabs, the preset box will change to "Customized."

All the settings in Flix will affect the vectorized output. The image size and custom swf dimensions fields in the Video tab function in the same way for the vectorization process. In other words, the image dimensions you select, will be the image size used to generate the vectorized image. So if you set a larger custom swf dimension than your image dimensions to use the extrapolation capabilities of Flash, the result will be the same as if you manually dragged a smaller window open to a larger size. If you set the larger dimensions in the image dimension fields and do not use the custom swf dimensions to enlarge your vectorized swf, the output file will probably appear different, and it may be larger (depending on the maximum bitrate you select). It is also important to remember that Flix vectorizes the source video based on an image that is the size that you have specified in the image dimensions (video tab).

While selecting a preset will automatically fill in the settings of the Vectorize tab, in order to obtain the best results, you will probably need to carefully adjust all the settings in the Vectorize tab based on the source image. Each output is completely dependent on the source video that is used and minor changes in any of the settings, can have a large effect on the output. Keep in mind that the vectorize tab in Flix behaves very differently than the standard video output.
Top
Maximum Bitrate Behavior
If you select a maximum bitrate (Video Tab), Flix will ensure that your output vectorized video will be no greater than the maximum bitrate you have selected - so the settings you select may not be the actual settings used. In order to accomplish this, Flix may need to change the settings that appear in the Vectorize Tab. If the image size is larger than the maximum bitrate that is set will allow, using whatever settings are currently set in the Vectorize tab as a starting point, Flix will decrease the "Detail" setting and increase all the other "Output detail options" settings. If the image size is smaller than the maximum bitrate set, using whatever settings are currently set in the Vectorize tab as a starting point, Flix will increase the "Detail" setting and reduce all the other "Output detail options" settings. You can decrease the amount that Flix will increase or decrease the options when a maximum bitrate has been selected by checking the "Use more passes for bitrate control" checkbox in the Vectorize tab.

Please be aware that if you select a maximum bitrate, Flix will ensure that your output vector video does not exceed a specified maximum bitrate, but it will not necessarily be at the bitrate limit that you have selected - unlike Flix's standard video output. In fact, the vectorized output may end up smaller than the maximum bitrate would normally allow - especially if you are using a 2 color output. This is because of the nature of vectorized video. If there is a finite amount of detail in your source, then Flix can only increase the size so much - without you changing the frame rate or size of the image (which Flix will not do automatically). If you are attempting to squeeze as much data into a file as you possibly can under the limits of a given bitrate, you may need to adjust your settings and check your output file size in order to determine the actual bandwidth used by your file. The encoding dialogue box will tell you the average bitrate of your output video.

If you do not have a maximum bitrate set, then Flix will encode your vectorized video using exactly the settings that appear in the Vectorize Tab. This is the only way to make sure that Flix is using exactly the settings that you select. By testing settings with no maximum bitrate selected, you can see very clearly how each setting is affecting the output.
Top
Vectorize Encoding Session Walkthrough
In the File Tab I browse to find my source file. In this case that file is: "Bighorn_Sheep_5sec.avi". The output file name ("Bighorn_Sheep_5sec.swf") is fine, so I won't edit or change it.

Next, I am going to select a preset because it will automatically fill in all the other details that I need to fill in to encode. I select the 56k preset because I want my output to be viewable by most people connecting to the internet, and I know that while broadband usage is increasing rapidly, many people still connect at 56k.

Since I know I want a vectorized output, I also select the Vector output under Export video options in the File tab.

Next I will click on the Vectorize tab so I can begin customizing my vectorized video.

If I wanted to change any of the other settings in the swf, audio or video tabs, I could do that before proceeding. The source video we are using has no audio, which means all the bits are automatically allocated to the image portion of the video. If your source has audio, you will need to set your audio settings, taking into account the fact that any bits allocated to the audio portion of your vectorized swf will not be available for the video portion.
Top
Color Output
To start I will encode using the default settings associated with the 56k preset. This includes the "Color" button being selected in the Output color options.

Flix's vectorized color output turns your source video into an image with up to 256 colors, though typically it will use fewer.

First I click the "Preview" button to see what the output will look like. I usually preview before I encode because Flix's vectorized output takes longer to encode than standard output and I want to make sure that what I'm encoding is what I expect. You can preview the first frame of any second in your clip - just enter the second in the preview time field. The frame that appears looks fine, so I click the encode button. When the Flix encoding dialogue box pops open I make sure that the "close encoding window" checkbox is unchecked so the box will stay open.
I do this because I want to see what the average swf bitrate will be. Because of the way vectorization works, Flix will make sure that your output vectorized swf will not exceed your maximum bitrate, but if you want to squeeze as much information into the stream as you possibly can, you want to check the bitrate and see if you can increase your settings.

I notice that the output swf has an average bitrate of 11 kbps. I know that the suggested maximum bitrate for 56k is 40 kbps. So I go back to the File tab and switch the preset to 128 KB. Once again, before I encode I click preview. I re-encode and now see the average swf bitrate is 34 KB, so I know I have a little room to maneuver. I also see that the output is a little blocky and I want to see if I can smooth out some of the lines.

When playing with the settings, the preview function is great because you can immediately see the results of your changes. For instance, I try checking the "blur," apply a value of 1, and preview the result. Sometimes blur can smooth out bumps in an image, but in this image it just blurs it (creating an undesirable double image), so I uncheck blur.

To really test your output settings, you need to uncheck the maximum bitrate box in the video tab (this is described above under Maximum Bitrate Behavior). When the maximum bitrate box is unchecked, Flix will output your vectorized video using exactly the settings you have set.

If I deselect the maximum bitrate setting and reencode I see that the average swf bitrate is still 34 kbps. Now I have a choice if I want to increase the file size I can either add detail to the image I have, or I can increase the video framerate of my output video. Increasing the video framerate (video tab) will increase the file size. If you change your video framerate, remember that your swf framerate must be equal to or a multiple of your video framerate. Since the source video I am using does not have a lot of action and I don't have a lot of bandwidth available, I am going to experiment with increasing the detail.

You can increase detail by increasing the detail setting in the "Vectorize settings" (if you are using a maximum bitrate you can also increase detail by checking "Use more passes for bitrate control"). This increases the actual detail used to create your vectorized swf. For instance, if I increase the detail option from 70 to 75 I see that the average bitrate has increased to 41.

You can also increase detail by decreasing the values in the "Output detail options". The Output detail options settings affect how Flix's vector function turns the image you are using into lines. The larger the values you use, the less detail will appear in your vectorized .swf because larger values smooth out the lines of your image.

You can read the Vectorize Tab Description above for in depth descriptions of how all the settings in the Vectorize tab affect your output. Depending on your source you will get a better result with different settings. For instance, if your source has a lot of rough edges, you can increase the values in "Remove Right Angles" and "Remove Jagged Edges" and Flix will automatically smooth them out. "Blur" can also remove rough edges. "Remove stragglers" takes out small, closed areas, so if your video has a lot of dots or other excess information, you can remove them with this function ("Blur" can also help with this). "Fit curves" will attempt to turn the lines of your video into curves because a curve can describe several lines with a single mathematical formula, thus reducing file size and making your image smoother. The "Peak Reduction" works with the curve fitting to limit the height of a peak that can be created when Flix attempts to fit a curve over a number of lines. "Fit straight lines" attempts to turn multiple lines into a single line. And "Blur" blurs your source image prior to vectorization, thus potentially reducing detail in the source and making for a better and smaller vectorized image.

If you want to increase the video framerate, you can also decrease detail in your output .swf to reduce memory usage and then you can increase your framerate.

Be aware that the average bitrate is just an average. If you do not have the maximum bitrate function checked, your output swf may have frames that exceed the bitrate you are targeting. You can view the frame by frame bitrate consumption of your swf by bringing it into Macromedia Flash and opening the bandwidth profiler (under View>Bandwidth Profiler & Frame by Frame Graph).
Because of this, once you have found the settings you like, if you are creating vectorized video for users on a dial up modem, you may want to re-select a maximum bitrate to ensure that no frame exceeds the allowed maximum bitrate. You could also use a preloader with your swf.

Of course if bandwidth is not a concern you can change your image size, framerate and vectorize settings based solely on the look you are trying to achieve. You can uncheck the maximum bitrate, increase detail to 100 and uncheck all the "Output detail options" to achieve maximum detail. This is appropriate for use on CDs, or for video and film work.
Top
Gray Scale
Flix's vectorized gray scale output turns all the colors in your output swf into a gray scale (shades of black through white). Gray scale output is slightly smaller than color output.

The gray scale output works in a very similar fashion to the color output, so you would follow the same steps outlined above to create your gray scale vectorized .swf.
Top
2 Color Output
Flix's vectorized 2 color output will reduce your image to two colors that you select. Two color output has a much smaller file size than either color or gray scale. It can also be very useful for bringing your output into Flash because the images are greatly simplified. The default colors are black and white, but you can select any 2 colors that you want. To select a color simply click on one or both of the color buttons and select the color that you want.

The key aspect of two color output is selecting the threshold. The threshold determines whether a color will be set as black or white (or either of the two colors you select). It goes on a scale of 1-255. You can start the process by entering a value in the middle, such as 125. However, the best threshold will depend completely on your source video - whether it's light or dark, and which elements you want to highlight. With some clips you may find that a change in the threshold value of 1 unit can completely change the output.

It's also a really good idea to preview different sections of the video, because a threshold that you use for one section may not work as well for another. You can either create different outputs and bring them together in Flash (the vectorized output imports seamlessly into Flash), you can edit the video before you bring it into Flix, or you can find a value that works for the whole clip you are using.

For the clip I am currently using, I will select a color threshold of 125. Previewing several spots, I see that the value works quite well. It is often useful to try several color threshold values and find the point at which the image shifts from one color to the other. Experimenting with this I see that I can increase the color threshold to 200 and get an even better result. Because of the way the threshold works, you want to set it to make sure to create a clear 2 color image by setting it as far to one end as you can. (At a certain point you will shift your foreground and background colors as you increase or decrease the threshold.) I don't want to use black and white, so I use the color picker buttons to change the colors.

Next, I see that there are quite a few extra elements in the video and I really want to get the image down to a silhouette. So I check "Blur" and add a value of 1 and preview again. That seems to get the result I am looking for. The "Blur" function works differently with 2 color output (since the double image that occurred in the color output is not present). Later I may find that I need to uncheck blur if it is not working well with some of the other selections I have made.

You may also really want to play with the "Output detail options" to get the lines as smooth as possible. And since the two color output greatly reduces the file size, you may also want to increase the "Detail" in order to get more of the details of your source video. Changing the detail setting may cause you to have to alter your color threshold. Through experimentation you may find that a lower detail setting actually yields better results.

In addition, because my file size has been reduced so much, I now see the average swf bitrate of my output is 9kbps. So I know I have a lot of room to either increase the image size, or the framerate, or both. Increasing the video framerate to 12 leaves me with 26 kbps avg .swf bitrate. So I still have room if I want to bring the file in under the 40 kbps recommended limit for 56k video. Or you can reduce the size and make the vectorized video suitable for users on a 28k modem.

I find that I can use 12 video fps and a 320x240 image size and still come in at 34kbps - well below the maximum for 56k.

If you want to use the custom swf dimensions you will see that your output scales to any size. However, depending on how refined your vectorized video is, the extrapolated video may not look as good as you want.
Top
Outline Output
The fourth kind of vector output from Flix is outline. To turn your vectorized video into an outline only, all you need to do is follow the same steps as outlined above in the 2 color output and simply check the "Don't fill shapes" checkbox. This will automatically turn your output into lines only.
Top
Breaking a video apart in Flash
You can bring your vectorized .swf into Flash and manipulate it as you would any vector based image. These changes must be made frame by frame.

First import your swf into Flash. Flix's vectorized .swf's can be imported into Flash without losing any of the bitrate control you may have built into the .swf (unlike the Flash 3-5 output).

You can easily break apart the image by clicking on the frame you want to work on and selecting Modify>break apart.
Breaking a video apart in Flash
Or you can use the arrow tool and select the area of the image that you want to adjust. For instance, you can replace a block of the image such as the background color.
You can also use the subselection tool to change any of the lines drawn in your vectorized video. Simply break apart the image and use the subselection tool to select the image. For instance you could give your bighorn sheep a tail.
You can also add any image you want, or use any of Flash's built in drawing and animation functions. For instance, you may want to add the sun shining in the background.
Top
Final Notes
Improving vector output with editing, cropping and filters
Flix Pro has a very useful Edit, Crop and Filters Window which works great with Flix's vector video output. You can use the edit and crop feature to select exactly the portion of a video that you want to vectorize. The image filters can be used to significantly improve your vector output by reducing detail, increasing contrast and altering the colors of your source video prior to encoding.

Importing
You may import your vectorized .swf output into Macromedia Flash and manipulate the image in any way that you would a normal vector based .swf. If you want to import your vectorized output into Flash you do not need to select "Create importable SWF" in the SWF tab. The standard vectorized output will be importable. In addition, the imported vector video will not use up any additional RAM (unlike importing Flix's Flash 3-5 video).

Variables
Any custom variables you add to your output .swf will be stored in the first frame.

Creating small vectorized images
If you are creating a small sized vectorized video - for instance you may want to put it into a banner ad, or as part of a multi-image sequence - it can be valuable to remember that the vectorize function uses the image dimensions you set in the video tab as the basis for vectorizing your video. This becomes especially relevant on small images, because if the "image dimensions" are too small, it may be difficult for the vectorization settings to obtain enough detail to create the kind of output you are looking for.

You can adjust for this by using larger "image dimensions" and then scaling the video smaller using the "custom swf dimensions" (also in the video tab).

You can also use this resizing feature to help you get a better result, because the vectorize function can work differently on the same source depending on the size of the source that is used to create the vector output. The key is experimentation.
Top
Conclusion
There is a lot of information covered in this tutorial. The fact is that the vectorization feature can get pretty complex depending on your source video and the kind of result you are trying to obtain. Hopefully, this tutorial will give you enough information so that you can work through whatever issues or problems you may face in attempting to create your own vectorized videos.

Flix's vectorized video output is a unique and powerful way to add life to your websites and CD roms. Because the output scales to any size you can also use it for broadcast TV and film applications.

If you had a chance to see the film, "Waking Life" you saw what a filmmaker could do to create an animated version of real life video with 30 artists and a couple of million dollars. Now Flix won't do exactly the same thing, but it can do a lot of what they did in that movie, especially when you combine Flix with the animation and drawing features in Flash.

Good luck!
Top
 
©2010 Wildform, Inc | Policies | Contact Us | Newsletter Options
 
Wildform provides a 100% satisfaction guarantee on all our Flash software. If you are not completely satisfied with our Flash multimedia software for any reason you may request a refund within 15 days of purchase.