Structuring Files for DPS

If you’re using the Adobe Digital Publishing Suite to create apps for mobile devices such as the iPad and Kindle Fire, it’s important to structure your source files appropriately. There are two main reasons for structuring files appropriately:

  • To import articles, re-create folios, or create folio renditions for multiple devices.
  • To transfer files from one computer to another.

Structuring Files for Import

The Folio Builder panel offers two methods for creating articles: using the Add button to create an article or layout from the current document, or using the Import option to import one or more articles. When you use the Import method, the folder structure determines how the article is imported. This is all explained in the Structuring folders for imported articles help topic. Here is a quick summary of the article:

  • If you’re importing multiple articles, create a parent folder with article subfolders.

  • For articles based on InDesign source documents, create InDesign files with _h and _v suffixes such as kayaking_h.indd and kayaking_v.indd. Be consistent with your orientation: each article folder should have either one InDesign file (horizontal or vertical) or two InDesign files for dual-orientation files. Although we recommend that you include all your image files and overlay assets in the article folder, it isn’t required. Files you link to can be anywhere on your system.
  • For articles based on HTML files, include only the HTML assets you’re using for the article. Unlike InDesign source files, all HTML assets in the folder are uploaded, sometimes resulting in folio bloat. For single-orientation folios, make sure that the HTML file includes a _h or _v suffix, such as index_h.html.
  • If you want to use a special icon that appears when users tap the Table of Contents icon in the viewer, add a .png file to the article folder. Make sure that you use a small, 70×70 image for this TOC file — it doesn’t get resampled. Also, keep other image files inside a subfolder so that an image isn’t accidentally used as the TOC file. The above screen shot shows TOC images in each folder. These images appear when you open the Folio Basics issue in DPS Tips and tap the TOC icon, as shown here:
  • When importing multiple articles, you can include a sidecar.xml file that brings in article metadata, such as the article author and description. Again, see the Structuring folders for imported articles help topic for tips on working with the sidecar.xml file.

Structuring Files for Overlays

Some DPS overlays require the source files to appear in their own folder. These overlays include Image Sequence, Panorama, Audio controller skins, and local Web Content files.

For Web Content overlays based on local HTML assets instead of URLs, make sure that the HTML file you specify appears in its own folder. All content in the HTML folder gets uploaded with the article, so this folder should include only the HTML assets used in the HTML file.

These overlay folders can appear anywhere on your computer, but we recommend that you keep your overlay files in the article folder to keep things tidy in case you need to transfer files.

Moving Folio Files to a Different Computer

If you need to transfer the source files for InDesign CS6, simply use the Package feature (in InDesign, choose File > Package) to package the InDesign file and transfer the packaged contents. InDesign CS6 includes all the assets, including overlay assets. Overlay assets are stored in an “Overlay Assets” subfolder. When you transfer the packaged contents to a different computer, the files maintain their links.

Transferring the source files for InDesign CS5 and CS5.5 is a different matter. When you package files, the overlay assets are not included. For best results, follow these steps:

  1. Open the InDesign CS5/CS5.5 source document and package it (for best results, do this early in the process to avoid having to relink overlays). You’ll end up with a folder that includes a Links subfolder, a Fonts subfolder, and instructions.txt. You can delete the instructions.txt file.
  2. If the article is part of a dual-orientation folio, add the alternate layout document to the packaged folder. Use the appropriate naming conventions for the document: article_h.indd and article_v.indd.
  3. Add all image and resource files — especially overlay assets — to the articles folder. I like to keep all assets, both interactive and non-interactive, in the Links subfolder.

When you transfer the files from one computer to another, you should be able to relink all the image files without a hitch. However, you (or the person receiving the files) will most likely need to select each overlay that links to local files — Image Sequence, Panorama, Audio skins, and local Web Content files, and use the Overlay Creator panel to point to the right location. You’ll likely see a yellow triangle above the assets icon. If you try to import an article before relinking the overlays, you’ll get an “Invalid assets” error message.

Which Files Are Uploaded?

Finally, let’s talk about which files get uploaded when you create an article. Understanding this will help you to determine which type of files to use in your layout and how to reduce folio size.

Non-interactive text and images – Each text frame, object, shape, or overlay poster that is not part of the actual overlay is resampled and included in part of the background image generated for each page of the article. This background file’s image format — PNG, JPG, or PDF — is determined by the Image Format setting when you create the article. For each page, a 72-ppi image is created using the same dimensions as the folio size (such as 1024×768).

The takeaway here is that you can use large PSD, AI, and TIFF files for non-interactive content in your InDesign layout. For best results, use images with at least 144 effective ppi.

Interactive source files that get resampled – Any image or source file that’s part of a slideshow (multi-state object), scrollable frame, button or hyperlink, is resampled as a 72-ppi PNG or JPG file.

