Posts tagged "Digital Publishing"

Photoshop Extended for DPS

By Keith Gilbert

If you are planning creating apps with Adobe InDesign and Adobe Digital Publishing Suite, I strongly recommend that you have Adobe Photoshop CS5 Extended in your tool set. Here’s why.If you’re not aware, Adobe Photoshop CS4 and newer comes in two “flavors”: Photoshop and Photoshop Extended. Both…

Read on Gilbert Consulting Blog

Adobe Edge: May 2011 – Taking digital publishing to the tablet market with Adobe InDesign CS5.5

By Vikrant Rai on Caveat Lector

In the May 2011 issue of Adobe Edge, David Rich talks about publishing for tablet devices, and how Adobe Digital Publishing Suite is closing the time-to-market to deliver exceptional user experience to this new media.

Many traditional publishers, like Martha Stewart and Conde Nast, are taking advantage of new digital publishing opportunities on tablet devices. And they are not alone. Business publishers — organizations who make their money in ways other than selling content — are using digital publishing to extend their brand and engage their audiences. Take a look at major brands like Mercedes-Benz, EMI Music, and Red Bull. They are using tablet publications as a way to hook and engage consumers. But how does a print designer go about creating both a print and an online reading experience?

Read the complete article at Adobe Edge: May 2011 – Taking digital publishing to the tablet market with Adobe InDesign CS5.5.

Read at Caveat Lector

New App – Digital Publishing Suite Tips

By Bob Bringhurst  on InDesignDocs

The Digital Publishing Suite Tips app is now available in the Apple Store. It’s part user guide, part cookbook, and part blog. If you have an iPad and you want to learn about the new Digital Publishing Suite tools, download the app and start playing.

Currently, the DPS Tips app includes two issues — Folio Basics and Interactive Overlays. The Folio Basics issue provides videos and tutorials for the new workflow that came out last week. The Interactive Overlays issue shows an example of each overlay type and explains how to create it.

Both folios include workarounds, tips, best practices, and links to interesting apps.

I’m also working on a third folio called “How Did They Do That?” It will show examples from iPad apps. I have a few articles lined up, but I’m looking for more examples. Please let me know if you’d like to show how you created an article in a folio or you there’s an article in someone else’s app that you’d like to figure out. You can reach me at bbringhu at adobe dot com.

The link to the DPS Tips app is here:

Here’s the link that jumps straight to iTunes:



View Original Story

Digital Publishing Suite Tips

By Vikrant Rai on Caveat Lector

Learn how to create interactive layouts in Adobe InDesign and publish them to the iPad. Digital publishing expert Bob Bringhurst uses real-world examples from professional publishers and easy-to-follow tutorials to show you how to create visually rich and engaging iPad apps with InDesign and the Adobe Digital Publishing Suite.

Go to iTunes and downlaod your copy now Digital Publishing Suite Tips for iPad on the iTunes App Store.

Read at Caveat Lector

Using InDesign to Publish Your iPad Magazine

By Terri White in Layers Magazine
Adobe just took the wraps off the long-awaited Digital Publishing Suite that powers the Wired magazine and The New Yorker iPad apps. With InDesign CS5 at the core, you can now author your layouts, including interactive content, and export it out in the new .issue format.

From there you can preview your content on the iPad using the free Adobe Digital Content Preview Tool. If you want to monetize your content then you could check Adobe’s hosted solutions. For the purpose of this tutorial, however, we’ll walk you through the steps to build your digital issue. In order to do this tutorial you’ll need to download and install the Digital Publishing Suite components from Since we’re targeting the iPad, we need to create a document that’s the right size. Go to the File>New>Document menu and choose Web for the Intent, 1024×768 for Page Size, and click the Portrait icon for Orientation.

Typically, we design longer documents in multiple InDesign files for ease of collaboration, and we’re going to follow that same procedure here even if we’re the only ones laying out this publication. Each section or article of your digital publication is called a stack, and each stack is a separate InDesign document. Our first stack will be the cover. You can design the cover anyway that you like using standard InDesign techniques for image placement and fonts. Save it with whatever name you want but make sure the name ends in “_v.indd” (e.g., “cover_v.indd”).

