Log In  


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

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

Animated GIFs can be:

  • viewed frame-by-frame using macOS Preview.app
  • manipulated using "gifsicle" command line tool
  • converted using "ffmpeg" command line tool

Notes

  • useful tools need to be installed using "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:

TRIMMING

required: gifsicle

brew install 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)

RESIZING

if you want to double size of the image:

gifsicle --scale 2 trimmed.gif > resized.gif

CAPTIONING

if you want to add an overlay to caption the animation

required: imagemagick

brew install imagemagick

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

CONVERT TO VIDEO

required: ffmpeg

brew install ffmpeg

to convert the GIF to MP4:

ffmpeg -i trimmed.gif video.mp4

video uploaded to YouTube:

EASY?

If there is enough demand I will create a trimming tool that does not require you load terminal every time.

6


Resize command now done using gifsicle rather than ffmpeg for sharper results


Added example animations, images and video.


Hey there, thanks for writing this up. I just wanted to add to this that you can also tell gifsicle to super-optimise your GIFs by adding the option -O3 on the command line. This removes redundant frames, and also only leaves parts of frames where the image has changed. I also recommend using the --careful flag with this, to do it in a way that makes the GIFs more compatible across different viewers.

So you could do this using a command like:

gifsicle -O3 --careful input.gif > output.gif

Good point!

If you do use optimise, -O, and you want to edit the GIF further then be sure to use -U to unoptimise it otherwise the editing commands won't work as expected. This is the reason I left it out.

If in doubt, optimise a copy of your animation.



[Please log in to post a comment]