h.264 snippets

How to install ffmpeg, mencoder and flvtool2 on Mac OSX Leopard, convert an AVI to FLV, and view the FLV video with FlowPlayer

Tagged flv, ffmpeg, flvtool2, osx, leopard, mencoder, h.264  Languages bash

This is a short tutorial on how to quickly get up to speed with FLV movie creation (transcoding) and viewing (Flash player).

I tried to install ffmpeg using ports and fink, but had problems. The instructions I found here work though.

The following is my adaptation of the instruction, where I show you how to install both ffmpeg and flvtool2.

First, download ffmpegx, which contains ffmpeg from http://ffmpegx.com/download.html

Then, mount the .dmg file, navigate to the mounted disk, and control-click on the ffmpegX application (ffmpegX.app), choose Show Package Contents from the pop-up menu, and copy the ffmpeg binary to, for example, /tmp.

Now execute the following commands in a terminal shell:

# Move ffmpeg to /usr/local/bin:
sudo mv /tmp/ffmpeg /usr/local/bin/

# Change owner and make executable
sudo chown root:wheel /usr/local/bin/ffmpeg
sudo chmod 755 /usr/local/bin/ffmpeg

You're now ready to use ffmpeg; the following command lists all the supported input and output formats:

ffmpeg -formats

Use the following command to transcode an AVI to FLV (Flash video) format:

fmpeg -i mymovie.avi -s 320x240 -ar 44100 -r 12 mymovie.flv
cat mymovie.flv | flvtool2 -U stdin mymovie.flv

To add metadata to the FLV file—such as video length, which is required for the Flash player progress bar—you need to install flvtool2.

This is done with the following command (note this requires Ruby and RubyGems, which are not part of all OSX Leopard installations):

sudo gem install flvtool2

Now add the metadata to the FLV file:

flvtool2 -UP mymovie.flv

To test the FLV movie you just created, download and extract FlowPlayer to your folder of choice. Now create a page that loads your FLV movie; note that you need to update the paths:

        <script type="text/javascript" src="../flowplayer/html/swfobject.js"></script>
    <div id="flowplayerholder">
        This will be replaced by the player. 
<script type="text/javascript">
// <![CDATA[
var fo = new SWFObject("../flowplayer/FlowPlayerDark.swf", "FlowPlayer", "468", "350", "7", "#000000", true);
    // need this next line for local testing, it's optional if your swf is on the same domain as your html page
    fo.addParam("allowScriptAccess", "always");
    fo.addVariable("config", "{ countryCode: 'fi', playList: [ {overlayId: 'play' }, { url: '/mockup/mymovie.flv' } ], initialScale: 'scale',  fullScreenScriptURL: 'fullscreen.js' }");
// ]]>

I've been told that mencoder produces higher quality FLV videos, so lets compare the mencoder output to ffmpeg by first downloading and extracting mencoder to /tmp.

Now move mencoder to /usr/local/bin:

sudo mv /tmp/mencoder /usr/local/bin/

sudo chown root:wheel /usr/local/bin/mencoder
sudo chmod 755 /usr/local/bin/mencoder

Next transcode the video to FLV format using mencoder:

mencoder mymovie.avi -ofps 12 -o mymovie.flv -of lavf -lavfopts \
i_certify_that_my_video_stream_does_not_use_b_frames -oac lavc -lavcopts \
acodec=mp3:abitrate=32 -srate 22050  -ovc lavc -lavcopts vcodec=flv:\
vmax_b_frames=0:vb_strategy=1:precmp=2:cmp=2:subcmp=2:preme=2:qns=2 \
-vop scale=360:240

View the video in the Flash player; you should notice the difference in quality...

For even higher quality encode the videos using the H.264 format, which FlowPlayer also supports; instructions can be found here.