Use Processing and FFmpeg to export HD video

p_000919

I’ve been trying to find a dependable method for exporting HD video from Processing sketches that contain dynamic data and movement as well as complex 3-dimensional shapes rendered using OpenGL. QuickTime’s screen recording option hogs memory and causes frames to skip, as does does ScreenFlow, my usual go-to for screen recording. The best way I have found so far is to export actual resolution PNG files using “save()” and create an HD video using FFmpeg.

FFmpeg is a very fast video and audio converter that can also grab from a live audio/video sources or create and compress video from multiple still images. It is used from the command line and gives one control of bitrates, codecs, formats, resolution, quality, metadata, and many more options for working with video.

To install FFmpeg with Macports
sudo port install ffmpeg

# view help
ffmpeg -h

# list encoders
ffmpeg -encoders

# list codecs
ffmpeg -codecs

# use format
ffmpeg [global_options] {[input_options] -i ‘input_file’} ... {[output_options] ‘output_file’} ...

# make a movie from matching .png files, write over original, codec = libx264 (H.264), framerate = 30, 1 pass, resolution = 1920×1080, video bitrate = 6Mbits, format = mp4
ffmpeg -y -pattern_type glob -i 'p_*.png' -vcodec libx264 -r 30 -q 100 -pass 1 -s 1920x1080 -vb 6M -threads 0 -f mp4 file.mp4

# convert the video file to Apple ProRes codec for use in Final Cut
ffmpeg -y -i file.mp4 -vcodec prores -vb 6M -r 30 -s 1920x1080 -f mov file.mov

# here’s another example conversion command. this one has a much higher bitrate
ffmpeg -y -i file_01.mp4 -b:v 40M -vcodec libx264 -pass 1 file_02.mp4

For example, using this Processing sketch, you generate the PNG files, and then run the code above on the command line to make this file:

Also see this video for a more detailed example

References



4 Responses to “Use Processing and FFmpeg to export HD video”

  1. Jeff Thompson Says:

    Nice to see someone else using ffmpeg the same way! I’m curious about a few of your settings:

    1. How did you arrive at the video bitrate of 6Mbits?
    2. Since you’re including them as options (but me not sure what they do), I’m guessing that you intentionally chose ‘threads’ to be 0 and ‘pass’ to be 1 – any particular reason?

    Also, nice filename pattern! Much more flexible than mine which is very finicky about numbering, etc.

  2. ow3n Says:

    Likewise! It was very interesting to discover your sketch after figuring out it could be done. I was actually searching/hoping to stream the images straight from Processing but this method is dependable.

    1. I kept pushing it higher and higher until I the difference between the quality of the original PNG files and the video was acceptable. Many users on other forums pushed FFmpeg higher than 10Mbits.

    2. “Threads tells FFmpeg to guess how many threads to use depending on number of cores” ref, and “pass 2″ failed so I just left it at one pass.

    Thanks! There is probably something cleaner in Java for leading zeros but I was in a hurry :-)

    PS. Enjoyed the work on your site as well as your curatorial practice. Wikipedia Loops is very nice. I am looking forward to reading the Leonardo piece. Is it the “All About Data” issue?

  3. Jeff Thompson Says:

    Hmm, I’ll have to play with the settings some more. I’ve been really happy using the PNG codec, for what it’s worth – since I write my frames as PNG there is little-to-no loss, though the video files are really big.

    Also: thanks! The Wiki Loops piece will be the data issue – final editing as we speak!

  4. ow3n Says:

    Yeah x264 makes small-ish files even at that high bit rate.

    Cool, we’ll be in the same issue.

Leave a Reply