If you want your readers to be able to view your publication horizontally, then you’ll need to actually build the horizontal version of each stack as a separate InDesign document. After you create and save your vertical cover in Step 2, go to File>Save As and name the file the same except end the name with “_h.indd” (e.g., “cover_h.indd”). Now go to Layout>Layout Adjustment, turn on Enable Layout Adjustment, and click OK. Then, go to File>Document Setup and change the Orientation to Landscape. Layout Adjustment does the best that it can to keep the layout intact, but you may need to tweak a few things to get it to look perfect.

At this point you would create new InDesign documents for the subsequent stacks in your publication. You’ll need both vertical and horizontal versions of each document. The stacks themselves can be multiple pages, such as longer articles.

In order for the Bundler to successfully import your stacks and bundle them together, you have to create a very specific folder structure for your InDesign files. The easiest is to have one main folder for each issue. Inside that folder, include a subfolder for each article. Inside the article folder, include subfolders for both the vertical and horizontal versions of the file. Each of these subfolders will contain the InDesign file, link folder, document font folder, etc. for that stack. In the example here, the main magazine folder is called Meridien_Issue, which contains a folder for an article on WiFi. The WiFi folder contains the subfolders for both the horizontal and vertical versions of the InDesign file.

If you want to go beyond standard text and graphics, you can have two types of interactive content. You can use the standard navigation elements in InDesign, such as buttons, or you can use the Adobe Interactive Overlay Creator to create additional content such as panoramas, 360° views, audio, video, image pans, etc. Launch the Adobe Interactive Overlay Creator that you downloaded and installed from Adobe Labs.

In order to place a video in your digital publication for the iPad, your video will need to be an MP4 with H.264 encoding. Place your video in a folder called “OverlayResources” in the stack subfolder that you wish to use the video in. Switch to the Video tab of the Interactive Overlay Creator and click the Browse button next to the URL field. Find your video and click Select. Enter the Width and Height of your video in pixels. If you want your video to play full screen, enable the Play Full Screen checkbox. Click Export after you make your setting choices, and save it to the same folder.

Now go back to the InDesign document in which you want to place the SWF version of your video that you exported in Step 7. Go to File>Place, navigate to the SWF file, click the Open button, and click on your document where you want your video.

At this point we want our readers to be able to see an image for the video. Although you can choose a frame from the video to use as the poster frame, it’s probably best to design an image that lets the reader know that it’s a video (we’re using an image that has a play icon on it). While your video is selected, bring up the Media panel (Window>Interactive>Media). In the Media panel, select Choose Image from the Poster drop-down menu, navigate to the image that you designed to be the poster frame, and click Open.

In order to bundle the issue and for your table of contents to function, each stack must have a TOC thumbnail. This thumbnail has to be a 70×70 pixel PNG file and saved in the root level of each stack folder. You can use a screen capture of a section of the page or anything you design using Photoshop. With your image open in Photoshop, go to File>Save for Web & Devices. Select PNG-24 in the Preset drop-down menu at the top-right, and set the width and height to 70×70 pixels in the Image Size section. Click Save, navigate to the appropriate stack folder, select Images Only from the Format drop-down menu, and click the Save button.

After you’ve created all your stacks and interactive content, it’s time to open your issue in the Adobe Digital Content Bundler that you downloaded from Adobe Labs. Click the New button and point to your main issue folder without actually going inside of it and click the Select button. Once your issue has been imported, you’ll need to add in the appropriate title information. You can also rearrange the order of the stacks so that they are in the order of the actual publication.

Once you have your issue details inserted, you can now click the Export Issue button to export out your .issue file to a folder of your choice. Be sure to change the Issue option to Single File in the Export Options dialog.

In order to view your .issue file on your iPad, you’ll need to install the free Adobe Digital Content Preview Tool for iPad on your device. You can get this from the Apple App Store. Once you have it installed, plug in your iPad via the USB cable and launch iTunes. Click on the Apps tab and click on Adobe Preview. Now you can click the Add button, locate your .issue file, and sync it directly to your iPad.

At this point you can now launch the Adobe Digital Content Preview Tool app on your iPad and your issue should be there to view. This will allow you to view and test all of your stacks and interactivity.


View original post.

Using Pano2VR to Create Panorama Assets

When you’re using InDesign to create digital publishing apps for mobile devices, you can add all kinds of interactive effects, including panoramas. A panorama overlay can give you the impression that you’re inside a building or cockpit, allowing you to spin around and zoom in and out.

Unfortunately, creating the source files for panoramas is not easy. A panorama overlay requires six images that represent the inside of a cube.

