Generating High Quality Animated GIFs using Imagemagick

Exporting & Previewing
3

Awesome technique, @christoph!

Here’s the steps:

  1. Open Terminal (/Applications/Utilities/Terminal.app)
  2. Install HomeBrew: http://brew.sh
  3. Run this command: brew install imagemagick
  4. Export a series of frames from your Hype document onto your desktop: File > Export as Movie > PNG Sequence
  5. Change your directory to your folder containing those images and run this command:
    convert -delay 3 -loop 0 *.png animated.gif
    The number 3 sets the delay between frames, and is good for 30fps playback. Here’s a list of options for ‘convert’.

64a5a1bb0bb2f5aeb4d0cb7ec47016c0dddbb935.gif724×391

One additional thing I would add is that you should drag + drop your resulting GIF into Imageoptim to optimize your GIFs file size.

2 Likes