Windows Media Streaming Video Tutorial

By Dr. Edgar Huang and Clifford Marsiglio

Indiana University-Purdue University Indianapolis
School of Informatics

In this tutorial, the terms "movie" and "video" are equivalent.

Quite several software programs, such as Adobe Premiere Pro 2.0, QuickTime Pro and VisualHub have the capability to encode Windows Media streaming videos, but the most professional encoder for encoding Windows Media is the Window Media Encoder 9 Series. If you don't have it installed yet, you can download it for free from the Microsoft Web site. This tutorial will show you how to batch-process multi-data-rate encoding with Windows Media Encoder 9 Series.

ENCODING

Link To Wiki

Link To Windows Media Video Screencast

1. Importing

Launch Windows Media Encoder from a PC. In the New Session window, you can use Convert a file option to convert an original video file to a streaming video file; however, you will be left with almost no freedom in customizing the encoding. Therefore, use Custom session to convert a file. Click OK.

Under the Source tab, click File. Browse to find the file you want to encode. Windows Media Encoder can import videos in AVI and WMV formats easily. However, it is not friendly to QuickTime movies. When you try to import an MOV movie, you can't see it until you click the Files of type pull down menu to choose All files. If you happen to need to encode a video in MPG format, you need to install a compatible MPEG-2 decoder on the encoding computer. In order to achieve the best encoding result, always try to encode the original video output in AVI or MOV format with a large file size.

2. Configuring

Click the Output tab. The encoder briefly explains how to use Push to server and Pull from encoder. For fast encoding, check Archive to file so that the output goes to your local computer. Give an output name and browse to find a folder for it. You must be aware that, no matter how many data rates you will choose for encoding, a neat feature of Window Media Encoder is that it will output only one file as Real does.

Click the Compression tab. It is the time for us to pick data rates. As you will find out immediately, our desired data rates are not listed here. So, we have to start with the similar ones—764kbps, 340kbps and 109kbps. Click Edit and we will change the data rate settings. A nice feature this encoder provides is that it allows you to export the configuration of a session so that you don't have to reconfigure if you will repeatedly use the same configuration.

Microsoft has discontinued its product support for Windows Media Player 9 for Mac and won't provide future updates. Instead, it has provided Flip4Mac, which enables users to watch Window Media videos with a QuickTime Player. A simple fact is, if a WMV can be played with a Windows Media Player 9 for Mac, it can too with Flip4Mac. If not, it can't with Flip4Mac, either. Our test shows that no codec in the Windows Media 9 series can encode videos for Mac access though Microsoft claims the other way. If you have encoded some great content with Window Media 9 Series, but many users can't access it, why bother? So, in order for both PC and Mac users to access a video, use Windows Media Video V8 encode or Windows Media Video V7 to encode the video though you can still encode the audio in the same video with Windows Media Audio 9.1. Here are two more facts you need to know if you want your WMV to be accessible on a Mac. You need to use the same video dimension across all data rates. You must use the lowest audio data rate that your lowest version uses for all data rate versions. Ouch! That really hurts the flexibility for streaming, doesn't it? Well, we have to accept what Microsoft can, or is willing to, offer.

Let's configure each data rate by starting with the 109kbps version by clicking its tab. The default audio format is 16kbps, 16kHz, stereo CBR. That is OK. Remember, you will use this audio format for all other data rate versions. The default video size is 240x180pixels. If you choose to use it, it will be used for the other two versions, too. If you make it 320x240 pixels, the same as the other two, those users who have the 128kbps connection speed may have trouble accessing this version since a video with a larger video size takes more time to upload and may rebuffer much more. So, what is our recommendation? You either bump up to 148kbps, the lowest version that allows 320x240 pixel and forget about those users who are still using the 128 connection speed, or use 240x180 pixels across the three versions. Our decision is to cater to the majority by using 320x240 pixels for all versions. Change Frame rate to 10fps. Change Video bit rate to 105k, and you will see the total data rate become 128kbps. On the bottom, as you can see, 7kbps has been assigned as overhead. That means, 7kbps are to be used as meta file information.

Click the 340kbps tab. Change the audio format to 16kbps, 16kHz, stereo CBR, Frame rate to 15fps, and Video bit rate to 335k. Click the 764kbps tab. Change the audio format to 16kbps, 16kHz, stereo CBR and change the video bit rate to 695k. Click OK. If you think you will come back to use the configuration in this session again in the future, you can give the session a name on top and export it now. Otherwise, click Apply.

You don't need to do anything under the Video Size tab since you have defined the sizes under Compression. Click the Processing tab and choose Deinterlace. Any time when an encoder provides the deinterlace option, you should take advantage of it.

Click Start Encoding on top. You can click Event Log on the bottom to trace the encoding process. After you are done, quit the encoder.

Now, you need to send your video file to the Windows Streaming Server. After you know the address of the video file on the streaming server, you will create an asx metafile with TextEdit or Notepad. The asx file looks something like this:

<asx version = "3.0">

	<entry>

			<ref href = "mms://149.166.148.197:8080/LiveStream"/>

			<Title>IUPUI Streaming Test</Title>

			<Author>Edgar Huang</Author>

	</entry>

</asx>

You have to use this asx file to point to the video on the streaming server, or a Web browser will not properly play the video. After the asx file is created, send it to a Web server.

SCREENCAST

To view the screencast for this tutorial, you must have the Adobe Flash Player plug-in. This screencast will walk you through the tutorial above.

WEB AUTHORING

Link To Wiki

To include a WMV Format Video into your home page is as simple as inserting something like into your HTML:

