Improving GIF Rendering with the Command line, Apps & more

We use Apple's built in GIF creation library, and unfortunately it skips some colors (for no good reason) and does not look as crisp as it should. Some animations export perfectly, while others have blurry text or are missing many colors.

If your GIF export never finishes, and your GIF duration is under 30 seconds, please follow these instructions to switch to the older GIF export engine.

Top recommendation:

Gifski

This tool lets you drop in a video and it outputs a high quality GIF: https://gif.ski

In my tests it makes very high quality GIFs. (You can export a MP4 video from Tumult Hype). Just make sure your video isn't too large in both duration and resolution. Something smaller than 800x800 and under 10 seconds is ideal. Otherwise, you'll end up with huge files and you may as well use a muted MP4 in that case.

Command Line Tools:

Comfortable with the command line? Here's one way to get better detail out of your GIFs using a command-line tool.

Video -> Frames -> GIF (in Photoshop)

Video --> Gif: Or, you could first Export as a Video (File > Export as Movie > MP4), and then import that video as frames to Photoshop. In Photoshop, you can select Window > Timeline to get fine-grained control over your Gif.

Mac Tools for Gif Capture

GIPHY CAPTURE

You could also directly record your screen using a tool like GIPHY Capture. You would just place the GIPHY capture window over your Tumult Hype document's preview. (We recommend Safari for best performance).

LiceCap

Licecap functions similarly. Download it 'here' and record the Safari browser playing your document.

GIFROCKET:

Another solution is to drop that exported Video file into Gifrocket, a tool for turning videos into GIFs. GifRocket does a great job at maintaining colors from a video. Visit their site.

Font issues?

Can you confirm that you have added 'localhost' to your allowed domains to preview on your computer? (Follow these instructions).

This is great, thanks so much! Any way to make gifrocket .gifs not do the looping? Couldn’t find anything on it, assume it’s not possible. I can do the photoshop method, but was just curious.

Don’t think so – I’ve gotten in touch with the creators (a while ago) but haven’t heard back.

OK No worries, thanks Daniel!