Posts tagged "Adobe"

Displaying Office Documents in Adobe DPS on an iOS Device

Many of my Enterprise customers use Adobe Digital Publishing Suite as a means to privately distribute marketing and sales enablement materials to their employees on iPads. Often, they have existing libraries of documents that they want to use as reference material in their folios, but they don’t want to convert them to InDesign documents. The DPS help page for Hyperlinks suggests that you can use the HTMLResources folder to display PDF documents in your folio, and this works well. On iOS, DPS uses an embedded Webkit overlay to display HTML content, so I decided to look at what else I could display there. Clearly PDF was supported, but what about Office? (If you have my DPS Examples app installed on your iPad, and you’re reading this blog on your iPad, then tap here to see examples of OfficeDocuments and how they appear in a DPS folio.)

Digging around in the Apple documentation for Webkit Overlays in iOS, I discovered a Technical Q&A Note that says you can display a wide array of document types, including Word, Excel, Powerpoint, Keynote, Pages, and Numbers as well as PDF. All of these work in DPS when the folio is used on an iPad or iPhone. Be aware, though, that the Webkit preview doesn’t perform precise layout on Word documents that use advanced layout features, and some spreadsheet appearances might get wonky. Test, and if necessary, convert to PDF using Acrobat, of course.

Let’s see how all this works.

I have a folder of documents that I would like to display in my folio. The HTMLResources folder is a handy place to put these documents, since I will have a common location I can reference from anywhere in my folio, including buttons, hyperlinks, and hyperlinks in Web Content Overlays. To make an HTMLResources folder, all you need to do is to select the files you want to use in HTMLResources and zip them up. DO NOT put these files in a folder and zip the folder, unless you want to organize your references in a subfolder of HTMLResources. Also remember that it is an HTML Resources folder, so that all of your file names must be HTML friendly, or you need to escape the special characters when you write your hyperlinks. Notice in my example that all of the spaces are underscores so I know the filenames will be OK.

Once you zip up the files, rename the archive to HTMLResources.zip.

Now, we need to add it to our Folio. In the Folio Producer panel, navigate to the top level of the folio and choose Import HTMLResources Folder from the flyout menu and browse to your new HTMLResources.zip archive.

Now, let’s make some buttons to display our files. While I will make buttons, you can also use hyperlinks to display the documents you have in your HTMLResources folder. Note: follow the guidelines in the help documentation for proper pathing to your assets, though. The path is different for hyperlinks vs anchors in HTML files.

In my example, I have included files of the following types: PDF, xls, xlsx, doc, docx and Keynote. The Webkit overlay also supports Numbers and Pages, and you can explore those on your own. I made a series of buttons as normal, and I assigned the “go to URL” action to them with the target URL being “HTMLResources/<name_of_my_document.xxx>” In the example below, I have the button called “docx iPhone” on my iPhone layout that points to “HTMLResources/1_Statement_of_work.docx”

