As you go through this tutorial, you’ll work with the CityGuide_Folio folder in the TutorialAssets folder. You’ll create interactive objects directly in InDesign. At the end of this lesson, here’s what the first page of the main article should look like on the iPad.
A. Landscape (horizontal) view B. Portrait (vertical) view C. Hyperlinks D. Video overlays
If you have not already done so, download the tutorial assets. See Tutorial setup.
In the previous lesson, you created an article by opening the source document and choosing Add Article. Another method is to import articles. If you use the proper folder structure and filenaming conventions, you can import a single article or multiple articles.
When you import an article, point to an article folder. When you import multiple articles, point to the folio folder.
Now you will edit the Enjoy documents to include interactive objects.
InDesign includes many interactivity features. However, only some of these features work with the digital publishing tools. In addition to the supported native features, the Overlay Creator panel includes interactive overlays that work only with the digital publishing tools.
First, create a hyperlink object for the “D. I. Y. Meet” logo.
By default, hyperlinks open in an in-app Viewer, not in the mobile browser. You can use the Overlay Creator panel to change settings so that it opens a website in mobile Safari. You’ll learn more about the Overlay Creator panel next.
Movies you add to an InDesign document become interactive when you bundle the files. You’ll add the video and then use the Overlay Creator panel to change the settings. We’ll add a cycling movie.
-
In the Enjoy_h.indd file, choose File > Place, browse to the CityGuide_Folio > Enjoy_Article > Links folder, and double-click cycling_432x234.mpg. Place the movie file in the upper right corner.
The designers created a video image with a movie icon to indicate that the object is interactive. Next, you’ll use that image as the poster.
Now let’s create an interactive slideshow using the Object States panel. We’ve already added the images to the second page of the vertical “Enjoy” file. You’ll arrange them in a stack, convert them to a multi-state object, and create buttons that navigate through the slides.
-
In the Object States panel, change the Object Name to Sea Slugs.
When your multi-state objects in the horizontal and vertical documents have the same object name, the state is remembered when you rotate the iPad. Now that you’ve created the multi-state object, you need to let users scroll through them.
Next, you’ll use the Preview on Device feature to preview your folio. If you’re running a Windows computer, skip to the next section to learn how to preview by uploading and downloading files.
-
Rotate the iPad so that you can see both the horizontal and vertical versions of the file.
Swipe left and right to view different articles. Swipe up and down to read an article.
Browse to the Enjoy article. Make sure the interactive overlays work.
Tap a non-interactive area to display the navigation bars, and tap the Home button to jump to the beginning of the folio. Tap the Table of Contents button in the upper-left corner to view the table of contents and thumbnails. Drag the Scrubber to browse through article previews.
Tap to display navigation bars in the Adobe Content Viewer
You can also preview folios on your iPad by signing in to the Folio Builder panel, uploading the folio, and then downloading the folio.
-
In the Folio Builder panel, choose Sign In from the panel menu. Then sign in using an Adobe ID that has been verified to work with DPS.
If you have a Creative Cloud membership, use your Creative Cloud credentials. If you don’t have a Creative Cloud membership, sign in to http://digitalpublishing.acrobat.com and follow the prompts to verify your account.
You’ve learned the basics of creating articles and folios and adding interactive overlays. To learn more about overlays and other DPS features, do any of the following:
Open the source documents in the Overlay_Examples_Folio, and experiment with the different overlay assets. You can edit the existing overlays in the documents or build your own overlays.
Download the free DPS Tips app. Search for “DPS Tips” in the App Store of your iPad or iPhone, or do a search in the Google Play Store for Android devices or Amazon Appstore for the Kindle Fire.
Do you want to publish an app to the Apple App Store? If you’re a subscriber to the Adobe Creative Cloud, you can create and submit an unlimited number of single-folios apps for the iPad. Or, you can purchase a Single Edition license to create a single-folio app. When you’re ready to create your app, select the folio in the Folio Builder panel, and then choose Create App from the panel menu. You’ll be prompted to download the Step-by-Step Publishing Guide. Follow the instructions in that guide to build your first app.
If you want to create multi-folio apps, you can obtain a Professional or Enterprise subscription to the Digital Publishing Suite.
Twitter™ and Facebook posts are not covered under the terms of Creative Commons.