Post-processing Animated GIFs

SDK Get Help
1

I was interested to see how easy/difficult it is to edit the animated GIF recordings. My goal was to trim some frames from the beginning and end to make a more succinct video.

After much trial, error and experimentation here are my findings using Mac OS X.

This guide was original created for pico8 but is useful for Playdate also. I will change the GIFs soon.

Overview

Animated GIFs can be:

  • viewed frame-by-frame using system Preview.app
  • manipulated using "gifsicle", "imagemagick", "graphicsmagick" command line tools
  • converted using "ffmpeg" command line tool

Notes

  • useful tools need to be installed, you may wish to use the "brew" command line tool http://brew.sh

Viewing

  • Open the GIF in Preview.app and it will show you all frames.
  • Preview calls the first frame 1 (one), but other tools usually call it 0 (zero).

original/source animated GIF:
xawXTqtr0vOOW7hIhCaotygNzy7

Un-Optimising

Warning: If you have previously optimised your GIF to reduce filesize, as in this other thread, and you want to edit the GIF further then be sure to first use gifsicle -U to unoptimise it, otherwise the editing commands won't work as expected.

Trimming

required: gifsicle

then this is how you trim
gifsicle anim.gif "#212-238" > trimmed.gif

note: this makes a copy of the GIF and keep frames 213 to 239 (gifsicle uses zero based frame count)

YaTs2ED

Resizing

if you want to double size of the image:
gifsicle --scale 2 trimmed.gif > resized.gif

XCyedCT

Captioning

if you want to add an overlay to caption the animation

required: imagemagick or graphicsmagick

then use this bash script:

#!/bin/bash
source=$1
caption=$2
: ${1?"Usage: $0 anim.gif overlay.gif [output.gif]"}
: ${2?"Usage: $0 anim.gif overlay.gif [output.gif]"}

fnsource=$(basename "$source" .gif)
fncaption=$(basename "$caption" .gif)

output=${3:-"$fnsource-$fncaption.gif"}

gifsicle -E $source
for f in *.gif.*; do composite $caption $f $f; done
gifsicle --loopcount *.gif.* > $output
rm *.gif.*

how to run the command
./caption.sh anim.gif overlay.gif [output.gif]

note: if you do not specify an output name, it will be named using original filenames, eg. anim-overlay.gif

caption.gif

xrWewys

Converting to Video for YouTube

required: ffmpeg

to convert the GIF to MP4:
ffmpeg -i trimmed.gif -movflags faststart -pix_fmt yuv420p video.mp4

video uploaded to YouTube:

4 Likes