Close

Close

Processing-Tutorial: Video Export

One of the most powerful features of Processing in comparison to all web-based approaches and frameworks (like p5.js) is the ability to export your sketches to any format you can imagine. Processing does not provide all of these options out of the box, but there are excellent libraries for any use case.

Since i use instagram to distribute my work, i’ve developed an optimized, slick workflow to export videos and i wanna share it with you today.

Let’s get started!

There are multiple ways to export a video from your sketch in Processing and i’ve tried them all. The most easy and intuitive one is utilizing a Processing-library called Video Export by Abe Pazos.

Before we can use that library in Processing, we have to install something called “FFMPEG” on our computer, which is a powerful software for video-conversion that can be used via the command-line. It is made for programmers and programmers install things a bit differently than “normal” people.

Please do me little favor and promise that you won’t stop working through this tutorial from now. The things we’ll do together in the next steps may look a bit overwhelming for you, but they are simply required. In the end you’ll don’t have to worry about them anymore. Let’s take a deep breath and get going.

Installing FFMPEG on a mac

1. Open up the Terminal

The Terminal is an utility-application of MacOSX that enables us to install the software we need. It can be found in the applications-folder inside “utilities”.

1. Install HomeBrew

Copy this code into the command-line of the terminal:

/usr/bin/ruby -e "$(curl -fsSL https://raw.githubusercontent.com/Homebrew/install/master/install)"

The script will install “HomeBrew”, which is a so called “package manager”. It enables us to install software via the Terminal easily.

If you are logged in as an admin, the script will ask you for your password. If you are not logged in as an admin in MacOSX, you’ll have to write the command above with a “sudo” in front.

sudo /usr/bin/ruby -e "$(curl -fsSL https://raw.githubusercontent.com/Homebrew/install/master/install)"

Put it in there and hit enter. The script will run a few seconds. Take the time to cook some tea or coffee.

2. Install FFMPEG

Then, put this code into theTerminal and hit enter:

brew install ffmpeg

Again: If you’re not logged in as an admin, you’ll have to put the “sudo” command in front and then type your username and your password.

sudo brew install ffmpeg

Hopefully everything works fine and we can go to the next section to install the actual library.

Installing FFMPEG on Windows

I don’t have a windows-machine and i can’t give you profound advices about installing the required tools on your computer. Sorry! If you know how to do it properly on Windows, then please drop me a line and tell me a bit about the installation process of FFMPEG. I would love to address all the people out there using any OS.

Installing the VideoExport-library

In Processing, go to the menu “sketch > import Library > Add Library”. The so called “contribution-manager” will open up. Click “Video Export” and then click “Install”. That’s it!

Using the VideoExport-library

Now you are ready to use the VideoExport-library in Processing. All you have to do is adding a few required extra-lines of code to your sketches.

// import the library
import com.hamoid.*;

// create a new VideoExport-object
VideoExport videoExport;

void setup() {
  ...
  // Some settings
  videoExport = new VideoExport(this, "myVideo.mp4");
  videoExport.setFrameRate(30);  
  videoExport.startMovie();
}
void draw() {
  ...
  // Save a frame!
  videoExport.saveFrame();
}

void keyPressed() {
  if (key == 'q') {
    videoExport.endMovie();
    exit();
  }
}                                                                                   

The options can be looked up in the library-folder:

your-processing-folder/libraries/VideoExport/examples/options/options.pde

Now get creative and make something awesome!

    Published by Tim on Sunday April 14, 2019

    related blogposts

    19. July 2019

    Getting started with Creative Coding

    I quite get often asked for advices on how to get started with creative coding. These are my most essential […]

    16. April 2019

    Processing-Tutorial: Kinetic Typography 1

    In the last years i’ve observed a new tendency in typography and graphic design which has been made possible by […]

    1. March 2019

    How to rasterize an image with Processing

    In this post i’ll teach you how to access the data of an image and how to use it to […]

    28. February 2019

    My 10 favorite Processing-libraries

    So called “libraries” extend the functionality of the software-development-enviroment Processing. Please handle those extensions with care: If you are a […]

    18. December 2018

    Processing or p5.js? My opinions

    In this video i share my opinions about the benefits of p5.js and Processing. I also talk about how i’ve […]