I’m using Aseprite, and recently came across the “record for aseprite” script for it that allows taking regular snapshots of what I’m currently drawing so a timelapse can be created from that. And that works nicely, but I had to realize that the timelapse would come with transparency until I came to the background during my drawing, which looked really weird when sharing the resulting GIF.

So I looked into adding the usual transparency checkerboard background to the GIF with a quick script, and of course, ImageMagick once more to the rescue. Alas, the resulting GIF was quite large and ImageMagick’s optimization options caused glitches in the GIF. So I looked for another option to optimize the GIF and came across gifsicle.

The result is this bash script which will take a GIF and an optional background image to set, add the background (or a freshly generated checkerboard pattern of the right size) to the GIF, then compress the GIF:

#!/bin/bash

GIF=$1
BG=$2

BASE=$(basename "${GIF%.*}")
OUTPUT="$BASE.bg.gif"

if [ -f "$BG" ]; then
    echo "Adding background image $BG to all frames of $GIF..."
    magick "$GIF" -coalesce null: "$BG" -compose dstOver -layers composite "$OUTPUT"
else
    size=$(gifsicle --sinfo "$GIF" | grep "logical screen" | xargs echo -n | cut -d" " -f 3)

    echo "Generating a $size checkerboard pattern and adding it as background to all frames of $GIF..."
    magick "$GIF" -coalesce null: \( -size $size tile:pattern:checkerboard \) -compose dstOver -layers composite "$OUTPUT"
fi

echo "Optimizing $OUTPUT..."
gifsicle --batch -O3 --lossy=35 "$OUTPUT"

echo "...done!"

Example call:

$ gif_bg 14.gif 
Generating a 256x256 checkerboard pattern and adding it as background to all frames of 14.gif...
Optimizing 14.bg.gif...
...done!

I’m quite happy with the result:

Gina Häußge @foosel@chaos.social

Now also with a creation timelapse (after I finally managed to get a proper workflow going for that)

October 14, 2024, 14:43 (UTC)