<OBJECT id="mediaPlayer" width="496" height="381" 
     classid="CLSID:22d6f312-b0f6-11d0-94ab-0080c74c7e95" 
     codebase="http://activex.microsoft.com/activex/controls/mplayer/en/nsmp2inf.cab#Version=5,1,52,701"
     standby="Loading Microsoft Windows Media Player components..." type="application/x-oleobject">
   <param name="fileName" value="http://www.iupui.edu/~nmstream/wm/wmstreaming.asx">
   <param name="animationatStart" value="true">
   <param name="transparentatStart" value="true">
   <param name="autoStart" value="true">
   <param name="showControls" value="true">
   <param name="loop" value="false">

   <EMBED type="application/x-mplayer2"
     pluginspage="http://microsoft.com/windows/mediaplayer/en/download/"
     id="mediaPlayer" name="mediaPlayer" displaysize="4" autosize="-1" 
     bgcolor="darkblue" showcontrols="true" showtracker="-1" 
     showdisplay="0" showstatusbar="-1" videoborder3d="-1" width="496" height="381"
     src="http://www.iupui.edu/~nmstream/wm/wmstreaming.asx" autostart="true" 
     designtimesp="5311" loop="false">
   </EMBED>

</OBJECT>

Seem Pretty easy?

Good — you might be able to explain it to us then...

To understand this, you simply need to look past the forest and into the trees and this might make a little more sense:

 <OBJECT id="mediaPlayer" width="496" height="381"
       classid="CLSID:22d6f312-b0f6-11d0-94ab-0080c74c7e95"
       codebase="http://activex.microsoft.com/activex/controls/mplayer/en/nsmp2inf.cab#Version=5,1,52,701"
       standby="Loading Microsoft Windows Media Player components..."
       type="application/x-oleobject">

The first section of code is the Object. It determines how to deal with the linked media. You have an 'id' stating that it is MediaPlayer, but this doesn't effect the Object much -- it is more for the Document Object Model built into your Browser. Furthermore, no 'id' should be used twice on a single page.

Next is the Width and Height. Simple enough. Listed in Pixels. It tells the plugin how big it needs to be, but you've already figured this portion out. After all, you were going to explain how this worked to me, weren't you?

The next line comes the ClassID -- this is a specific 'number' informing the browser which plug-in to send this information to. In the near, hopeful, future, this will be replaced solely with the Application Type. For now, memorize this number. You will need to use it any time you embed any Windows Media Video formats. Unless they update the player...

Next is the code base: it tells you where to find the plug-in if you do not have it installed on your browser. Note — it points to an ActiveX control that will work only on Windows based technologies. Using a Mac or Linux? Lets hope your browser is smart enough to understand this.

The Standby code simply tells the reader what is going on. You can use this for localization if you are dealing with a Non-English speaking audience. In all my years of dealing with this technology, I've never used it.

Finally the Type. This is specifically called a MIME Type. Originally used to describe media in email, it helps pad a little meta data to the object about the be received so that the browser can more accurately understand it. Contrast this with the ClassID. The ClassID requires a specific application that has been registered to this string. Type simply describes it and if an alternative application that you have chosen can play it, it will attempt to do so. This will be essential once more streaming technologies decide to turn to Standards. As we are talking about a Microsoft technology, we can go on with the belief that this will remain for the foreseeable future a non-standard and ignore this ideal.

The Parameter List

   <param name="fileName" value="http://www.iupui.edu/~nmstream/wm/wmstreaming.asx">
   <param name="animationatStart" value="true">
   <param name="transparentatStart" value="true">
   <param name="autoStart" value="true">
   <param name="showControls" value="true">
   <param name="loop" value="false">

The next set of parameters tells the applications to do something different. For instance, for our study, we did not want to show the controls as it would indicate almost immediately what sort of technology we were using. And we wanted it to start almost as soon as the page was loaded. As you can tell, an asx file is used to point to the media file on the streaming server.

For more of these parameters, check out w3school's informative reference guide. 1 Additionally, the Microsoft MSDN can explain a few other concepts 2.


   <EMBED type="application/x-mplayer2"
     pluginspage="http://microsoft.com/windows/mediaplayer/en/download/"
     id="mediaPlayer" name="mediaPlayer" displaysize="4" autosize="-1" 
     bgcolor="darkblue" showcontrols="true" showtracker="-1" 
     showdisplay="0" showstatusbar="-1" videoborder3d="-1" width="496" height="381"
     src="http://www.iupui.edu/~nmstream/wm/wmstreaming.asx" autostart="true" 
     designtimesp="5311" loop="false">
   </EMBED>
</OBJECT>

Finally, the Embed.

It has always gotten my goat that Internet Explorer’s non-standard use of the object tag has forced standards-loving browsers to use the non-standard embed tag in order to embed movies on a web page3.

These are the words of Elizabeth Castro on her aListApart article Bye Bye Embedded. Say what you will about standards, there are is a reason geeks get up in arms over certain companies 'embrace and extend' methodology. What's worse than Microsoft ignoring your technology? Microsoft deciding that you have a great idea. And that's where the Embed comes into play. An older Netscape extension that Internet Explorer generally ignores. Especially if nested inside an Object.

What do we do here? Pretty much the same thing we did in the Object Parameter List. But we do it according to standards...

Note: In order to play this correctly on newer browsers seamlessly due to the Eolas ruling, please see our javascript embedding tutorial.

By the way, if you happen to use Firefox to view an embedded Windows Media file, don't get frustrated if it doesn't play properly or does not play at all. You will be asked to download a plug-in. So test your Windows Media streaming video on an IE.

External Links

VX30 Previous

Next Introduction