Introduction
Many of my customers, developers I work with, and people that are new to Flash Video contact me with questions about Flash Video technology. Learning to master a new technology is a process. The first steps are always the most difficult. I remember back in 1997, when streaming media technology just emerged, no one knew how to encode video files, how to embed media players in html pages, or how to stream a live webcast. Few books and articles were published, and many online tutorials like this one educated the public to use streaming media technology. Today, few years later, students in high school learn how to stream video the same way they learn how to design web pages or create Excel spreadsheets.
To understand better how Flash Video technology works lets begin by breaking the myth about Flash Video. There is no need to be a Flash programmer or an experience developer to stream Flash Video. Moreover, you can stream Flash Video files without using a Flash Video Service provider. How you ask? Simple: Flash Video files can be streamed from any Flash Communication Server. Then why companies host their media with a growing number of Flash Video Service providers? The answer is redundancy. Here are the most important reasons:
(1) Flash Video Service providers host your videos on multiple servers. In the event that one server is not working properly your flash video file will be streamed from another server. Flash Video Service providers offer a redundant network of computers connected all together and acting as one.
(2) Hosting your flash video file on multiple servers gives you the flexibility to stream to a larger audience. If you place your Flash Video file on 1 server and a large audience will access it you are limited in capacity to either the license of your Flash Communication Server (Flash Communication Server Pro base license accommodates 2500 connections and 10 MBps peak bandwidth), or to the 100 MBps capacity of your network card. A large audience may demand more then 10 MBps or 100 MBps simultaneous throughput. Purchasing additional licenses and building your own redundant servers can become very expensive.
Like other streaming formats, Flash Video requires a connection between a desktop (you, the user) and a server (the Flash Communication Server). This connection is handled by the Flash Player. The connection is established in a simple way. First, you visit a web page. The web page is hosted on a web server and it has am embedded HTML tag that points to a Flash Movie. Next, you click on a Flash movie file. This file has the necessary information to connect to the Flash Communication Server, locate the proper Flash Video file, and stream it back to your Flash Player that is embedded in your browser. All of this is done in milliseconds time. If for some reason one of the steps I described is missing or links are broken – the relationship between the player and a server will not be established and the video will not play. Very often you will find yourself in this stage, when everything you did seems right but the video will not play. My advice: pause for a minute, take a deep breath, and start all over. As you go through the process again you will find and correct the mistake.
The process of streaming Flash Video begins with encoding your source media to a Flash Video format (a file with .FLV extension) and follows by the creation of a Flash movie file (a file with .SWF extension). All popular streaming formats (e.g. QuickTime, Real Media, and Windows Media) use a software player that connects to the media server and streams live streams or video files that were recorded before and are now stored on the media server (a process called media-on-demand).
Macromedia did not release yet an official “Flash Video Player”. Instead, they enabled Flash player version 6 and up to stream video. This added a great functionality to the Flash Player and was a brilliant marketing move, but at the same time created lot of confusion. The public expects from a new streaming technologies to work the same way others do. Streaming video with Flash technology has advantages and disadvantages. The major advantage is the ability to fully customize the player and integrate streaming files in Flash movies. Many websites use Flash movies to deliver a rich experience. The Flash player is present on 93% of computers worldwide. Flash was used traditionally to add motion and sound to static web pages designed before with HTML pages and images. Websites that deliver content using Flash can integrate streaming files in their presentation without redirecting visitors to another section of the site or launching additional pages to display video. Developers who are familiar with Flash authoring can change completely the look and feel of the video player. This capability differentiates Flash from other open source players such as QuickTime, Real, and the Windows Media. Customizing these players is more complicated. Flash developers can truly see the advantage of using Flash Video, but what about the average person? Flash Video technology was not intended to be used only by developers. The biggest disadvantage of Flash Video is that it requires authoring knowledge and a license copy of Macromedia Flash MX/2004.
Creating Flash Video Files
STEP 1: MEDIA PREPARATION
1.1 It is recommended to purchase Sorenson Squeeze to encode Flash Video files. Flash 2004 can create Flash Video files, but many people confirmed that Sorenson Squeeze does a job better.
1.2 Sorenson Squeeze does not support capture of media from a live source. You can not connect a camera or VCR to your computer and use Sorenson Squeeze to prepare Flash Video files. Use a 3rd party capture cards like Winnov (hyperlink) or Osprey (hyperlink) to capture an AVI file, or export a QuickTime or AVI file from your none-linear editing system.
1.3 Import the QuickTime or AVI file to Sorenson Squeeze. Click on “File/Import”. Point to the file you want to use and click enter
1.4 Sorenson Squeeze offers preset profiles to create streaming audio and video files for different modem speeds (dial-up; LAN; DSL/Cable). Select the desired output format (FLV, SWF, or MOV). To create a Flash Video file select the FLV format.
1.5 In the “Output Files” section select where to save your files.
1.6 Click “Compression/Streaming Setting/file name” and select an encoding speed. It is recommended to create 1 file for each modem speed you plan to support on your site (dial-up; LAN; DSL/Cable). Use the reference table below to create these files.
1.7 You can edit the default compression settings or create new settings. Click “Edit/Default Streaming Settings” and select an encoding profile, or select “Default Custom Settings” to create new profiles.
1.8 When you edit a default streaming setting or when you create a new custom streaming setting you will see the image below. In this window you can customize compression settings of your file; what audio or video codec to use; what window size your file will playback in; how many frames per second to apply, and if to use a 1 or 2-Pass VBR or 1 CVR method for the encoding process. More detail explanation of each function is listed on the Sorenson site.
STEP 2: UPLOAD MEDIA TO YOUR SERVER
2.1 Name your video files in short. Use any 3rd party FTP client like WS-FTP or Cute-FTP and transfer your FLV files to the Flash Communication Server (FCS). The Flash Communication Server will recognize your Flash Videos only if you post them on the server using this path:
“Drive:\Program Files\Macromedia\Flash Communication Server\Applications\streams\_definst_\”
2.2 If you have a shared account with a FCS hosting provider you can create unlimited folders inside your virtual host folder, just make sure to create them by using this path for each one of your folders: “virtual host folder\application name\streams\_definst_\video file.flv”.
STEP 3: PLAYER PREPARATION
3.1 The next step is to create the Flash movie that will call the Flash Video file posted on the FCS and stream it back to your browser. To simplify player preparation we provide 3 sample players courtesy of Uvault.com (hyperlink). Each player is described below. Download the files and use a ZIP tool to open them. Detail instructions are provided together in each player together with the source files.
3.2 Level 1 – Novice
Player with media controls; 4 color skins; requires no knowledge of Flash MX/2004. Recommended for beginners.
http://www.uvault.com/support/player/player1.zip
3.3 Level 2 – Intermediate
Player without controls: a basic layer that can be incorporated with your site look & feel. Requires basic knowledge of Flash MX/2004.
http://www.uvault.com/support/player/player2.zip
3.4 Level 3 – Advance
Player without controls; clear skin fully customized. Requires advance knowledge of Flash MX/2004.
http://www.uvault.com/support/player/player3.zip
3.5 Select the player that most fit your project or website design and read the instructions carefully. When you become familiar with the creation of links to your media move to the next step.
STEP 4: WEBSITE
4.1 Select one of the players and configure it to point to your streaming files. The next step is to create an HTML page that will make reference to your Flash movie who will initiate the stream. In this tutorial the default video window size is 320×240 pixels (1/4 of a standard computer screen display). Open a HTML editor like Macromedia Dreamweaver (hyperlink), or simply use Windows Notepad to edit an existing HTML page. Copy and paste the HTML tag listed below to your web page.
4.2 Name the HTML file as “test.html” and save it to your desktop.
4.3 Log to your web server and create a new folder. Call it “test”.
4.4 Transfer the HTML page you created together with the player you selected in step 3 to your web server and place them inside the folder “test”. Now you will have in your “test” folder 1 HTML page and a SWF file.
4.5 Rename the SWF file to VideoPlayer.swf.
STEP 5: BEGIN STREAMING
5.1 Open a browser (Internet Explorer or Netscape Navigator) and type “http://yourwebsite/test/test.html” . Your web page will appear, call the “VideoPlayer.swf” Flash movie file. The Flash movie file will call the Flash Communication Server who in return will stream back to your browser the Flash Video file you created in step 1.
5.2 If the video will not stream you made a mistake somewhere on the way. Review your steps and start over.
This is it. Five easy steps. Learning to master a new technology is a process. You have now the knowledge to create Flash Video files and link them to your website. Read this tutorial carefully and follow the steps I listed. At first this it will look very complicated; especially if you never tried this before. Learning new technology requires some practice. If you feel that this is too complicated let me know. Good luck!
Eyal Menin is the founder of Uvault – a Macromedia Alliance Partner dedicated to provide hosting services for applications using the Flash Communication Server. Co-located in North America and in Europe, Uvault offers scalable hosting plans tailored to support from individual developers to large enterprises.