Chapter Eleven. Using the CS Live Services

When you buy a new car, the moment you drive it off the dealer’s lot, it begins to depreciate in value. Computer software and cars are quite different, of course, but technology changes quickly. By the time a new version of the Creative Suite is mastered to discs, reproduced, packaged, and shipped, it can be argued that what was the best possible version when the engineers did their final testing and the product was deemed “final” might not meet a need that arose between the software’s ship date and the time you upgrade. Online updates have made keeping software current much easier and more immediate, but there are several things that the Web and cloud-based computing can do that software installed on your computer can’t. These capabilities simply can’t be packaged in a shrink-wrapped box. Web-based services complement, extend, and complete an already powerful software package.

Adobe’s online services include Acrobat.com for file sharing and online meetings, Buzzword for collaborative online word processing, BrowserLab for cross-platform Web-site testing, CS Review for integrated remote document review and commenting, SiteCatalyst NetAverages for Web analytics, and more. Collectively, these services are referred to as CS Live, and they’re yours to use free for one year from the time you register your copy of CS5 Design Premium. All you need is an Adobe ID (See Tip #5, “Setting Up an Adobe ID”).

#97. Placing Buzzword Documents in InDesign

If you’ve never heard of Buzzword, don’t despair. Years ago when free word processors were first making their way to the Web, a small group of Boston developers decided to build a Flash-based solution. Fast and elegant, the online software was named Buzzword. It wasn’t long before Buzzword caught the eye of Adobe Systems, which bought the product for inclusion in its Acrobat.com Web site.

Among Buzzwords’ strengths is its ability to allow multiple authors to collaborate on the same document. Buzzword also handles graphics well, making it a good candidate for simple office newsletters or flyers.

Today, Buzzword documents can also be placed with ease into InDesign CS5. To start, go to the File menu in InDesign CS5 and choose Place from Buzzword. After logging in to Acrobat.com with your Adobe ID, you’ll be presented with the Place Buzzword Documents dialog box (Figure 97a).

Figure 97a. The Place Buzzword Documents dialog box allows you to select from a variety of options, including placing multiple documents based on their Web location.

After choosing a document and its options, click OK. The document will quickly download from the Buzzword server to your InDesign document in the form of the typical Place Cursor. Click once more to place your text as you would normally.

Selecting the Show Import Options check box invokes a dialog box that looks like the Microsoft Word Import Options dialog box that InDesign has used for years (Figure 97b). Among the many features of this voluntary stopover is the ability to map incoming paragraph and character styles to those already resident in your InDesign document.

Figure 97b. Although daunting at first glance, the Buzzword Import Options dialog box is surprisingly understandable provided you stare at it long enough.

#98. Creating an Online Review

If you’ve grown weary of waiting on design clients to slog through the old respond-and-review dance, the new CS Review service might be your salvation. Working in real time, this CS Live component allows you to upload your latest masterpiece to a shared Adobe server, where you and your client can both chat (that is, type) about its pros and cons. Other files can even be added to the review to support your discussion.

When you’re ready to begin, start by clicking the CS Live button in the upper-right corner of Photoshop, Illustrator, InDesign, or Premiere Pro. You could also open the Window menu and go to Extensions > CS Review. Select the Create New Review item in the drop-down menu (Figure 98a).

Figure 98a. To initiate an online review, click Create New Review in the CS Live drop-down menu.

Clicking the Create New Review button will open the Create New Review dialog box. Here you name your review and tell it whether or not to use the currently active document (Figure 98b).

Figure 98b. Use the Create New Review dialog box to name your review and to indicate if it uses the active document.

The next screen to appear is the Upload Settings dialog box (Figure 98c). Use this dialog box to indicate the specific pages (or parts) of your document you’d like to review, and whether the quality of the page snapshots should be Low, Medium, or High. The Intent menu lets you choose between Web or Print.

Figure 98c. The Upload Settings dialog box is where you tell the software which pages to upload, what quality to use, and what their intent is.

Once your review pages are uploaded, they open in your browser on Acrobat.com (Figure 98d). It’s from this window that comments are added.

Figure 98d. You conduct your review in the main window on Acrobat.com.

The next step is to invite your client or clients to participate in the review. Clicking the Share File button at the bottom left of the screen invokes the Share dialog box (Figure 98e). Note that participants can be invited as coauthors or reviewers. Reviewers can add and delete their own comments; coauthors can add and delete their own and others’ comments, and they can add additional parts to the overall review.

Figure 98e. The Share dialog box is where you go to send e-mail invites to those you’d like to participate in the review. Clicking the Options button allows you to extend sharing to others.

To add comments to a review, click on the green Add Comment button in the navigation bar of the main window, or select it from the Review menu. Comments can apply to the entire layout or to specific areas for review. In Figure 98f we’ve highlighted the inset photo and written a query about its page position.

Figure 98f. The Add a Comment cursor highlights a specific area, seen here as a red rectangle, for discussion.

To make reviewing even more intuitive, each reviewer’s comment has a Jump To and Reply button at the bottom (Figure 98g). Clicking Reply produces a small window for entering your comment reply. Clicking Jump To takes you to the area being discussed in the snapshot and enlarges it.

Figure 98g. Here we can see how clicking Jump To enlarges the area being discussed, and highlights its text.

Meanwhile, back in InDesign CS5, the CS Review panel maintains a real-time connection with what’s happening remotely on Acrobat.com. As pages are viewed and comments added, the panel keeps a running account of the activity for each review (Figure 98h). The icons (left to right) indicate the number of persons the review is shared with and the number of persons currently engaged in the review, the number of times the Review has been viewed, and the number of comments made.

Figure 98h. The CS Review panel does an excellent job of keeping the designer apprised of the activity on the review. Here the top review is highlighted, indicating it’s currently active.

#99. Screen Sharing via Adobe ConnectNow

Sending a PDF to your clients is a great way to show them a color version of a project in progress—but once it’s been sent off via e-mail, follow-up is often complicated. It invariably involves another e-mail or a phone call in which your customers describe the PDF and discuss desired changes or bring up questions. A face-to-face conversation would be ideal, but it isn’t always practical or possible. However, with the Share My Screen feature built into most of the CS5 applications, you can quickly share your screen with clients or colleagues so they can see exactly what you see, and vice-versa (Figure 99a).

Figure 99a. The Share My Screen feature is available from the File menu in InDesign, Photoshop, Illustrator, Dreamweaver, and Flash Professional. In Acrobat 9 Pro, it’s also under the File menu, but within the Collaborate submenu.

Share My Screen launches your browser and connects you to Adobe’s ConnectNow screen-sharing service that allows you to create online meeting rooms where you can host meetings, share your screen, or control another meeting attendee’s screen. A plug-in is required to enable screen sharing. Once you’ve logged in with your Adobe ID, you’ll be prompted to install the plug-in, if you haven’t already. The installation is quick and seamless.

Once you’ve logged in to ConnectNow, your meeting room is assigned a default (but customizable) URL that your clients and colleagues use to join you for an online meeting. ConnectNow will also send an e-mail invitation to everyone you invite to the meeting, including a link to the meeting room URL. The people attending your meeting won’t need an Adobe ID—they can simply log in as guests—but they’re required to install the ConnectNow plug-in.

When you activate screen sharing—which you can limit to just document windows or a specific application, or expand to everything going on your computer screen—the ConnectNow interface “falls away” on your end except for a floating panel in which you can see some of the “pods” that support the meeting (Figure 99b). These include an Attendees pod, where you can see who’s in the meeting with you, a Chat pod where you can type messages to all attendees or a specific person, and a Webcam pod where you can allow ConnectNow access to your Webcam and add audio/video conferencing capability to the meeting.

Figure 99b. The ConnectNow panel floats atop all other windows on the host’s computer during a ConnectNow meeting.

The people attending your meeting view the interface in their browser, with the majority of the window taken up by what’s on your screen. Surrounding that are the Chat, Webcam, and other pods, consolidated in a single window (Figure 99c).

Figure 99c. An InDesign document shared via ConnectNow, as seen in a meeting attendee’s browser.

At any point, you can also annotate what’s on the screen with highlights, text callouts, and drawn shapes (Figure 99d) by clicking Start in the Annotate pod. This freezes the screen to its current display and opens up the Annotation toolbar, from which you choose the tools you need to mark up the snapshot of the screen being displayed. You can click the toolbar’s Save icon to save a screen shot of the marked-up image to document the notes and changes. Click Stop to exit Annotation mode and return to live screen sharing.

Figure 99d. An annotated screen image with highlighted changes in ConnectNow.

#100. Tracking Web and Mobile Trends with SiteCatalyst NetAverages

Although a word like analytics doesn’t play into a designer’s typical vocabulary, the rapid migration of content from the printed page to the Web and mobile platforms is likely to bring it more into our project discussions at the planning stage—just as we all had up-front discussions about paper stock, trim size, and number of inks when print stood alone in the publishing landscape. As the final tip in this book, it’s fitting that we look at Web analytics, which will greatly influence our project planning and impact our design decisions in the coming years.

In the past, there was greater control over the deliverable—a newspaper ad ran in a specific newspaper at a given size, on paper; a catalog went out in the mail to a defined list of recipients who browsed through it page by page on the paper we printed it on. Now, of course, a newspaper or catalog can be distributed on the Web. But that’s not a simple change in distribution media because there isn’t an equivalent for a standard paper stock when you’re publishing content via the Web. The “paper” is a browser, and we don’t get to pick which one displays our content—the reader does.

To further complicate things, mobile device use has exploded, and smartphones and tablets are poised to become people’s primary and preferred way to access online content. There are already several competing front-runners in the mobile device arena and there are different platforms and different standards. The effect is like asking a designer to design a newspaper or catalog that must be deliverable on any paper stock, at any physical size, and look great in both portrait and landscape orientations.

That’s a pretty tall order, and what designers need before they can take on these new challenges is a frame of reference as to which browsers, operating systems, and devices have enough market share to warrant influence on how they optimize and structure their online and mobile designs. SiteCatalyst NetAverages—part of the CS Live online services—provides fast, up-to-date access to that kind of data.

When you first use your Adobe ID to log in to SiteCatalyst NetAverages—by either clicking on that option in the CS Live menu or choosing Window > Extensions > Access CS Live—you’re presented with a snapshot of the top yearly desktop trends (Figure 100a). The trends include the largest increased or decreased prevalence of operating systems, browser versions, Flash Player installations, and so on, over the past year. You can switch to a monthly view for more recent trends, and you can click the Mobile button in the site’s top menu bar to view the yearly and monthly trends for mobile devices.

Figure 100a. SiteCatalyst NetAverages’ Top Yearly Trends overview screen for desktop browsers indicating the percentage change for each over the year.

For more granular-level information, SiteCatalyst NetAverages uses a Flash-based, visual display of data when you want to drill down into specifics. Simply click on the appropriate radiating labels such as Browser Version (Figure 100b) or switch to the Mobile tab and choose Operating System (Figure 100c) to view statistics for that subset of data.

Figure 100b. SiteCatalyst NetAverages’ desktop browser version statistics.

Figure 100c. SiteCatalyst NetAverages’ mobile operating system statistics with a detail pop-up showing percentage changes from the previous month and year.

Click on a specific piece of data in that graph (a specific mobile device operating system’s percentage of use, for example), and you drill further down into specifics showing changes since the previous month or year (Figure 100d).

Figure 100d. One level further into SiteCatalyst NetAverages’ data, you can subscribe to e-mail alerts for changes in a specific trend.

At this point you can subscribe to an e-mail alert about this particular piece of data by targeting a percentage that’s meaningful to you (Figure 100e). For example, you may want to know when the Apple iPhone/iPad’s iOS mobile operating system reaches 50 percent of the market, or when Google’s Android OS reaches 25 percent. These may be strategic game-changers for the resources and level of support you throw behind devices with these operating systems, and you’ll want to know as soon as data reflects that they’ve hit your target.

Figure 100e. SiteCatalyst NetAverages’ list of requested e-mail alerts comparing current trends to the targeted percentages you specify. When a data point reaches your target, you’ll be notified at the e-mail address used for your Adobe ID.

Your purchase of CS5 Design Premium includes free access for one year to this real-time data on the current state of Web usage, browser types, operating systems, mobile device profiles, and screen resolution. This data helps inform your content-creation choices and reduces guesswork early in the creative process. With it, you can quickly determine the levels of browser and device support that will best serve your audience or your client’s needs in the ever-changing media landscape.