Building multi-rendition articles (May 2013)

The September 2012 update (v23) to the Adobe Digital Publishing Suite introduced a new approach to folio construction. The new technique allows a single folio to look good on both standard definition (SD) and high definition (HD) iPad and iPhone devices. Using this new technique, it is now both easier and more efficient to build folios and maintain metadata than in previous workflows. And this technique offers new ways to supply HD assets for certain interactive overlays. A combination of choices and construction deliver a range of benefits to both the designer working with DPS and to your reader as they consume your content or app on their iOS device.

The new technique is called multi-rendition articles. All DPS customers may take advantage of this new technique when building their iOS folios. Single Edition, Pro, and Enterprise DPS users all benefit from this option because both single-folio apps and multi-folio apps will support this workflow.

The introduction of retina display devices created a dilemma for designers and producers of DPS content. If you want your content available for both SD and HD devices you have to create a folio for each device. If you also want to support Kindle and Android devices, you create two additional folios for these devices. All of these folios can be created from a single design file that contains alternate layouts for these devices, but there are additional challenges for iOS devices.

If certain overlays use SD content, they can look fuzzy or “chunky” on retina displays. This problem can be solved if duplicate overlays and content are built using separate HD assets. If the SD overlays are hidden and HD overlays are visible when the HD folio is created, you get the HD overlay.

Once the folios are built you also have to manage metadata for all these folios. They must have the same folio name and metadata to become “renditions” and all article names also must match to support sharing. Maintaining these details and workflows is somewhat complicated and prone to error.

Multi-rendition articles help to simplify the workflow by making design and production easier—a single folio works on both SD and HD iOS devices that have matching aspect ratios. You do need to create traditional renditions to target devices with different aspect ratios; so you still need separate layouts or designs for  two iPhone and one iPad renditions. Older iPhone and iPod Touch devices share one aspect ratio but two resolutions, just like iPad. So these devices can all benefit from multi-rendition articles. iPhone 5 and the fifth generation iPod Touch are a new aspect ratio but they both share on resolution, you will need an additional design and rendition for these two devices but multi-rendition article are not needed for them.

A multi-rendition article requires three qualities: your app version must be 23 or higher, the folio must use “viewer version” 23 or higher, and the article must use a PDF format. If all three of these conditions are met, you get the basic benefits of a multi-rendition article: article size tends to be smaller than PNG articles, and the content displays well on SD and HD iOS devices. In addition, you can take a couple of other actions to enhance the multi-rendition article, which we’ll discuss later.

The App

To display the multi-rendition content correctly on iPad or iPhone, your app must be version 23 or higher. If you’re building your app for the first time, this is easy. The default version in the App Builder is always the most current version, so all new iOS apps will support multi-rendition articles. If you have an older app that’s already in the App Store, you will need to rebuild it and submit an update to the App Store. All app construction is done in the DPS App Builder.

The Folio

The folio in which you plan to support multi-rendition articles must target a viewer version of 23 or higher. You choose this in the New Folio dialog box when you create the folio. You must manually set this value to 23 or higher; the default viewer version will not support multi-rendition articles.

If a folio used a lower viewer version number, you can “upgrade” the folio to version 23 or higher, but you will also need to update any PDF-format articles where you want to take advantage of multi-rendition support. To do this, you would first upgrade the viewer version for the folio in Folio Properties, then select and update any PDF format articles. You cannot change the article format from PNG or JPEG to PDF. If your article uses either PNG or JPEG and you want to take advantage of multi-rendition article features, you must delete the article and rebuilt it using the PDF option

The Article

The article format must be PDF. Note that the September 2012 update changes the default format of articles for iPad and iPhone to PDF.  While this is the new default, you can change the default format or the format of any individual article, but you would lose the advantage of a multi-rendition article if an article is not PDF-format.
Those are the basics involved in making a multi-rendition article. The advantage is that one folio will look good on both SD and HD iOS devices, so your iPad and iPhone readers will be served better and more easily than in the past. Now let’s delve into some additional details that will help you take more control of the quality of your content.

Why it works

Previous documentation and discussions about DPS have described the content of a folio as being one of three types of content: background, resampled overlays, or pass-through overlays (see “Tablet publishing on the new iPad ” for information about building separate renditions for SD and HD iPad and iPhone). The three types of content are still part of the folio and article building process but the treatment of some content is different for a v23 or higher folio which uses PDF-format articles. InDesign will create the content using new parameters and options that help make the content look better on both SD and HD devices while keeping the file size reasonable.
A multi-rendition article’s PDF format carries a couple advantages when compared to the other article formats.

