ffmpeg: 1 audio file + js animation = 1 mp4 video

Question

I would like to make an mp4 file from 1 audio file and some java script animations produced on a browser ?! How is that possible please? Any working example or ideas would be greatly appreciated.

Thank you everyone

Answer 1

first solution

Use a software to capture your screen (like quicktime, camtasia, ...) and create a composition with ffmpeg ( How to add a new audio (not mixing) into a video using ffmpeg? )

Second solution

if you want to automate the recording, use CasperJS (casperjs.org) to take multiple screenshots like that

[...]

var count       = 0,
        max         = 10,
        delay       = 500,
        self        = this;

    for(var i = 0; i < 10; i++){

        self.wait(delay, function() {

            self.captureSelector('temp-' + count + '.png', "html");

            count++;

        });
    }

[...]

CasperJS create a frameset, you have just to create a video from this frameset :

ffmpeg -f image2 -i temp-%d.png -r 10 -vcodec mpeg4 -b 15000k your_movie.mp4

And after, add the song ( How to add a new audio (not mixing) into a video using ffmpeg? )

Answer 2

Easiest way is to use a video capture tool (quicktime, vlc, etc.) to get the animation and then add in the audio afterwards. If you'd like to this programmatically you can do something like this .