You can use Photoshop to create a 3D panorama image. However, converting a 3D panorama image into the six images requires a third-party tool such as Pano2VR. Here’s how to use Pano2VR to convert a 3D panorama image into the six images required by the Overlay Creator.

1. Create or obtain the panorama image.

2. Install and start Pano2VR. You can download Pano2VR here.

You can download and experiment with a free version that includes a watermark in any output.

3. Drag the panorama image into the Input area of Pano2VR.

4. Click Convert Input, choose Cube Faces from the Type menu, and choose PNG for format type. Specify a known folder for the PNG files.

5. Click Convert to generate the six files.

Pano2VR is also useful for determining the upper and lower limit values for panorama images that include blank spots at the top and bottom. After you drag in the image, click Modify under Viewing Parameters, select Show Limits and select Ignore Limits In Preview. Look at the Tilt value as you drag the image. (For the negative Tilt value that appears in Pano2VR when you scroll to the bottom of the image, use a positive value for Button in the Overlay Creator.)

View original post.

Content Viewer for Android

In an  Adobe Digital Publishing blog post,  Dave Dickson announced the availability of the Content Viewer for Android. To help our customers capitalize on these opportunities I’m excited today to announce that Content Viewer for Android, part of Digital Publishing Suite, is available immediately for download through the Digital Publishing Suite Prerelease program.  Compatible for use on […]

View original post.

iPad layout templates for the Adobe Digital Publishing Suite

Designing in Adobe InDesign CS5 for the upcoming Adobe Digital Publishing Suite entails creating a document that’s 1024 x 768 pixels or 768 x 1024 pixels. But the Adobe Viewer obscures a 6 pixel vertical region on the right side of the screen with a vertical scroll indicator, and the Viewer…

View original post

Design Decisions for Digital Publishing Apps

If you’re creating magazine apps for the iPad and other mobile devices, you have a lot of design decisions to make. Let’s go over a few of them.

Single-Folio or Multi-Folio Viewer App?

When you submit your content to the Apple Store or Android Market, each magazine or book requires its own branded viewer.

For most projects, the decision of whether to create a single-folio or multiple-folio viewer is straight-forward. If you intend to create a book or a one-off promotional piece, such as the Essential Guide to TRON, create a single-folio viewer. If you intend to create a magazine with multiple issues, such as The New Yorker, you need to create a multi-folio viewer that allows your customers to download folios as you publish them on the Adobe fulfillment server.

For multi-folio viewers, Adobe plans to charge $0.30 per download. Adobe does not charge anything for single-folio viewers, because they’re downloaded from the Apple Store or Android Market, not from the Adobe fulfillment server.

Orientation — Vertical, Horizontal, or Both?

You can create portrait-only, landscape-only, or dual-orientation folios. Note that you cannot mix and match orientation types, such as a horizontal-only and dual-orientation articles in the same folio. The layouts of single-orientation folios do not change when the customer rotates the iPad.

In a prerelease forum thread, one publisher claimed that magazine apps should be portrait-only because people are accustomed to reading portrait magazines. I don’t think that reasoning holds up. Aren’t those same people also accustomed to reading websites on landscape monitors? And watching t.v. and movies on landscape screens? I don’t think there’s a “right” orientation for the iPad.

I’ve seen well-designed portrait-only and landscape-only magazines. The new Golf Digest and Reader’s Digest apps are portrait only. One of my favorite apps, Harvest to Heat, is landscape only.

Golf Digest is portrait only.

Harvest to Heat is landscape-only.

One major advantage to portrait-only or landscape-only folios is that you have to create only one design. If you have a printed magazine, converting the layout to a 768×1024 page size isn’t nearly as difficult as converting it to both a 768×1024 and 1024×768 page size.

Designing separate layouts for portrait and landscape orientations can be time-consuming. Furthermore, if you intend to make your magazine available on other mobile devices besides the iPad, creating both portrait and landscape orientations for 1024×768, 1024×600, and 800×600 devices can turn what may be a beneficial inconvenience into an unsustainable workflow.

Note: One concern with portrait-only magazines is the ability to play full-screen videos in landscape orientation. With the newest viewer (drop 9), this is now possible. With portrait-only folios, users can rotate the iPad to play a full-screen video in landscape.

