The Image Sequence overlay can add simple animations to your Adobe Digital Publishing Suite app. The most common function is to show the 360-degree rotation of an object or a time-lapse sequence. An Image Sequence, created using the Folio Overlays panel, points to a folder of source images. There are several ways to create Image Sequence source images. One quick and simple way to create them from a video file is to use Adobe Photoshop’s Render Video export command.

Source Image Notes
  • For a smooth transition between images, at least 30 images should be used.
  • The source images should be named with the same root and ascending suffixes during export (for example: Orange001.jpg, Orange002.jpg, Orange003.jpg).
  • Each source image should be exported at the exact pixel dimensions of the content frame in which it will be placed.
 Create Source Images
  1. Open the video file in Photoshop, and then choose File>Export>Render Video.
  2. Change the settings in the dialog box as needed.
  3. Select Render.

PS-Render-Video1

Some important settings include:

  • Name This will be the prefix to the exported source image names.
  • Folder/Subfolder Choose the folder and subfolder to save the source images in. Note: Store all source images in a folder inside the issue’s Overlay Assets. You’ll point to this folder to create the overlay.
  • Choose Photoshop Image Sequence option.
  • Format Choose JPEG format (PNG if you wish to include transparency), with medium compression.
  • Number Format Choose the numbering format that will be added to the source image filenames.
  • Size Enter the size of the content frame that will be used in the layout.

Note: Frame Rate and Range options will be selected on a case-by-case basis, depending on the type of results you are looking for, and you will need to experiment. Remember, you will not have to use all of the exported images in your sequence if you can get the desired results from a smaller selection.

PS-Render-Video2

Create Image Sequence Overlay
  1. Create the container frame in your InDesign layout.
  2. Use File>Place to insert an image as the poster if you do not intend to use the first image of the sequence.
  3. With the content frame selected, choose Image Sequence from the Window>Folio Overlays panel, click the Load Images folder icon at the top, and locate the folder where you exported the source images to.
  4. Use the options in the Image Sequence panel to specify settings such as Auto Play, Tap to Play/Pause, Loop, Stop at Last Image, Swipe to Change Image, and Play in Reverse.

PS-Render-Video3

Check out TFP’s DPSCreate™ Handbook or DPS Create™ App for more details about adding an Image Sequence Overlay and building interactive iPad apps.

For other great tips, sign up for the TFP newsletter. Want to learn even more and become an expert? Check out all our best-selling products at www.tech4pub.com/products,  including our DPSCreate™ app at www.tech4pub.com/product/dpscreate-ipad-app/.

Note: Information contained in this post is current as of DPS v31.3. Visit the Technology for Publishing blog at www.tech4pub.com/tag/dps-version-update/ for the latest info on Adobe software releases and functionality.

Posted by: Monica Murphy

Monica Murphy has worked in the publishing industry for over 30 years supporting publishing operations of various sizes. In her role as Technical Product Manager for Technology for Publishing, she shares her publishing application expertise supporting a broad range of publishing clients in InDesign best practices, cross-platform content workflows, and InDesign Template strategies. Her weekly tip and blog posts have a committed following in the InDesign community, and as a long-time participant in the InDesign pre-release community, she regularly analyzes and provides feedback for upcoming features. Monica manages the authoring and publication of Technology for Publishing’s handbooks on InDesign, InCopy, and other associated titles.