I created buttons for each of the file types shown and made both iPhone and iPad layouts. The results are shown below (the .doc and .docx files are the same content, so I’m only showing one of each (tap images to show full size):

Starting state:

 

PDF

Word doc

Excel

Keynote

Neat, eh? Oh, if you’re wondering how I got the two devices in one screen shot, Reflection allows you to display two devices at a time simultaneously. Please remember that the ability to show these document types is a function of the Webkit implementation on iOS, and these documents will not display on your Android devices.

I hope that this set of files will continue to be supported in future versions of iOS. The ability to include these document types is a huge time saver for companies that need to include supporting documentation in their DPS apps, but don’t want to have to convert them all to folios.

Share on Facebook

Using InDesign CS6 Server with CQ5.5

Many of my customers have learned that CQ5.5 DAM can be used in conjunction with InDesign Server to extract content from InDesign documents and make them available for use in web pages in CQ. This worked great with CQ5.5 and InDesign CS5.5 Server, but failed with InDesign CS6 Server. I have an easy fix that enables InDesign content extraction for CQ5.5 and InDesign CS6 Server workflows.

First, start up your CQ Author environment and log in. Open CRXDE and search for spaceUnit. It will show up in one of the InDesign scripts.

If you don’t want to search, here’s the link to the jsp.

http://localhost:4502/crx/de/index.jsp#/crx.default/jcr%3aroot/etc/dam/indesign/scripts/XHTMLExport.jsx

Direct path here: /etc/dam/indesign/scripts/XHTMLExport.jsx

Right under spaceUnit is another variable called marginUnit. Comment out those two lines of code from the script, and you should be all set.

Apparently spaceUnit and marginUnit were supported in CS5.5 and earlier, but not in CS6.

Also, Adobe Drive 4 is required for DAM integration with CS6 applications. If CS5.5 is in play, then you will need Adobe Drive 3. As of August, 2012, the download link is halfway down the right hand column of the Adobe Drive Product Page. Drive 3 and Drive 4 can coexist if you need to have CS5/5.5 and CS5

Share on Facebook

Single Issue vs Multi Issue Viewers for Enterprise customers

DPS customers have access to tools for creating and managing custom versions of the Adobe Content Viewer that can be distributed through iTunes (like the Wired or National Geographic apps). Additionally, Enterprise DPS customers can build apps for private distribution using an MDM service like MobileIron or Air-Watch. Only Enterprise DPS customers can build apps for Enterprise distribution models, and I have provided an earlier post about that process.

One of the options for the custom viewer is a Single Issue Viewer, in which one folio is embedded directly into the viewer. Single Issue Viewers have no library mode, so they are used by many of our customers who want to use MDM solutions to manage the distribution of specific folios to specific people. However, we have other customers who use MDM to distribute Multi-Issue Viewers to their managed devices, and then use our Restricted Distribution infrastructure to leverage LDAP or other authentication to control access to specific folios in that one viewer app. There are IT advantages to either approach, and I’d like to explore the differences.

In order to use an MDM system to manage apps on an iOS device, each app needs to be created using a specific unique identifier known as a mobileprovision file. Customers make these in the iOS Provisioning Portal, which is part of Apple’s iOS Developer Portal. In the Single Issue approach, each Single Issue Viewer needs a new, unique mobileprovision file from the iOS Provisioning portal. MDM solutions leverage a property of iOS whereby each app must have its corresponding mobileprovision file on the device in order for the app to run. MDM solutions can remove a mobileprovision file on a managed device, rendering the app unusable. When a customer makes a new Single Issue viewer, it must repackage this app to include the new, unique mobileprovision file in a process called resigning. There are several ways to do this, but a popular method is to use iresign from Google. This workflow is very effective because it gives IT fingertip control over each and every app on a managed device, and it allows IT to move DPS Folios in and out of circulation by wrapping them in Single Issue Viewers.

Let’s face it, though. Managing all those apps and mobileprovision files is annoying IT overhead. In the Multi-Issue approach, there is only one mobileprovision file because there is only one Viewer. Content delivery to the Viewer’s Library is based on credentials and is managed by a business user, not IT. The business user can associate content to users or groups in a portal without having to call IT to issue a new mobileprovision file. This portal can be built and managed by corporate IT using sample code from our Developer Center. Derek Lu, for instance, provides detailed instructions and sample code for integrating LDAP with Restricted Distribution. There are also commercially available servers such as Portico from MEI to enable Restricted Distribution workflows in an Enterprise without IT having to develop a backend solution from scratch.

Which method is right for your company? That depends on how you want to manage content. If you want IT to manage everything, then the Single Issue approach might be just what you need for DPS. If you want to reduce the burden on IT and shift content management over to the business users who file the IT tickets in the first place, then Multi-Issue with Restricted Distribution fills the bill. DPS is flexible: your designers create their engaging tablet content in InDesign, IT puts the apps on the devices, and either IT or business users manage the flow of those folios to users. Either way, you can use your MDM system to manage DPS viewers on your company’s tablets.

Share on Facebook

Using Twitter feeds in Adobe DPS

Edit: 7/19/2013  Twitter once again updated its APIs, so this article is inaccurate. I am working on a solution, and will update this article when I have one that works. There is a suggestion over in the DPS Forums, but the results seem to be spotty.

Recently Twitter changed its widgets so that they will no longer run outside of a web site. This presents a problem for folks who have relied on embedded Twitter widgets in their DPS publications. There is a workaround which should present no problem to readers, since they need to be online in order to read Twitter content in the first place.

First, post your widget to a web site, then either refer to it directly from your web overlay or embed an HTML file in your folio that contains an iframe that displays your widget. Here’s a more concrete example.

I have a widget called dpstweets.html, which displays all of the tweets that reference @adobedigitalpub. It resides at http://www.jameslockman.com/dps/jamestweets/dpstweets.html, and it consists of the following code:


<!DOCTYPE HTML>
<html>
<head>
<meta charset="UTF-8">
<title>DPS Twitter Feed</title>
<style>
 .body
 {background-color:transparent}
</style>
</head>
<body>
<div>
 <script charset="utf-8" src="http://widgets.twimg.com/j/2/widget.js"></script>
 <script>
 new TWTR.Widget({
 version: 2,
 type: 'search',
 search: '@adobedigitalpub',
 interval: 30000,
 title: 'Adobe DPS',
 subject: 'See what\'s trending',
 width: 180,
 height: 187,
 theme: {
 shell: {
 background: '#8ec1da',
 color: '#ffffff'
 },
 tweets: {
 background: '#ffffff',
 color: '#444444',
 links: '#1985b5'
 }
 },
 features: {
 scrollbar: false,
 loop: true,
 live: true,
 behavior: 'default'
 }
 }).render().start();
 </script>
</div></body>
</html>

That in itself is pretty plain vanilla. However, if I were to embed this file into my DPS app as a web overlay, I would get a blank white rectangle. The easiest solution is to make my web overlay point to http://www.jameslockman.com/dps/jamestweets/dpstweets.html. I set it to auto play, allowed interactions, and made it transparent. Of course, that’s hard to see unless you preview the folio on your desktop or on your tablet.

The other solution is the iFrame, and it’s easy to implement.

I made a second HTML file that I called dpsiframe.html, and in the body tag, I put this:

<iframe src="http://jameslockman.com/dps/jamestweets/dpstweets.html" width="200" height="312" frameborder="0" marginheight="0" marginwidth="0">Your browser doesn't support iFrames</iframe>

You can look up how to stylize iFrames with CSS and with their own tags, but once I put this new html file into my web overlay in my folio, it worked like a charm.

CS6 users have an additional bonus feature, though. In InDesign CS6, you can just copy and  paste the <iframe src-” … /iframe> line of code into InDesign, and InDesign will make a nice poster frame of the page for you when you paste. It makes it much easier to figure out how the widget will fit into your layout. Give it a try with my iframe code above, and tell me that’s not awesome. You can’t, can you? Unless, of course, Twitter changes its widgets again and makes them unusable in iFrames.

Share on Facebook

Using content from InDesign documents in CQ5.5

When Adobe acquired Day Software, it got not only a revolutionary Web Content Management system, but also a revolutionary Digital Asset Management platform based on CRX, Day’s implementation of the Java Content Repository. Quick to recognize its potential as a binding agent for an end to end Adobe workflow that included asset creation and management, campaign deployment, measurement and targeting, and campaign refinement, CQ quickly jumped to the forefront of many of our minds here at Adobe.

Adobe Drive 3 can connect to a CQ DAM and provide version control for Creative Suite assets. While this functionality existed with CQ5.4, in CQ5.5, there are some built-in examples of how CQ can extend an InDesign workflow to the Web. CQ5.5 ships with a couple of workflow scripts designed specifically for InDesign Server, which is required for them to function. Without InDesign Server available to CQ, what follows won’t happen. If you are a CQ customer and would like to try this for yourself, download the InDesign Server trial and install it on the same server where you keep CQ5.5. Otherwise, read on and you’ll get a sense of what’s possible with CQ DAM and InDesign Server.

InDesign server must be running and servicing requests on port 8080. On my Mac, I issue the following terminal command to fire up ID Server prior to starting CQ. I assume that it’s similar on Windows:

/Applications/Adobe\ InDesign\ CS5.5\ Server/InDesignServer.app/Contents/MacOS/InDesignServer -port 8080

Once it’s running, it’s safe to start CQ in author mode. We’re looking at an author instance, not a publish instance, from this point forward. Once it’s running, you can mount the repository with Drive 3. Open Drive 3 and connect to your DAM. In my example, I’m running CQ on my local machine, hence the localhost connection.

Once connected, I can browse content in the DAM as if the DAM were a filesystem. CS apps such as Photoshop, Illustrator, InDesign, InCopy and Bridge understand that when CQ DAM is mounted via Drive, they can check files into and out of the DAM and access versions of those files in the DAM. This article isn’t about version control, though, it’s about repurposing content from InDesign in CQ5.5.

When I drop an InDesign file into the DAM via Bridge, Bridge creates a version and checks the file into CQ. In CQ, the appearance of that InDesign file fires off a series of workflow steps that, with the help of InDesign Server, create previews of that file, extract an IDML rendition of that file, extract text and images from that file, and assemble those items into a Page node in CQ. It’s this page node that’s the really, really cool product of ingestion.

Page nodes are reference-able in CQ using a reference component. Normally, when you place a reference component onto a page in CQ, you double click it and browse to the page you want to reference. Unfortunately, when CQ and InDesign Server make the page node of your InDesign file, it places that page into the “renditions” folder, which is a reasonable place to store it. Unfortunately, the Reference component doesn’t know how to look into the Renditions folder for this Page note. Fortunately, a colleague on the Chinese Solutions Consulting team, Joseph Lee, figured out a simple solution that allows us to use this page node as a source of content for other pages on our CQ site.

In the diagram above, the selected page node needs to move up two levels in the hierarchy so that it is at the same level as the jar:content node, just below the InDesign file’s primary node. We can drag it up there in CRXDE Lite, but that’s pretty “dirty,” as Joseph was quick to point out. Looking at the workflow, however, he identified a single modification that puts the page node into a place where it can indeed be found by a reference component. Note that it will no longer appear in the Renditions tab when you browse to the InDesign file in DAM, however. I think that the trade-off is worth it, though.

The change we need to make is in the DAM Update Asset workflow. Browse to your workflows console and double click DAM Update Asset. At the bottom of the workflow, there’s a step called Page Extraction. This is one of the new steps that’s included in CQ5.5. You need to change the Page Root Path to “/.” (do not include the quotes) just like below. This will instruct the workflow to create the page node directly below the InDesign file’s primary node. Once you’ve made the change, click OK and then Save in the upper left hand corner of the window. Now, you’re ready to reuse content from your InDesign files in your CQ pages.

To see this in action, let’s look at what the reference component will see after this workflow change, and after we either ingest a new InDesign file or make a change to it and check it back into the DAM, either of which will trigger the InDesign Page Extraction workflow and fix the page node location. Once you do this, you can now browse to it from a reference component.

In the figure above, I have selected a story that’s present in my InDesign document. Here it is in InDesign:

Now, here it is on my CQ page.

Now, here’s the really, really cool part. Nowhere in this process was I required to send my InDesign document overseas for XML extraction in order to get its content back into my Web Content Management system. Ingestion took literally seconds and allowed my authors to use the text and images from my InDesign documents immediately. In addition, when a user makes a change in InDesign and checks the document back into the DAM, the text will update in my CQ Author instance so that I can gracefully publish it to the Publish instance when I am ready.

Thanks again to Joseph Lee for his elegant but powerful suggestion to expose the page rendition to reference components.

I know that this workflow is a demonstration of capabilities, but what an amazing demonstration it is. A capable developer could develop components and workflows which would allow a CQ user to edit that same referenced copy, and then would fire off a workflow to re-inject that content back into the InDesign document. How about the situation where a CQ user mocks up a page layout and then pushes a button to tell InDesign Server to build an InDesign document using a specific template and the text and images from the repository. The possibilities are endless.

I firmly believe that CQ5.5 and its ability to drive InDesign Server heralds the beginning of a new era in multi-channel communications. Already the lines between print and web and apps are blurred. With InDesign Server and CQ5.5, those lines disappear entirely. Now, content truly becomes independent of presentation, which frees the marketer or publisher to extend their reach in existing channels and expand their businesses into emerging channels.

Share on Facebook