Of course, the drawback to creating a single-orientation folio is that you may take away the customer’s preferred method of reading. Some people prefer viewing content in landscape mode. Like me. I have a folding iPad cover that lets the device sit comfortably on my lap or chest in landscape view. I don’t mind rotating the iPad every now and then, but I always want to go back to landscape. But my neighbor has an iPad cover that props up her iPad vertically, so she’s inclined to read in portrait orientation.

What Are the Best Options for Dual-Orientation App?

The most common approach is to redesign the same content for both landscape and portrait layout. This is the approach that the designers at WIRED, Martha Stewart Living, InDesign Magazine, iGizmo, Fine Cooking, and many others have taken. It provides flexibility and — for now — caters to the iPad’s groundbreaking design and a “wow!” factor. My guess is that the ability to view the same issue of a magazine in two orientations isn’t going to be as significant in the near future. Who knows?

Fine Cooking Holidays

Another option is to create a dual-orientation folio in which each orientation serves a different purpose. For example, the landscape orientation could provide a detailed visual overview with a slideshow or video, while the portrait orientation could include a text-intensive article.

For a how-to manual, the landscape layout could display the desired effect, such as a before/after photo for a Photoshop app, while the portrait layout could provide the instructions for creating that effect.

I saw a magazine that uses the same 700-pixel layout in both the portrait and landscape orientations, but the designers created a much wider navigation bar in landscape orientation. They also created smooth-scrolling articles rather than page-by-page articles to avoid a disjointed experience when rotating the iPad. Unfortunately, I can’t find that magazine on my iPad. One of my twin boys must have deleted it when he was experimenting with the cool wiggle feature. Sigh.

Weekend Magazin mixes its approach by providing the typical dual-orientation redesign for most articles, but every now and then, they signal that rotating the image displays a different photo.

Rotating the iPad offers a different picture

For Multi-Issue Folios, Should the Preview Folio Be Included or Downloadable?

When you create a single-folio viewer, the folio is baked in with the app. With a multi-folio viewer, you have a choice. You can provide a small .folio file that gets downloaded along with the viewer app, or you can provide only a viewer shell and allow customers to download free and retail content from the fulfillment server. (Apple requires that you provide free content for your viewer app.)

You can also combine the two approaches. For example, you can embed a folio that describes how to use the viewer, and you can upload a free preview issue.

To keep things simple, I think the best approach is to avoid baked in content. Just submit a shell viewer app and provide one or more free preview issues that customers can download. That way, if you need to edit the preview issues, you can simply upload a new version to the fulfillment server; your customers can click the Update button in the viewer library to get the new version. If you need to edit a baked-in folio, you’ll have to resubmit the viewer app to Apple.

What’s the Best Way to Provide Free Preview Content

If you’re charging money for your multi-folio viewer, you need to provide some free content that meets Apple’s requirements and (hopefully) convinces your customers to download the retail version or subscribe.

At the bare minimum, provide a table of contents and one or two articles. Another option is to provide more articles, but show only the first page or two of each. Here’s an example from Reader’s Digest in which editors provide just enough of an article to make you want to read more.

“How did he get out of jail? OK, I’ll buy it.”

Should Vertical Swiping Be Turned Off?

By default, swiping up and down displays different pages of an article, and swiping left and right displays different articles. Some designers believe that allowing both horizontal and vertical swiping can be disorienting, especially for inexperienced users. To simplify, they turn on the “Flatten” option for all articles, thereby allowing only horizontal swiping. (Flattening an article causes its pages to be displayed horizontally rather than vertically.)

Of course, this approach requires customers to swipe through every page of every article, sacrificing flexibility for simplicity.

You can see what you think of horizontal-only swiping by downloading apps like EVO and Weekend. In each, designers provide visual clues to indicate the end of an article.

It’s easy enough to try both approaches and do a usability test.

Smooth Scrolling or Page-by-Page Flipping?

Should your allow your customers to view the entire article by swiping smoothly, like a web page, or by swiping to turn the pages, like an epub book? Fortunately, you don’t have to decide one approach for the entire folio. You can make this decision for each article. Some designers turn on Smooth Scrolling for the table of contents and the credits page. The InDesign Magazine designers turned on Smooth Scrolling for some articles and not for others.


Did I miss anything? Leave a comment.

View original post.

Magazine publishing on the iPad

I’ve been heavily involved in the upcoming Adobe Digital Publishing Suite as a beta tester. I’m working directly with a couple of clients to help them repurpose their magazine content for iPad versions. One of the best ways to learn what is possible and what works well (and not so well) in this…

Go to original post