Banners & ads (when HTML5 is not needed or supported)
Social media images (e.g., for Twitter, Facebook, and Linkedin timelines)
Thus far, the best way for a creative to create an animated GIF was to
Open Adobe Animate
Create animations using tweens
Export as video
Open the video in Photoshop (because Animate doesn’t do a great job with the colors)
Export as a GIF using the Save for Web dialog
That process is okay if you’re fairly comfortable with both Animate and Photoshop, but it’s a bit convoluted even then (created the tweened animations, especially).
I recently opened Adobe Animate, which was formerly Flash Professional, to create an animated GIF. Even though I lived in Flash Pro for years, it still took me a half hour to create a simple 125 x 125 pixel ad.
Don’t get me wrong, Animate is great if you want fine control of your animation, but sometimes that’s overkill.
Why use InDesign?
In comparison, InDesign’s animation tools are superbly easy: simply apply a motion preset (adjust if needed). No keyframes, no timeline.
If you just need some simple fades and fly-ins this InDesign workflow is ideal.
The main limitation: There hadn’t been a way to export InDesign’s animation as animated GIFs, but now there is.
How to Create an Animated GIF using InDesign
Here’s a quick outline of the steps.
Create a new file in InDesign. in5 v3.5.1 comes with a convenient Social Media Image document preset.
Add a Motion Preset via the Animation panel (Window > Interactive > Animation). Adjust and repeat with other items if desired.
(Optional) Adjust the sequencing of multiple animations using the Timing panel (Window > Interactive > Timing).
Export using in5 (in5 > Easy Export Wizard).
Open the exported content in Google Chrome and use the in5 Animated GIF Maker extension to record and save your GIF.
You can now share the file via email or via social network updates.
When I added Presentation Mode to in5, I didn’t quite know all the ways that people would be using it, but I quickly received some reports about really cool projects.
José Gouveia was one of the first designers to jump in and start creating inventive presentations.
He’s using InDesign to design his layouts (including animation and video) and in5 to export those layouts to self-running HTML presentations that he can display at tradeshows.
He displays the presentation in a kiosk app like Dave Hickey‘s project, but on a tall, vertical monitor (using Android), instead of an iPad.
My goal when I first conceived of in5 was to put more control into designers’ hands. There was a new world of tablets and smartphones and it was difficult to create content for those devices if you weren’t a developer.
in5 made the process easy by letting you design with InDesign and create interactive experiences that work on all devices.
Six years later and I’m very excited to deliver yet another update that let’s you do more with your interactive content—directly from InDesign—without coding.
This latest update
Offers new ways to create interactive elements
Extends the control over existing elements (like video)
Lets you easily create new types of content (like animated Google Ads)
Lets you brand the built-in elements of your digital magazines
Produces smaller files, and
Let’s your track additional reader behavior with Google Analytics
Let me show you what all of that control looks like…
“I just printed out a poster on foam core, cut out a space for my iPad, and stuck it to the kiosk unit.”
That’s Dave Hickey, designer of The Artful Astronomy of L.M. Montgomery—an interactive kiosk app built with Adobe InDesign and in5—referring (modestly) to the beautiful display he created in the image above.