Pass-through interactive source files – When you create an article, the source files for certain image formats are uploaded to the server without being compressed or resampled, even if the frames for these overlays are resized.  These overlays include Image Sequence, Panorama, Pan & Zoom, Audio controller files, local Web Content files, and Audio and Video files.

The takeaway is that you should compress and resize certain overlay files to keep folio size to a minimum.

Let me know if I missed anything.

21 Responses to Structuring Files for DPS

  1. Hi Bob,
    Thank you for the article. Does exists a solution for importing multiple articles have alternate layouts?

    • Bob Bringhurst says:

      Not yet. I hope the ability to import documents with alternate layouts comes soon.

  2. Pingback: Structuring Files for DPS « InDesign Docs | InDesign | Adobe-Tutorial.com

  3. Pingback: Structuring Files for DPS | Bookmarks.Funmax.org

  4. Pingback: This Week in InDesign Articles, Number 92 | InDesignSecrets

  5. Christopher says:

    I’ve followed the parent folder/article subfolder structure and neither my sidecar.xml file, nor my TOC preview images are importing. Has anyone else had this issue?

  6. Beth Renneisen says:

    Hi Bob — I have a client who insists on keeping all of their assets (no html) in a single external folder and not resizing them from Hi-res CMYK psds and tiffs that they made for their print version. They just physically shrink everything about 30%. They were able to make a folio that works on the iPad viewer, but the file is still large. Judging from your explanation above, the majority of their files would be resampled anyway, but I want to make sure they won’t have functionality problems with iTunes or other services that sell their magazine. Mostly their interactivity is slideshow MSOs or Video with built-in tap to play. Thanks!

    • Bob Bringhurst says:

      They should be fine, although they should check their colors, since CMYK will be converted to RGB.
      Those TIFF and PSD files will be resampled and compressed just fine. They should also check their video compression, since video files are passed through directly without compression. Videos are the likely cause of their large assets. (Oh, and I haven’t had a chance to look at your panoramas yet, but it’s on my list.)

      • Beth Renneisen says:

        Got it … And the one big folder for all assets? Does it matter where that lives exactly and/or what it’s named?

        • Bob says:

          No, not unless a web overlay points to an HTML file in that folder. If you want to transfer the files to a different folder, you need to package them.

      • Beth Renneisen says:

        Hi Bob — I have a similar client who insists on using all CMYK. Will ALL of their photo files be converted to RGB, regardless of how they’re being used in the article? Interactive or not?

        • Bob Bringhurst says:

          Using all CMYK is fine as long as they check the colors on the target devices. When the images are converted to RGB, some color shifts might occur.

          • Beth Renneisen says:

            So it doesn’t matter whether the use of the photo is for an interactive element or static, ALL photos will end up RGB anyway, right?

          • Bob Bringhurst says:

            Yes, it does matter. There are basically two types of overlays: resampled and pass-through. Resampled overlay assets are converted from CMYK to RGB, so it shouldn’t be a problem. Pass-through overlays are not resampled. It would be fairly easy to run into a situation where there is a color shift between the poster of an image sequence and the image sequence itself, for example. In this case, the poster is resampled as part of the background while the image sequence images aren’t resampled. Keep trying to talk the publisher out of using CMYK images in the DPS workflow.

  7. Sunil says:

    In the above image of the Table of Contents (toc.jpg), under the Article names, we sometimes see two icons. One square within a square, the other a Play button. What do these icons mean, and can they be removed?

    Image link below:
    http://blogs.adobe.com/indesigndocs/files/2012/07/toc.jpg

    We have them appearing in one of our apps, and, since they don’t appear under every article, and are not clickable, we’re getting some complaints from users that they’re confused by them.

    • Bob Bringhurst says:

      I haven’t seen that before. Would you mind going over to the user forum (http://forums.adobe.com/community/dps) and starting a new thread with a screen shot of what you’re seeing? I’ll make sure to jump in over there.

      • Richard Scott says:

        Hi Bob,

        I’m trying to find the solution to this as well, but couldn’t find a post on the community – did you ever get to the bottom of this? I can’t seem to find anything in any of the DPS documentation!

        Thanks, Rich

  8. Beth Renneisen says:

    Hi Bob — I need to package an entire issue of a magazine to give to another artist. How do I do that? I need to be in InDesign to use the Package feature, so if I open just one page … say, the Cover_v … and choose package, it will only package fonts and assets for that article, right? How do I do all the articles at once? I suppose I could just .zip the whole thing, but it would be huge. Your help appreciated. Thanks, Beth

    • Bob B. says:

      You could add your documents to a book and then package the book, but it might be easier to just package each article one at a time.

      Don’t zip the whole thing unless you’re certain that all the files are contained in that folder.

      • Beth Renneisen says:

        OK. I think the folders are complete except for the fonts, so I think I’ll try one big .zip, and put the fonts in a separate .zip. To .zip every article individually would be too time consuming.
        Thanks! Beth