July 08, 2016 | Extras | en
Extending the capabilities of Creative Cloud apps is a Grail Quest for many users. Although it has been made possible (almost blindly) with Adobe Configurator, the new HTML panel architecture requires a huge cognitive leap. Alas and alack, no adequate documentation is available that would both synthesize knowledge and accompany learning. I mean, was available! Thanks to Davide Barranca and its “PhotoShop panels development” book and course, every developer can now access a solid, unfragmented information about Adobe HTML panels and extensions. And convert theory into practice…
[Photoshop HTML Panels Development – Build and Market Adobe Creative Cloud Extensions, by Davide Barranca, 2016, 288 pages, eBook and code samples from €149.00.]
The HTML Panel Jungle
Adobe's Common Extensibility Platform (CEP)—formerly, Creative Suite Extensible Services (CSXS)—is the sprawling technology behind, or within, HTML extensions. It is now deeply innervated in most Creative Cloud applications. As Davide noted, “HTML Panels are supported from Photoshop CC, which is the only version that can handle both Flash and HTML at the same time, onwards. We’re possibly allowed to think that they will last longer, for it is a food that Photoshop itself eats: the Library Panel, the Export As dialog, the Welcome screen have been coded by Adobe as HTML Panels, for instance.”
But what is said of Photoshop is also true for InDesign and others. That's the reason why Davide's book and course extend far beyond Photoshop's field. In fact, excluding DOM- and event-specific parts, most of the techniques exposed in the book apply as well to InDesign, InCopy, Illustrator, Premiere Pro, After Effects, Prelude, Flash Pro, and Dreamweaver. This “has been corroborated by beta readers who work on InDesign and Illustrator.” The key point is easy to get, HTML Panels are nothing but Web applications “hosted inside, and communicating with, Adobe Creative Cloud apps.”
To answer these questions and many more, you can either spend weeks (months? years?) browsing Web forums, collecting partial data, testing tricks and hacks, recomposing the complicate story of CEP layers, connecting the dots between CEF (Chromium Embedded Framework), HTML5, CSS3, ES5/Node.js, and the JSX Virtual Machine… Or, follow the step by step guide the author has painstakingly drawn up.
Concepts first, then code!
“I like to introduce concepts first, then discuss the implementation,” Davide wrote. The book is entirely structured according to this rule and, in my opinion, that's what makes it priceless.
As you can see, information bricks are articulated to gradually meet your needs. Chapters 1 to 4 brings you the basics to get started and have your very first panel showing up. Then you need to explore how CEP actually evaluates your ExtendScript code through the CSInterface.js library (Chapter 5) and how data exchanges and events are processed between the “host application” (Photoshop, InDesign…) and the Web application (your panel!), as discussed in Chapters 6-7. Chapters 5 to 7 are definitely the nerve center of the guide, you have to read them very carefully (and likely several times) to soak up the wealth of information they contain. Believe me, the effort is worth it!
Then, the specific “Web flavor” of your project is explored in depth throughout Chapters 8, 9, 11, and 12, while Chapter 10 addresses the multifaceted issue of data persistence—which can be solved by various methods, either through ExtendScript or CEP file system API, or through Node.js, Ajax or Web storage.
Finally, Chapters 13 to 15 cover front-end topics, in particular licensing, packaging, distributing, and marketing a CC extension. Here again this is a tricky part, as Adobe didn't release any survival guide to the mess of packaging panels! Davide did it, and this will help you “spend as little time as possible replying to customer support emails.”
It must be highlighted that the eBook (288 pages) comes with a package of 28 “real word” demo panels fully commented, so you can instantly put your knowledge into testable examples. No need to create from scratch the complicate folder and file structure required for declaring an extension, just use Davide's boilerplate as a safe starting point.
About the Pricing
Let's face the question. This “missing” HTML panel book authored and designed by Davide Barranca may seem expensive at first glance. The Basic Edition (PDF/ePUB/Mobi + 28 panels) costs $149.00, which is somehow the price of a pro software.
But, indeed, this is an expert tool! If you are serious about building Adobe add-ons and making it a business, consider this a sustainable investment, as well as a huge time saver. To my knowledge you will not find any equivalent information elsewhere. Educational content and secret tips are gathered here in a unique, efficient, and productive way.
Well, you don't have to take my word for it! Try to build and market from A to Z an InDesign panel without this book, and keep me informed ;-)
• Details (and alternate editions): htmlpanelsbook.com
• Davide Barranca's Photoshop blog: davidebarranca.com
• See also: cs-extensions.com