Use FFmpeg to turn video clips into animated *.gifs
Use FFmpeg to turn video clips into animated *.gifs

Use FFmpeg to turn video clips into animated *.gifs

Tags
documentationffmpeg
Date
March 15, 2024
Class
Author
Z
Zach
Class Section
Documentation Type
tutorial

Documentation is important! Sometimes a picture doesn’t tell an audience enough, but a full-length video is just… too much. Short inline animated *.gifs are a great compromise; you can set them to loop continuously so the reader doesn’t need to fuss with seeking out the relevant part as they would with a long-form embedded Youtube clip. Note that if you’re doing this outside of Notion, it’s more space-efficient to embed trimmed and compressed *.mp4 files using the HTML <video> tag; however, Notion prefers you use the Image function to add a *.gif.

There are plenty of ways to make animated *.gif images, including mashing together individual frames in Photoshop or using one of a myriad of online tools like GIPHY or Adobe Express. But if you prefer to work locally, want maximum flexibility, and are stoked to use command-line tools, FFmpeg is worth a try.

Installation

You will need admin access to your computer; if you don’t have this, ask your friendly local IT person for help.

Windows

Head to the FFmpeg download site and grab one of the compiled Windows *.exe files. Extract the resulting archive and move the FFmpeg folder to your hard drive root directory (typically C:\). You’ll need to add FFmpeg to your system path so you can invoke the commands from any folder. To do this, first open Command Prompt as an administrator by typing ‘cmd’ into the Windows search bar, right clicking Command Prompt, and selecting Run as Administrator. Now, type the following command in and press enter:

setx /m PATH "C:\ffmpeg\bin;%PATH%”

Test the path update by opening a new Command Prompt window and typing the following command and pressing enter:

ffmpeg -version

This should return the FFmpeg version. If you get an error, make sure you updated your path as an administrator, and ask your friendly IT person for help.

Mac

FFmpeg can be installed using Homebrew. If you don’t have that utility installed, open a Terminal window, type in the following command, and press enter:

/bin/bash -c "$(curl -fsSL https://raw.githubusercontent.com/Homebrew/install/HEAD/install.sh)"

Double-check that the installation worked by typing the following command and pressing enter:

brew --version

You should see a version number pop up, like “Homebrew 4.2.10”. Once this is verified, you can install FFmpeg:

brew install ffmpeg

Once the installation process is finished, verify everything works:

ffmpeg -version

Use

Record a video and send it to your computer! There are many ways to do this; an easy way is with your cell phone and Google Drive, but a nice camera also works if you want to be fancy. Open a Command Prompt (Windows) or Terminal (Mac) window and navigate to the folder that contains your video file. Now, simply invoke the following FFmpeg command to rescale, trim, and GIF-ify your video clip:

ffmpeg -i input_file.mp4 -vf scale=800:-1 -ss 00:00:02.0 -t 00:00:15.0 -c:a copy output_gif.gif

Notable options:

  • input_file.mp4 is the raw video file name (often something like “V_20240308_185527_ES0.mp4”, depending on your phone or camera’s default naming convention)
  • scale=800:-1 sets the rescaled width to 800 pixels, keeping height proportionate. For a standard HD 16:9 video, that shrinks things down to 800x450 pixels which is a good *.gif compromise between clarity and file size.
  • -ss 00:00:02.0 -t 00:00:15.0 trims the file to start at 2.0 seconds and last for 15.0 seconds. This is a tiny bit non-intuitive; the second number isn’t the stop time, which in this case is 17.0 seconds. It’s the duration! You’ll figure it out.
  • output_gif.gif is the output file name. Note that since we invoked the copy command, the source video does not get modified. If you are embedding an *.mp4 video, you can just change the suffix of the output file to *.mp4 and FFmpeg will figure it out. Very nice.

A wonderful thing about the command line is that you can repeat the previous command by pressing the up arrow. I do this a lot when I’m trimming/scaling/GIF-ifying a bunch of files, and just modify a few characters each time I re-invoke the command.