Anselm Hannemann ist selbständiger Frontend-Webentwickler und Digital- Publishing-Spezialist aus München. Er ist Mitorganisator der PUBKON Publishing-Konferenz, im Kernteam von opendevicelab.com und entwickelt an Webstandards wie Responsive Images mit. Michaela Lehr ist Autorin und Mediengestalterin und hat sich auf die Optimierung von Inhalt, Design und Produktionsprozess digitaler und mobiler Online- Medien mit der Adobe Digital Publishing Suite und CSS3 spezia lisiert. Richard Brammer ist Wirtschaftsinformatiker und entwickelt seit über zehn Jahren Web-Applikationen. Seine Schwerpunkte sind Beratung und Schulung zu den Entwicklungsprozessen und der Performance von Apps mit der Adobe Digital Publishing Suite und HTML5. Michaela Lehr und Richard Brammer leben und arbeiten in Berlin. Dort gründeten sie 2011 das auf Digital Publishing spezialisierte Studio Geil,Danke! GmbH und schrieben das Buch»Digitales Publizieren für Tablets«. Zu ihren Kunden zählen der Rolling Stone, Axel Springer, Condé Nast und einige bekannte Marken- und Medien-Agenturen. Seit der Beta-Phase der Adobe Digital Publishing Suite produzieren und vermarkten sie die Spiele-Zeitschriften elektrospieler und CRATE.
Richard Brammer, Anselm Hannemann, Michaela Lehr Adobe Digital Publishing Suite Apps entwickeln mit InDesign und HTML5
Lektorat: Barbara Lauer Fachlektorat: Kai Rübsamen Copy-Editing: Sandra Gottmann Satz: Michaela Lehr Herstellung: Frank Heidt Umschlaggestaltung: Helmut Kraus, www.exclam.de Druck und Bindung: Himmer AG, Augsburg Bibliografische Information der Deutschen Nationalbibliothek Die Deutsche Nationalbibliothek verzeichnet diese Publikation in der Deutschen Nationalbibliografie; detaillierte bibliografische Daten sind im Internet über http://dnb.d-nb.de abrufbar. ISBN: Buch 978-3-86490-039-6 PDF 978-3-86491-328-0 epub 978-3-86491-329-7 1. Auflage 2013 Copyright 2013 dpunkt.verlag GmbH Ringstraße 19B 69115 Heidelberg Die vorliegende Publikation ist urheberrechtlich geschützt. Alle Rechte vorbehalten. Die Verwendung der Texte und Abbildungen, auch auszugsweise, ist ohne die schriftliche Zustimmung des Verlags urheberrechtswidrig und daher strafbar. Dies gilt insbesondere für die Vervielfältigung, Übersetzung oder die Verwendung in elektronischen Systemen. Es wird darauf hingewiesen, dass die im Buch verwendeten Soft- und Hardware-Bezeichnungen sowie Markennamen und Produktbezeichnungen der jeweiligen Firmen im Allgemeinen warenzeichen-, marken- oder patentrechtlichem Schutz unterliegen. Alle Angaben und Programme in diesem Buch wurden mit größter Sorgfalt kontrolliert. Weder Autor noch Verlag können jedoch für Schäden haftbar gemacht werden, die in Zusammenhang mit der Verwendung dieses Buches stehen. 5 4 3 2 1 0
v Geleitwort»Es bleibt alles anders.«dieses von Herbert Grönemeyer entliehene Zitat beschreibt ganz gut, was seit einigen Jahren in der Publishing-Branche passiert. Spätestens seit der Einführung des ipads 2010 ist Digital Publishing das Publizieren für mobile Endgeräte in aller Munde. Egal ob Zeitung oder Zeitschrift, Buch oder Geschäftsbericht, Katalog oder Broschüre alles soll und alles wird auf mehreren Vertriebswegen (Papier, Web, App) an den Kunden ausgeliefert. Digital Publishing mit InDesign erlaubt Grafikern und Gestaltern aus dem Printumfeld mit ihren bekannten Werkzeugen den Einstieg in dieses neue Aufgabengebiet. Es bringt aber auch Programmierern und Webentwicklern die Themen Typografie und»pixelperfect Design«näher. Viele Konzepte, zum Beispiel das einer Zeitschrift, bei der vorab ausgewählte Inhalte per Einzelverkauf oder Abonnement erworben werden, bleiben bisher auch in der digitalen und mobilen Welt identisch allerdings angereichert mit neuen Möglichkeiten, die Touchdisplays und die fast ständige Verbindung mit dem Internet erlauben. So werden nun auch in Printredaktionen Videos ausgewählt und Grafiken nicht nur erstellt, sondern auch animiert. Kataloge sollen Produkte nicht mehr nur präsentieren, sondern direkte Bestellmöglichkeiten bieten. Tutorials vermitteln nicht mehr nur einen bestimmten Stoff sie fragen auch gleich ab, was davon verstanden und behalten wurde. Es bleibt alles anders. Lehnen Sie sich entspannt zurück denn vieles bleibt, wie Sie es kennen. Ob Sie nun für DIN A4 gestalten oder auf einer Fläche von 1024 x 768 Pixeln, ob Sie ein Bild platzieren oder eine Bildergalerie die Unterschiede sind minimal und mit Hilfe des vorliegenden Buches schnell gemeistert. Vieles ist aber auch anders und neu. Feedback durch Usertracking, Response-Elemente, die tatsächlich eine direkte Antwort oder einen Kauf ermöglichen, eine App mit separaten Inhalten für Enduser und Handelspartner jeweils in verschiedenen Sprachen: Diese Aufgabenstellungen gehen weit über das Gestalten hinaus und erfordern zum Teil zusätzliche Kompetenzen insbesondere im Bereich HTML. Aber auch hier vermittelt das vorliegende Buch einen guten Einstieg. Das Thema digitales bzw. mobiles Publizieren ist noch immer sehr neu Anfang 2010 kamen die ersten Apps für das damals nagelneue ipad auf den Markt, inzwischen aber auch schon so etabliert, dass es mehrere Tausend Kunden gibt, die eine riesige Menge an Apps mit der Adobe Digital Publishing Suite erstellt haben. Und jeden Tag liefert Adobe weit über 160.000 Exemplare digitaler Projekte weltweit aus.
vi Ich empfehle Ihnen: Bleiben auch Sie anders. Tauchen Sie ein in eine neue Welt und testen Sie Digital-Publishing-Konzepte in Ihren Projekten und mit Ihren Kunden. Nutzen Sie dieses Praxisbuch, um sich deutlich von Ihren Mitbewerbern abzusetzen. Wie schnell das auch Ihr Business verändern kann, zeigt sich bestens an den Autoren, die allesamt zu den erfahrensten»digital Publishern«mit der Adobe Digital Publishing Suite in Deutschland gehören. Anselm Hannemann lernte ich vor vier Jahren kennen, als er gerade seinen ersten Vortrag für die Münchner InDesign-Usergroup hielt. Im nächsten Jahr war er bei den Ersten, die mit der Digital Publishing Suite arbeiteten, und heute hilft er Firmen wie Burda beim Ausbau des digitalen Publizierens und hält europaweit Vorträge insbesondere zu HTML und Web-Themen. Die Firma von Michaela Lehr und Richard Brammer Geil,Danke! nennt das übliche Kundenfeedback schon im Namen. Als ich die beiden zum ersten Mal in einem Berliner Café traf, erzählten sie mir von ihrem ersten Kontakt mit Edenspiekermann. Deren Mitarbeiter meldeten sich nämlich bei der jungen Agentur an und meinten sinngemäß: Ihr kennt euch doch gut mit Digital Publishing aus könnt ihr nicht mal vorbeikommen und einen Workshop halten? Dies wäre in der alten, analogen Welt sicherlich unvorstellbar gewesen. Nutzen also auch Sie Ihre Chance und bleiben Sie anders. Wir befinden uns gerade am Anfang einer digitalen Revolution. Wohin die Reise geht, weiß noch keiner genau. Aber alle, die mit auf die Reise gehen, können die Route beeinflussen. Ingo Eichel Sr. Business Development Manager, Media & Entertainment, Adobe Systems GmbH
Inhalt 1 Einleitung 1 1.1 Für wen ist dieses Buch geeignet? 4 1.2 Für wen ist dieses Buch eher nicht geeignet? 5 1.3 Was erwartet Sie in diesem Buch? 6 2 Die Adobe Digital Publishing Suite im Überblick 9 2.1 Darf ich vorstellen? Adobe Digital Publishing Suite 10 2.2 Was ist denn überhaupt möglich? Optionen und Lizenzmodelle 13 2.3 Ein Blick auf den Workflow 16 2.4 Apropos: Hard- und Software, die Ihnen das Leben erleichtert 18 2.4.1 Tablets und Smartphones 19 2.4.2 Software 20 3 Vorbereitung und Layout 23 3.1 Digital Publishing kompakt: Das sollten Sie wissen 24 3.1.1 Konzeption 24 3.1.2 Usability auf Mobilgeräten 27 3.1.3 Typografie auf Mobilgeräten 31 3.2 Bevor es losgeht: Die Software installieren und einrichten 38 3.2.1 Digital-Publishing-Plug-ins installieren 39 3.2.2 Nützliche InDesign-Voreinstellungen 39 3.2.3 Der Arbeitsbereich 40
viii Inhalt 3.3 Vorbereitung ist alles! So erstellen Sie DPS-Templates 41 3.3.1 Vorlagen mit Musterseiten erstellen 42 3.3.2 Was gehört in eine InDesign-Bibliothek? 44 3.3.3 Layouts für mehrere Endgeräte 44 4 Prozess- und Prozessoptimierung 51 4.1 Produktionsprozess 52 4.1.1 Ordnerstruktur 54 4.1.2 Das Digital-Publishing-Suite-Portal 56 4.1.3 Folios richtig erstellen 59 4.1.4 Layouts richtig erstellen 64 4.1.5 Verschiedenen Testing-Varianten 68 4.1.6 Der Upload in den Folio-Producer-Organizer 70 4.1.7 Veröffentlichen auf den Distributionsserver 78 4.2 Verbessern Sie Ihr Produkt und Ihren Produktionsprozess 82 4.2.1 Sieben Tipps für die Foliogrößen-Optimierung 82 4.2.2 Sieben Tipps für eine kürzere Produktionszeit 84 5 Interaktivität & Multimedialität 87 5.1 Multimedia 88 5.1.1 Video 91 5.1.2 Audio 92 5.2 Interaktivität 94 5.2.1 Objektstatus oder Mehrere-Status-Objekt (MSO) 94 5.2.2 Diashow 96 5.2.3 Animation mit Diashow 98 5.2.4 Schaltfläche 99 5.2.5 Pop-up, Hotspot und Zoom 103 5.2.6 Durchlaufbarer Rahmen 107 5.2.7 Bildsequenz 110 5.2.8 Schwenken und Zoomen 112 5.2.9 Panorama 113 5.3 Multimedia und interaktive Features kombinieren 116 5.4 Fehler und Workarounds 118
Inhalt ix 6 Animationen mit Edge Animate 123 6.1 Was ist Adobe Edge Animate? 124 6.2 Was kann Edge Animate leisten und was nicht? 125 6.3 Die Oberfläche von Edge Animate 126 6.4 Los geht s! Eigene Animationen erstellen 127 6.4.1 So richten Sie Animationen ein 128 6.4.2 So importieren Sie Ihre Daten 129 6.4.3 Prinzipien der Animationserstellung 129 6.4.4 Die Zeitleiste 130 6.4.5 Arbeiten mit Effekten 132 6.4.6 Transitions 133 6.4.7 Arbeiten mit Ebenen 135 6.4.8 Webfonts einbinden 135 6.5 Animationen mit Code interaktiv aufbereiten und gestalten 140 6.6 Exportieren und Veröffentlichen von Animationen 142 6.7 Der Umgang mit High-Resolution-Displays 144 6.8 4:3 / 16:10 / 16:9 Responsive Layouts mit Edge Animate 145 6.9 Webseiten einbinden am Beispiel von Google Maps 146 6.9.1 Der Dokumentaufbau 146 6.9.2 Code-Aktionen hinterlegen 146 6.9.3 Der Code-Editor 147 6.9.4 Karte mit Button-Interaktion aufrufen 148 7 HTML, CSS und JavaScript 149 7.1 Richtlinien für flüssiges HTML auf Mobilgeräten und in der DPS 151 7.1.1 Beispieldokument HTML für DPS 151 7.1.2 System- und Auflösungsunabhängigkeit 153 7.1.3 Von Pixeln zu Prozenten 154 7.1.4 Feature-Detection statt Browser-Detection 155 7.1.5 Performance-Optimierung 156 7.2 InDesign-Seiten mit Ihren Animationen versehen 156 7.2.1 Webinhalt in InDesign einbauen 157 7.2.2 Einbindung einer responsive Website 158 7.3 So binden Sie HTML-Artikel ein 159
x Inhalt 7.4 Die Grundlagen von HTML, CSS und JavaScript 162 7.4.1 HTML 162 7.4.2 CSS 165 7.4.3 JavaScript 170 8 Apps für ipad, ipod Touch und iphone 179 8.1 Certificates, Identifiers & Profiles 183 8.2 itunes Connect, Teil 1 193 8.3 DPS App Builder 197 8.3.1 Eine Einzelausgaben-App erstellen 197 8.3.2 Eine Kiosk-App erstellen (Multi-Folio-App) 201 8.3.3 Eine Zeitungskiosk-App mit Abonnement erstellen 205 8.3.4 Eine App für ipad, iphone und ipod Touch erstellen 207 8.3.5 Eine Enterprise-Edition-App erstellen 207 8.4 itunes Connect, Teil 2 214 8.4.1 In-App-Käufe, Abonnements & Zeitungs kiosk 214 8.4.2 App und In-App-Produkte testen 218 8.4.3 App hochladen 220 8.5 Checklisten 222 9 Apps für Android und Amazon Kindle Fire 225 9.1 Google Play 226 9.1.1 Google-Play-Entwicklerprofil, Wallet und Checkout 228 9.1.2 Eine neue App registrieren 230 9.1.3 Lizenzschlüssel der App mit DPS-Konto teilen 231 9.1.4 App mit dem DPS App Builder konfigurieren 232 9.1.5 App an die Developer Console übertragen 233 9.1.6 In-App-Käufe bei Google Play registrieren 234 9.1.7 App und In-App-Kauf testen 235 9.1.8 Fertigstellen und App veröffentlichen 238
Inhalt xi 9.2 Amazon App-Shop 239 9.2.1 App bei Amazon registrieren 239 9.2.2 App mit DPS App Builder konfigurieren 241 9.2.3 App auf dem Kindle Fire testen 242 9.2.4 In-App-Produkte auf dem Kindle Fire anlegen 242 9.2.5 In-App-Produkte bei Amazon anlegen 245 9.2.6 Binary mit Testinstruktionen senden 245 10 Optimierung und Erfolgskontrolle 247 10.1 Setzen Sie Ihre App ins richtige Licht! 248 10.1.1 App-Icon und Zeitungskiosk-Cover 248 10.1.2 Bewertungen 250 10.1.3 Preis 251 10.1.4 Name der App 252 10.1.5 Screenshots 253 10.1.6 Keywords 254 10.1.7 Beschreibungstext 255 10.1.8 Kategorie 256 10.1.9 Namen von In-App-Käufen und Entwicklern 256 10.1.10 Update-Nachricht, Neues in dieser Ausgabe 257 10.1.11 Landingpage, Video und Werbebanner 257 10.1.12 Kontinuierliche Verbesserung 258 10.2 Daten erheben und analysieren 259 10.2.1 Was gehört zur Erfolgskontrolle? 259 10.2.2 Käufe und Konversionsrate 261 10.2.3 Lese-Analysen mit Omniture Analytics 264 10.2.4 Weblinks verfolgen 265 10.2.5 Online-Webinhalte und Webseitenbesuche 266 10.2.6 Umfrage einbinden 268 10.3 Cross-Media- und Offline-Analyse 268 Index 271
Einleitung 1.1 Für wen ist dieses Buch geeignet? 4 1.2 Für wen ist dieses Buch eher nicht geeignet? 5 1.3 Was erwartet Sie in diesem Buch? 6
2 1 Einleitung Digitale Magazine gibt es schon seit ein paar Jahrzehnten, doch erst mit der Verbreitung von mobilen Geräten wie Smartphones, Tablets oder E-Book-Readern konnten sie wahrnehmbare Erfolge feiern. Das ausschlaggebende Gerät war das erste ipad von Apple, das im Januar 2010 erschien. Noch im gleichen Jahr erschien im April die erste Tablet-Ausgabe eines Magazins: die Time. Dass bereits ein Jahr später annähernd 500 Tablet-Magazine für das ipad verfügbar waren, zeigt, wie groß die Nachfrage für digitale Zeitschriften bereits Anfang 2011 war. Laut dem Magazine Fact Book 2012 / 13 1 ziehen heute ganze 61 Prozent das Lesen auf dem Tablet dem analogen Lesen eines Magazins vor. Aus diesem Grund bemühen sich Verlagshäuser und Kleinverlage, Agenturen und Freelancer, auf dem Gebiet digitaler Magazine Know-how aufzubauen. Doch was sind digitale Magazine eigentlich? Digitale Magazine, so wie wir in diesem Buch davon sprechen, sind Publikationen mit einem Editorial Design und einem einigermaßen feststehenden redaktionellen Inhalt. Sie können über Tablets oder Smartphones gekauft und heruntergeladen werden, wobei sie in vielen Fällen zur Marke eines gedruckten Magazins gehören häufig entspricht der Inhalt exakt dem eines gedruckten Magazins. Abbildung 1.1 Rolling Stone auf dem ipad 1 http://bit.ly/magazinemediafactbook
3 Digitale Magazine können auf die mobilen Geräte über App-Stores oder als Web-App aus dem Web geladen werden. Die Distribution über einen Store, beispielsweise den Apple App-Store oder den Google Play Store, hat sich allerdings durchgesetzt, so dass heute die Mehrheit der digitalen Magazine über eine ios- oder Android- App verfügt. Viele Magazine werden seit kurzer Zeit auch für Smartphones angeboten, denn seit den hochauflösenden Retina-Displays ist Lesen auf kleinen Bildschirmen ebenso angenehm wie auf Tablet-Displays. Die Anzahl und der Erfolg digitaler Magazine werden laut Einschätzungen von Branchenexperten auch weiterhin wachsen. Das hat einerseits zu tun mit den vielfältigeren Möglichkeiten, die dieses Medium bietet, und andererseits mit dem schwindenden Interesse an Printmagazinen. So können beispielsweise Anzeigen und deren Konsum genau gemessen und ausgewertet werden, eine Internetverbindung ermöglicht Käufe direkt aus der Zeitschrift heraus oder Leser können via Mail und Social-Media-Anbindungen ohne Medienbruch auf andere Kanäle geleitet werden. Dies ist nicht nur für Publisher, sondern vor allem auch Anzeigenkunden ein großer Vorteil. Adobe hat zur Geschichte und zu dem Erfolg digitaler Magazine maßgeblich beigetragen. Ein Team von Adobe hat gemeinsam mit dem amerikanischen Verlag Condé Nast an einem digitalen Magazin gearbeitet, noch bevor das ipad auf den Markt kam. Und aus eben diesem Produkt wurde die Digital Publishing Suite, mit der die US-amerikanische»Wired«2 im Juni 2010 das zweite Magazin in Apples App-Store wurde. Seither wurden mit der Adobe Digital Publishing Suite mehr als 2.000 Magazine in die Stores gebracht, während die Zahl an heruntergeladenen Ausgaben im Oktober 2012 beispielsweise 4,6 Millionen beträgt. Nicht nur weltweit, sondern auch in Deutschland ist die Digital Publishing Suite derzeit das am häufigsten benutzte Werkzeug, um digitale Magazine mit InDesign in die App-Stores zu bringen. Und auch wenn das Produkt noch viel Verbesserungspotential hat, ist es momentan der zuverlässigste und kreativste Weg, um digitale Magazine zu veröffentlichen. Die Digital Publishing Suite bietet sich allerdings nicht nur an, um bestehende Printpublikationen mit neuem, angepasstem Layout in die App-Stores zu bringen. Auch völlig neue Publikationen mit mo- 2 http://bit.ly/wiredus
4 1 Einleitung dernen Konzepten, Geschäftsberichte, Präsentationen, illustrierte Bücher, Nachschlagewerke und aufwändige Kataloge können prima mit der Digital-Publishing-Lösung von Adobe umgesetzt werden. In vielen Fällen ist hierfür noch nicht einmal eine DPS-Professional- Lizenz nötig, sondern das Creative-Cloud-Abonnement oder allein InDesign ab Version CS5 ist ausreichend. Allerdings hat die DPS natürlich auch ihre Grenzen. Sie ist nicht geeignet, um hundertseitige Romane mit reinem Text zu veröffentlichen, und auch komplizierte Kataloge mit integrierter Warenwirtschaftssoftware werden besser auf andere Art und Weise umgesetzt. Hinzu kommt, dass die Digital Publishing Suite nicht barrierefrei und somit auch nicht für Behörden oder staatliche Institutionen geeignet ist. Wann immer allerdings ein grafisch aufwändiges Layout, Editorial Design, Multimedialität, Interaktivität, Lesen oder Präsentieren auf dem Tablet oder dem Smartphone gefragt sind, ist die DPS das Tool der Wahl. 1.1 Für wen ist dieses Buch geeignet? Wir haben dieses Buch in erster Linie als Arbeitsbuch und Referenz für Anwender von InDesign mit der Digital Publishing Suite geschrieben. Egal ob Sie als Einsteiger den Umgang mit den Tools erlernen wollen oder bereits intensiv mit der Suite gearbeitet haben: Sie werden in diesem Buch auf viele hilfreiche Tipps aus der Praxis stoßen und lernen, wie man professionell auf Mobilgeräten publiziert. Lernen Sie, wie Sie Ihre Dokumente einrichten, wie Sie Interaktivität sinnvoll einsetzen und wie Sie in weniger Zeit mehr erreichen. Unsere zweite große Zielgruppe sind Produktmanager, Projektleiter, Product Owner oder Produzenten von digitalen Publikationen, die einen fundierten Überblick über den kompletten Entwicklungsprozess einer App erhalten wollen. Erfahren Sie, welche Schritte notwendig sind, um zum Beispiel ein Magazin, einen Geschäftsbericht, eine Präsentation oder einen Katalog auf Tablets und Smartphones zu veröffentlichen, oder wie Sie Ihren Produktionsprozess verbessern können.
Für wen ist dieses Buch eher nicht geeignet? 5 Wenn Sie sich für Online-Medien, Informatik oder Design interessieren, in diesem Bereich studieren oder eine Ausbildung machen, so gibt dieses Buch Ihnen eine gute Hilfestellung. Lernen Sie mit der Adobe Digital Publishing Suite eines der wichtigsten und verbreitetsten Werkzeuge zum Veröffentlichen von gestaltungsintensiven digitalen Inhalten kennen. Erfahren Sie mehr über die Möglichkeiten und Grenzen des digitalen Publizierens und meistern Sie das führende Tool der Branche. 1.2 Für wen ist dieses Buch eher nicht geeignet? Da dieses Buch viele sowohl kleine als auch umfangreiche Beispiele aus der Praxis behandelt, sollten Sie es als Arbeitsbuch verstehen. Wir gehen davon aus, dass Sie parallel mit den vorgestellten Werkzeugen arbeiten, während Sie unsere Seiten lesen. Daher ist dieses Buch nicht geeignet für Leser, die einen Branchenüberblick suchen. Hierzu empfehlen wir Ihnen das ebenfalls im dpunkt-verlag erschienene Buch»Digitales Publizieren für Tablets«3, in dem neben der Digital Publishing Suite von Adobe sechs verwandte Werkzeuge zum Veröffentlichen auf Tablets (und Smartphones) vorgestellt werden. Zwar behandeln wir die Themen Adobe Edge Animate und die Grundlagen von HTML5 in diesem Buch, doch sind diese beiden Kapitel eher als Einstieg in die Möglichkeiten und Nachschlageressource von HTML innerhalb der Digital Publishing Suite gedacht. Vielzählige Bücher über HTML5, CSS3 und JavaScript finden Sie mittlerweile auch in deutscher Sprache. Als ausführliche Referenz über alle Möglichkeiten von Adobe Edge Animate empfehlen wir»lebendige Webseiten mit Adobe Edge Animate«4 von Simon Widjaja. 3 http://tabletpublishing.mobi/buch 4 http://bit.ly/edgeanimatedpunkt
6 1 Einleitung 1.3 Was erwartet Sie in diesem Buch? Im nächsten Kapitel stellen wir die Digital Publishing Suite vor. Wir beschreiben die einzelnen Werkzeuge und den grundsätzlichen Arbeitsablauf und grenzen die Suite von Software anderer Anbieter ab. Außerdem erläutern wir, welche Arten von Apps mit der DPS erstellt werden können. Wenn Sie InDesign oder die Adobe Digital Publishing Suite nicht kennen, lohnt sich für Sie ein Blick in diesen Abschnitt des Buches. Im dritten Kapitel geht es darum, eine digitale Publikation zu konzipieren. Wir gehen auf die Unterschiede im Vergleich zu gedruckten Veröffentlichungen ein: Es geht um Benutzerfreundlichkeit und Typografie auf mobilen Geräten und Displays und um die Grundlagen in der interaktiven Gestaltung. Außerdem gehen wir auf die spezifischen Voreinstellungen von InDesign für Digital Publishing ein. Wenn Sie das erste Mal an einem digitalen Produkt arbeiten, sollten Sie dieses Kapitel lesen. Für alle anderen bietet es einen kompakten Überblick über die wichtigsten Konzepte. In Kapitel 4 beschäftigen wir uns mit dem Gestaltungs- und Produktionsprozess einer digitalen Publikation. Lernen Sie die technischen Formate der Digital Publishing Suite kennen und organisieren Sie Ihre Daten für das Publizieren auf verschiedenen Geräten und Displaygrößen. Erfahren Sie, wie Sie Ihre Inhalte testen und für die Verbreitung vorbereiten. Für Leser, die bereits Erfahrung mit der Digital Publishing Suite gesammelt haben, fassen wir die wichtigsten Punkte zur Verbesserung des Produktionsprozesses zusammen. Wie automatisieren Sie wiederkehrende Inhalte und verkleinern Sie den Speicherverbrauch Ihrer Publikation? Wie Sie Ihre App mit den Werkzeugen in InDesign interaktiv gestalten, erfahren Sie in Kapitel 5. Von Videos über Diashows und Pop-ups bis hin zu Hyperlinks und HTML demonstrieren wir alle Features der Adobe Digital Publishing Suite anhand von Beispielen. Spezialfälle, Kombinationen der Features und wiederkehrende Patterns sind Teil dieses Kapitels. Komplexe Animationen und kleine Apps lassen sich mit Adobe Edge Animate erstellen. Wie Sie die wichtigsten Funktionen des Tools nutzen, beschreibt das sechste Kapitel. Hier erfahren Sie auch, wie Sie die Ausgabedaten von Edge Animate in InDesign integrieren.
Immer dann, wenn die Standardfunktionen der Suite nicht ausreichen, um ein interaktives Feature zu entwickeln, kommt HTML ins Spiel. Wir erklären die Grundlagen von HTML5 und fassen die Richtlinien für die Entwicklung von CSS und JavaScript für Mobilgeräte zusammen. Sie finden diese Informationen in Kapitel 7. Die Kapitel 8 und 9 beschreiben den Veröffentlichungsprozess Ihrer App in den verschiedenen Märkten. Während sich das 8. Kapitel auf den App Store konzentriert, geht es in Kapitel 9 um Android beziehungsweise Google Play und das Amazon Kindle Fire. Erfahren Sie, wie Sie Ihre App an Ihre Anforderungen anpassen, wie Sie Ihre interaktiven Designs über Apple, Google oder Amazon verkaufen können. Lernen Sie den Testprozess einer App kennen und verbinden Sie sie mit Ihrem Abonnement-Server. Wie Sie den Verkaufserfolg Ihrer App verfolgen und verbessern, erfahren Sie in Kapitel 10. Durch kontinuierliche Optimierung am Verkaufspunkt und Analyse der gesammelten Datensätze machen Sie Ihre App zum Erfolg! Übrigens haben wir bei den InDesign-Screenshots nicht die dunkle CC-Variante gewählt, weil wir der Meinung sind, dass die mittelhelle sowie die helle Variante sehr viel besser lesbar sind. Weil die CC-Version während der Arbeit an diesem Buch erst gar nicht und dann in einer Prerelease-Variante verfügbar war, finden Sie gerade bei den Tutorials in Kapitel 5 noch einige CS6-Screenshots. Funktionen und Benennungen unterscheiden sich hierbei nicht. Was erwartet Sie in diesem Buch? 7
Die Adobe Digital Publishing Suite im Überblick 2.1 Darf ich vorstellen? Adobe Digital Publishing Suite 10 2.2 Was ist denn überhaupt möglich? Optionen und Lizenzmodelle 13 2.3 Ein Blick auf den Workflow 16 2.4 Apropos: Hard- und Software, die Ihnen das Leben erleichtert 18
10 2 Die Adobe Digital Publishing Suite im Überblick Sicher haben Sie schon eine grobe Vorstellung darüber, was die Digital Publishing Suite (DPS) ist, allerdings ist das Tool in den letzten Monaten so komplex und umfangreich geworden, dass wir Ihr Wissen ein wenig auffrischen möchten. Deswegen lernen Sie in diesem Kapitel etwas über die folgenden Themen: Unterschied der Adobe Digital Publishing Suite zu anderen Publishing-Tools Vertriebsoptionen der Adobe Digital Publishing Suite Workflow einer DPS-Produktion Versionen der Adobe Digital Publishing Suite Nützliche Tools im Zusammenspiel mit der DPS 2.1 Darf ich vorstellen? Adobe Digital Publishing Suite Innerhalb des gigantischen Bereichs des digitalen Publizierens für mobile Geräte hat sich eine kleine Schar Designer gebildet, die auf das Layout-Werkzeug InDesign setzen. Mit diesem mächtigen und beliebten Layout-Programm werden jetzt auch interaktive und multimediale Layouts für Tablets und Smartphones gebaut, ohne dass Designer Code lesen oder gar schreiben müssen. Zu Anfang standen allen interessierten Gestaltern fünf bis zehn verschiedene Tools zur Verfügung, die genau für diesen Zweck In- Design-Plug-ins anboten. Eines dieser Tools hat sich mittlerweile gewissermaßen zum Marktführer entwickelt: Die Digital Publishing Suite von Adobe fügt sich fast nahtlos in Adobe InDesign ein. Vorteile der Adobe Digital Publishing Suite Was führte eigentlich dazu, dass sich die DPS gegen ihre Konkurrenz durchsetzte? Nun gut, einen großen Einfluss hat natürlich die Tatsache, dass Adobe beide Produkte entwickelt und die Digital Publishing Suite aus diesem Grund besonders gut mit InDesign zusammenarbeitet. Beispielsweise werden für Touch-Aktionen Funktionen verwendet, die InDesign schon seit vielen Versionen mit sich bringt: Schaltflächen und Objekte mit mehreren Status (Multi State Objects). Natürlich ist die Digital Publishing Suite kein PDF-Anzeigegerät, das bestehende Print-PDFs mit Multimedia oder interaktiven Funk-
Darf ich vorstellen? Adobe Digital Publishing Suite 11 tionen anreichert. So entstehen mit der Adobe Digital Publishing Suite meist speziell angepasste Layouts, die eine viel höhere Benutzerfreundlichkeit auf Tablets und Smartphones haben als verkleinerte Print-PDFs. Ein anderer Vorteil der Adobe Digital Publishing Suite liegt in der App selbst, die nach der Veröffentlichung die Publikationen ausliest. Die App ist im Grunde nicht besonders schwer zu erstellen, sieht gut aus und kann je nach Lizenzmodell mehr oder weniger stark individualisiert werden. Sie müssen sich also nicht darum kümmern, selbst eine native ios- oder Android-App zu entwickeln, sondern können den Adobe App Builder nutzen, um die native App zu konfigurieren. Da die Adobe-App auch In-App-Käufe verwendet und Adobe für deren Weiterentwicklung und Kompatibilität mit ios, dem ios-newsstand, Android und gegebenenfalls weiteren Betriebssystemen sorgt, können Sie sich voll und ganz auf Ihr Magazin konzentrieren. Abbildung 2.1 Eine Adobe-DPS-App in der standardmäßigen Kiosk-Ansicht. Hier können Leser Abos und Magazine kaufen, herunterladen, ansehen und archivieren. Eine weitere Stärke liegt ganz klar in der großen Auswahl interaktiver und multimedialer Funktionen. Neben Videos und einer besonderen Audiofunktion können Pop-ups, Hotspots, Panoramen, Bildsequenzen und vieles mehr eingebaut werden. Nicht zuletzt muss der Hersteller an sich genannt werden. Als Kunde von Adobe kann man sicher sein, dass die Digital Publishing Suite nicht nur gewartet, sondern stetig weiterentwickelt wird.
12 2 Die Adobe Digital Publishing Suite im Überblick Setzt man auf weniger große Hersteller oder sogar auf Individualentwicklungen, muss man immer dann mit großem Aufwand oder Investitionen rechnen, wenn sich an Betriebssystemen oder Geräten selbst etwas ändert. Übrigens eignet sich die Adobe Digital Publishing Suite ebenfalls wunderbar für Präsentationen jeglicher Art. Diese haben den Vorteil, dass Designer InDesign für Präsentationen verwenden können und die Präsentationen mit dem Tablet gehalten werden können. Natürlich kann man hierfür sämtliche multimedialen und interaktiven Funktionen der DPS nutzen. Wer für seine Präsentationen, Prototypen oder Portfolios keine eigene App erstellen möchte oder kann, verwendet hierzu eine kostenlose App von Adobe, den Adobe Content Viewer, den Sie im Laufe des Buches noch genauer kennenlernen werden. Content Delivery Network (CDN) Ein Content Delivery Network meint einen Verbund von Servern, der dazu benutzt wird, Medieninhalte über das Internet zu verteilen. Um dies möglichst schnell und mit wenig Bandbreite zu tun, besteht ein CDN aus einem Ursprungsserver, der bei User-Anfragen Inhalte auf die sogenannten Replica-Server verteilt. Der Endkunde bezieht seinen angefragten Inhalt dann von einem geeigneten Replica-Server. Bekannte CDN sind unter anderem Akamai und die Amazon Web Services. Nachteile der Adobe Digital Publishing Suite Klingt bisher ganz gut, oder? Natürlich ist nicht alles perfekt an der Software. Allerdings hakt es dank stetiger Weiterentwicklung seitens Adobe eigentlich nur an einer Stelle: den Servern. Sämtliche Folios so heißt das Datei- oder genauer Paketformat, mit dem die Digital Publishing Suite arbeitet werden auf einem Adobe-Cloud-Server gespeichert. Um die Folios dann in die eigene App zu veröffentlichen, müssen sie wiederum auf andere Adobe-Cloud-Server geschoben werden. Beide Content-Delivery-Netzwerke (CDN) sind zumindest zurzeit noch nicht ausreichend schnell und zuverlässig, wobei das Distributions-CDN deutlich schneller als das Developer-CDN ist. Wir vermuten jedoch, dass sich auch dieses Problem mit der Zeit bessern beziehungsweise verschwinden wird. Ein völlig automatisierter und leichter Workflow wird allein mit der Adobe Digital Publishing Suite jedoch nicht so schnell realisierbar. Die DPS ist ein umfangreiches Tool vom InDesign-Plug-in über Cloud-Distributionsserver bis hin zu den Analytics und erfordert somit einen komplexen Workflow, der sich höchstens mit guten Redaktionssystemen oder umfangreichen Skripten vereinfachen beziehungsweise automatisieren lässt. Ebenfalls ein Nachteil ist das.folio-paketformat, das den Magazininhalt einer Ausgabe beinhaltet. Dieses Format ist kein offener Standard, was eine Migration von der DPS auf ein anderes System schwierig machen würde. Die fehlende Barrierefreiheit haben wir schon zuvor erwähnt. Auch sie ist ein offensichtlicher Nachteil der Digital Publishing Suite.
Was ist denn überhaupt möglich? Optionen und Lizenzmodelle 13 Kommen wir zum eigentlichen Nachteil der Adobe Digital Publishing Suite, dem Preis. Je nach Lizenzmodell ist dieser gerne sehr hoch vor allem in Relation zu dem jungen Markt. In Abschnitt 2.2 oder auf der Webseite von Adobe 1 erfahren Sie mehr zu den Lizenzmodellen der Digital Publishing Suite. 2.2 Was ist denn überhaupt möglich? Optionen und Lizenzmodelle Wer Publikationen mit der Digital Publishing Suite veröffentlichen und verkaufen möchte, hat im ersten Schritt die Wahl zwischen zwei verschiedenen App-Versionen: einer Single-Folio-App und einer Multi-Folio-App, auch Kiosk-App genannt. Die Single-Folio-App enthält genau eine Publikation, also beispielsweise eine Ausgabe eines Magazins. Möchte man nun mehrere Ausgaben eines Magazins in einer App haben, so greift man zu einer Multi-Folio-App, die in einer Kiosk-Ansicht mehrere Ausgaben, also mehrere Folios enthält. Des Weiteren kann man mit der Digital Publishing Suite zurzeit auf die beiden Betriebssysteme ios von Apple und Android von Google publizieren. Während Sie mit ios-apps das ipad, das iphone ab Version 3GS und den ipod Touch ab der vierten Generation ansteuern können, funktionieren beim Android-Betriebssystem nur Publikationen für Tablets. Eine Unterstützung für Android-Smartphones wurde für das Jahr 2013 angekündigt. Zu guter Letzt ist es außerdem möglich, Apps für das Kindle Fire von Amazon zu veröffentlichen. Auf diesen Tablets läuft zwar eine Android-Version, jedoch werden Apps für das Kindle Fire über den Amazon App-Shop vertrieben, der ebenfalls für die Adobe Digital Publishing Suite verfügbar ist. Ob und wann Adobe Windows 8 Mobile von Microsoft unterstützen wird, ist derzeit noch nicht sicher. Adobe bietet zurzeit drei verschiedene Lizenzmodelle an, die sich hinsichtlich der App-Features und der Download-Volumen unterscheiden: 1 http://bit.ly/dpslizenzen
14 2 Die Adobe Digital Publishing Suite im Überblick Single Edition Mit einer Single-Edition-Lizenz erwerben Sie das Recht, beliebig viele Single-Folio-Apps für das ipad zu produzieren. Die Single Edition ist für alle, die ein Creative-Cloud-Abo besitzen, kostenlos. Wer kein Creative-Cloud-Abo besitzt, zahlt einmalig 296. Weitere Kosten kommen in diesem Fall nicht dazu, egal wie oft die App aus dem Store heruntergeladen wurde, da die Daten komplett bei Apple und nicht bei Adobe liegen. Professional Edition Wer die Professional Edition besitzt, kann beliebig viele Single- und Multi-Folio-Apps veröffentlichen. Somit können auch Abos angeboten werden, was wiederum die Bedingung ist, um für Apples Zeitungskiosk (englisch Newsstand) zu veröffentlichen. Kurzum bietet die Adobe Professional Edition eigentlich alles, was man für ein Magazin benötigt: Unbegrenzte Zahl an Single-Folio-Apps und Multi-Folio-Apps Abo-Funktion für ios-zeitungskiosk ios-smartphone und -Tablet, Amazon Kindle Fire, Android- Tablets Hintergrund-Download für Multi-Folio-Apps DPS-Analyse-Tool Social Sharing über Facebook, Twitter und E-Mail Web-Viewer mit Bezahlschranke Die Professional Edition erwirbt man entweder im monatlichen Abo oder direkt für ein ganzes Jahr. Das Monatsabonnement kostet 355, wobei bei Kiosk-Apps auch der Download jeder einzelnen Ausgabe mit circa 0,20 berechnet wird. Dies liegt daran, dass bei Multi-Folio-Apps sämtliche Ausgaben nicht bei Apple oder Google gehostet werden, sondern bei Adobe. Beachten Sie außerdem, dass Ihre Ausgaben nur so lange für Leser verfügbar sind, wie Sie die Digital Publishing Suite lizenziert haben. Ist Ihre Lizenz abgelaufen, stellt Adobe den Dienst auch nicht mehr zur Verfügung. Enterprise Edition Die Enterprise Edition enthält sämtliche Funktionen der Professional Edition, was bedeutet, dass alle verfügbaren Stores sowohl mit Single-Folio-Apps als auch mit Multi-Folio-Apps angesteuert werden können. Zusätzlich bietet die Enterprise Edi-
Was ist denn überhaupt möglich?optionen und Lizenzmodelle 15 tion Funktionen, die großen Verlagshäusern und Konzernen besonders wichtig sind: Firmeninterne Veröffentlichung, die nicht über die öffentlichen App-Stores läuft Eingeschränkte Veröffentlichung für spezielle Nutzergruppen Möglichkeit, einen eigenen Abonnement-Server zu verwenden, um Marken-Abonnements oder Promocodes anzubieten Individualisierter Store (HTML Custom Storefront) Individualisiertes Archiv (HTML Custom Library) Eigene Push-Server und eigene Push-Nachrichten Anpassen der App mit eigenen Symbolen Die Kosten für die Enterprise Edition können bei Adobe oder den Resellern angefragt werden. Allerdings ist klar, dass sie um einiges teurer ist als die Professional Edition, wobei Downloads aus Multi- Folio-Apps viel günstiger werden, da Enterprise-Kunden größere Kontingente auf einmal kaufen. Adobe Digital Publishing Suite kostenlos nutzen Was viele nicht wissen, ist, dass man die Adobe Digital Publishing Suite zu einem Großteil nutzen kann, ohne dafür zu zahlen. Wer InDesign ab Version 5 besitzt, kann sich die DPS-Plug-ins herunterladen und installieren. Gemeinsam mit einer Adobe-ID, die Sie im Digital- Publishing-Portal 2 anlegen und freischalten können, sowie der kostenlosen App Adobe Content Viewer für ios 3 und Android 4 können Sie so viele Präsentationen oder Magazin-Demos erstellen, wie Sie möchten. Nur wer eine eigene App erstellen oder seine Werke in den Stores vertreiben möchte, muss für die Digital Publishing Suite zahlen. Es ist klar, dass die Lizenzmodelle der Digital Publishing Suite nicht in Stein gemeißelt sind. Wer sich genauer informieren oder die aktuellsten Informationen rund um die Preismodelle aufrufen möchte, sieht am besten auf der Webseite von Adobe 5 nach. Abbildung 2.2 bietet eine Entscheidungshilfe, um die richtige Lizenz zu finden. 2 http://digitalpublishing.acrobat.com 3 http://bit.ly/contentviewerios 4 http://bit.ly/contentviewerandroid 5 http://bit.ly/dpslizenzen
16 2 Die Adobe Digital Publishing Suite im Überblick Ich möchte eine regelmäßig erscheinende Publikation in einer App veröffentlichen. Ja! Nein! Ich möchte einen Abo-Server nutzen oder meine Publikation intern kostenlos vertreiben. Ich möchte meine App über den App Store vertreiben. Ja! Nein! Ja! Nein! Ich möchte meine App auch für Android-Tablets oder das Kindle Fire veröffentlichen Ja! Nein! Enterprise Edition Professional Edition Single Edition Kostenlos nutzen Abbildung 2.2 Entscheiden Sie sich! Sie haben die Wahl zwischen drei Lizenzmodellen oder der kostenlosen Nutzung der Adobe Digital Publishing Suite. 2.3 Ein Blick auf den Workflow Die einzelnen Aufgaben, die Sie bewältigen müssen, um eine Publikation aufs Tablet oder Smartphone zu bringen, sind nicht wirklich kompliziert. Allerdings müssen Sie ziemlich viele kleine Schritte durchlaufen, bis eine Publikation im Store erscheint. Damit der Ablauf deutlich wird und Sie weder beim Arbeiten noch beim Lesen den roten Faden verlieren, geben wir hier einen Überblick über den gesamten Workflow. Grundlegend müssen Sie zwei große Aufgaben bewältigen, die sich voneinander deutlich trennen lassen. Einerseits benötigen Sie eine Publikation, also den Inhalt beziehungsweise die Layouts Ihrer App. Andererseits brauchen Sie auch eine App, also eine Art Behälter, der Ihre Inhalte auf dem Tablet oder dem Smartphone darstellt. Adobe nennt die App»Viewer«. Beide Prozesse hängen an bestimmten Stellen voneinander ab und wiederholen sich in regelmäßigen
Ein Blick auf den Workflow 17 Abständen allerdings nicht immer zur gleichen Zeit. Generell ist es egal, in welcher Reihenfolge Sie die beiden Prozesse bearbeiten. Vermutlich werden Sie an beiden parallel arbeiten oder die Aufgaben sogar von verschiedenen Personen durchführen lassen. Die App produzieren In regelmäßigen Abständen müssen Sie neue Viewer, also Apps, erstellen, denn die Adobe Digital Publishing Suite erhält alle sechs bis acht Wochen eine neue Version mit neuen Features oder Bugfixes. 6 Sofern Sie diese Features nutzen möchten, benötigen Sie eine neue App-Version, was dazu führt, dass Sie Teile des App-Erstellungsworkflows nicht nur ein einziges Mal, sondern öfter durchlaufen werden; zumindest dann, wenn Sie eine regelmäßige Publikation planen. 1. Bevor Sie mit der App-Produktion beginnen, tragen Sie sämtliche Grafiken, Zugangsdaten und Zertifikate zusammen, die Sie für den Erstellungsprozess benötigen. 2. Im Anschluss erstellen Sie die App mit dem DPS-App-Builder und füllen sie danach mit zuvor produzierten Layouts. 3. Sie werden schnell lernen, dass das Testing und Bugfixing bei der Arbeit mit der Digital Publishing Suite zu einer zeitfressenden Aufgabe wird. Testen Sie nach der Erstellung der App sämtliche ihrer Funktionen, bevor Sie diese in die Stores stellen beziehungsweise bei den Stores einreichen. 4. Der letzte Schritt ist selbstverständlich das Beste an der Arbeit: Veröffentlichen Sie Ihre App und warten Sie auf die ersten Käufe und Bewertungen. Inhalt App produzieren Grafiken Konzept vorbereiten erstellen Zertifikate Templates erstellen Layouts App erstellen App Layouts mit Inhalt lokal testen füllen Metadaten App testen erstellen Inhalte in Folio-Producer- App einreichen Organizer laden Ausgabe herunterladen App veröffentlichen und testen Konkret und detailliert wird dieser Prozess später im Buch beschrieben. In Kapitel 8 lernen Sie die App-Erstellung für ios kennen, Kapitel 9 beschreibt die App-Erstellung für Android und das Amazon Kindle Fire. Inhalt produzieren Ohne Inhalte wäre Ihre App selbstverständlich wertlos. Inhalte erstellen Sie entweder einmalig oder in regel- Ausgabe auf Distributionsserver laden Abbildung 2.3 Der Workflow einer App-Erstellung mit der Digital Publishing Suite 6 Auf der offiziellen Webseite (http://digitalpublishing.acrobat.com) und der DPS-Status-Webseite (http://status.adobedps.com) finden Sie immer Informationen über die aktuellen DPS-Versionen.