• The article size tends to be notably smaller than JPEG and PNG format articles.
• Any background or resampled, raster content in a multi-rendition article has higher resolution than in other article formats.
• Text is rendered as text, so it will look good on both SD and HD devices, and it will help minimize the article size. Smaller downloads and better display will provide more flexibility.

Background content

All static content—the text and graphics that are not interactive—become background elements in an article. When you add the article to a folio, this content will be converted to the format selected for the article. A multi-rendition article uses a PDF format and the images are resampled to one resolution in the article. The resolution used in a multi-rendition article is higher than previously used and renders well on both SD and HD devices. Text is kept as text in the PDF article, so it looks good on both display types. If the user zooms in on the PDF-format article, it continues to look crisp.

Resampled overlays

The content of some overlays are resampled, the same way background content is treated. Resampled overlays include buttons, slideshows, and scrollable frames.

Slideshow and scrollable frame overlays both have new options for how the content is converted if the article uses a PDF format. Previously (and in non-PDF format articles,) the content of these overlay types was rasterized. This is why these overlays in a folio for a SD iPad sometimes looked fuzzy on a HD iPad, especially if they contained text. Now, these overlay types offer the choice of using either raster or vector formats for their content. The default format setting is raster for slideshows. (Figure 2) If the content of a slideshow is primarily images, you’ll find raster is a good choice. The default format for scrollable frames is vector; if your scrolling content is text, this is a good choice. One possible drawback to using the vector format is a brief load time in some instances.

New technique for pass-through overlays

The content used in audio, video, panorama, image sequences, audio skins, and pan & zoom overlays is not resampled when the article is created. All the data is passed through and into the folio.
Since all the content for these overlays is included in the folio and downloaded by the user, it’s important to build this content at an appropriate size and resolution to function in the design layout. Some of these types of overlays may use large files or folders of files, so optimizing all this content for a DPS folio must be considered. The challenge we face is to create the smallest file sets that look good. I use Photoshop’s Save for Web command to help minimize file size for pass-through overlays. That’s great if you are publishing to only one device, but now we face an additional challenge of having a single pass-through overlay look good on both SD and HD. This can be addressed by having two assets for these overlays.

A multi-rendition article can incorporate both SD and HD assets if you do a little planning and organization. The planning involves making the additional asset or set of assets for HD. The organization part involves creating a new folder named “HD” in the same location as your SD assets and using the same name for both SD and HD files. So for overlays that use a single resource like Pan & Zoom you could have all your SD images in a Links folder and all your identically named HD images in a single HD folder that’s also in your Links folder. (see Figure 3)

For image sequence overlays and other overlays that use a folder of assets you build your HD folder inside the folder where the SD assets are saved (see Figure 4).

Three of the pass-through overlays have specific requirements for the HD assets; these assets must be twice the dimensions of the SD file. The overlays that require the 2x assets are pan & zoom, image sequence, and audio skins. If these assets do not meet the specification you will get an error when you add the article to your folio. The remaining pass-through overlays (video and panorama) are much more forgiving about just how much more content you must have for the higher definition assets.

Test your HD needs

Consider testing which overlays need HD content and which don’t. You may find that pan & zoom overlays benefit greatly from having HD versions, whereas the extra file size and download time for an image sequence does not carry enough of a benefit. You can be selective about which assets have HD content. One approach is to create assets that have a resolution somewhere between SD and HD versions, such as image sequence files with a resolution of 108 ppi. Remember that in a multi-rendition article all the SD and HD content is part of the download.

For a Single Edition or a single folio app there are remarkable benefits of using multi-rendition articles throughout your folio. There are more options for multi-folio apps built by Pro or Enterprise DPS customers. The option of creating separate renditions for SD and HD iOS devices will likely provide smaller and faster downloads for your readers, and using a PDF format in this workflow will benefit all readers.

In summary, to make multi-rendition articles work:

• Build a v23or higher viewer.
• Build v23 or higher folios.
• Use PDF format for articles.
• Use a vector format for text-based scrolling frame content in a PDF-format article.
• Use a raster format for image-centric slideshows in a PDF-format article.
• Test and judge whether you need to build HD assets for pass-through overlays.
• Use an HD folder to automatically use identically named HD assets for pass-through overlays.

See the following articles for more tips and best practices targeting various iOS devices with your DPS content:  "Tablet Publishing on new iPad " and "DPS authoring in InDesign for iPhone and iPod Touch."