Bildgalerien f�r Tablets erstellen

Eine der Stärken von digitalen Magazinen auf Tablets ist das Betrachten von Fotos. Will man diese innerhalb eines Rahmens nacheinander abspielen, so spricht man von einer Diashow. Mit Schaltflächen können Bilder vielseitig abgespielt werden.

Andreas Burkard Das Tablet hat seinen Platz zwischen den Smartphones und dem Web gefunden. In der Adobe Creative Suite CS5.5 ist die Digital Publishing Suite (DPS) Bestandteil. Die DPS-Bestandteile können für CS5 kostenlos heruntergeladen werden. Die DPS besteht in InDesign CS5.5 im Wesentlichen aus den beiden neuen Bedienfeldern Folio Builder und Overlay Creator. Im Folio Builder werden InDesign-Dokumente hochgeladen, im Overlay Creator werden Interaktionen hinzugefügt. Sind die Dokumente hochgeladen, kommt man in Kontakt mit den ausgeklügelten Adobe-Services und den dynamischen Preismodellen der DPS.

Dokument für Tablet-Publishing

Der Start für Tablet-Publishing ist ein neues Dokument mit Web als Zielmedium und einer Grösse von in der Regel 1024 × 768 Pixeln. Benutzer können Tablets drehen und so Inhalte im Querformat oder im Hochformat anzeigen. Dies sollten Sie bei Designentscheidungen berücksichtigen und dazu ein zusätzliches InDesign-Dokument mit 768 × 1024 Pixeln erstellen. In InDesign können Sie das Dokument in gewohnter Manier aufbauen. Um strukturiert zu layouten, helfen auch im neuen Medienkanal Stege, Spalten, Gestaltungsraster, Ebenen, Formate und Mustervorlagen (Abbildung 1).

Vorbereitung Bildgalerie

Bilder mit einer Auflösung von 72 ppi reichen für das Tablet Publishing (bis iPad 2). Die Bildmasse sind in Pixeln gehalten und die Bildformate unterscheiden sich nicht von gewöhnlichen Formaten in Layoutprozessen. Diashow-Bilder werden später beim Hochladen im Folio in PNG-Bilder konvertiert.

Bilder, welche für eine Bildgalerie infrage kommen, können zuerst mit dem Freistellwerkzeug in Photoshop auf die richtige Zielgrösse beschnitten werden. So spart man sich den Aufwand, sie später in InDesign mit Anpassungsoptionen und Skalierungsvorgängen auszurichten.

Platzieren als Kontaktabzug

Bilder können Sie in Zeilen und Spalten platzieren. Dazu braucht es ein bisschen Fingerakrobatik. Der Weg führt erst wie gewohnt über Menü Datei > Platzieren. Im Fenster Platzieren werden die gewünschten Bilder ausgewählt. Mit Öffnen wird das Bildplatzierungssymbol im Dokument ersichtlich. Damit zieht man einen Rahmen auf, man lässt aber die gedrückte Maustaste noch nicht los. Nun kann man mit der anderen Hand über die Pfeiltaste nach rechts die ausgewählten Bilder in Spalten unterteilen. Mit der Pfeiltaste nach oben werden die Bilder in Zeilen eingefügt. Die anderen Pfeiltasten machen genau das Gegenteil. Drückt man im Platzierungsvorgang die Pfeiltaste nach links beziehungsweise nach unten, so werden die Spalten und die Zeilen entnommen. Ist man mit dem Raster zufrieden, lässt man die Maustaste los. Die Bilder befinden sich dann als so genannter Kontaktabzug im Dokument und sind an den Rahmen proportional angepasst (Abbildung 2).

Bilder ausrichten

Die Bilder müssen exakt übereinandergelegt werden. Das geht mit den Ausrichten-Optionen ganz einfach. Achten Sie einfach darauf, dass die Bilder nach wie vor ausgewählt sind und klicken Sie entweder in der Steuerung oder im Bedienfeld Ausrichten auf die Optionen horizontal und vertikal ausrichten.

Im ausgewählten Zustand kann die gesamte Bildauswahl noch skaliert werden. Drücken Sie dazu CMD-Shifttaste auf dem Mac, beziehungsweise Ctrl-Shifttaste unter Windows und ziehen Sie an einer Ecke der Bildauswahl nach innen oder nach aussen.

In diesem Beispiel wurde im Dokument für jedes Fahrzeug ein entsprechender Text als unabhängiger Textrahmen eingegeben. Ferner befinden sich unterhalb der Bilder zwei Dreiecke, eines zeigt nach links, das andere nach rechts. Über diese beiden Symbole können später die Bilder der Reihe nach auf dem Tablet betrachtet werden.

Bilder zu Objektstatus

Unterebenen helfen, Bilder nochmals auszuwählen. Öffnen Sie dazu die Hauptebene, auf der die Bilder platziert sind, und wählen Sie die Bilder mit der Shifttaste über das Auswahlsymbol auf der rechten Seite der Unterebenenbezeichnung aus (Abbildung 3).

Das Bedienfeld Objektstatus befindet sich im Menü Fenster > Interaktiv. Die ausgewählten Bilder lassen sich nun mit einem Klick in einen Objektstatus verwandeln. Das entsprechende Symbol befindet sich unten im Bedienfeld. In diesem Beispiel wurde der Objektstatus mit Cubacars benannt (Abbildung 4).

Ein Objektstatus fasst die Bilder zusammen. Gut zu erkennen ist ein Objektstatus jeweils am markant gestrichelten Rahmen und am Objektstatussymbol in der unteren rechten Ecke. Beachten Sie, dass nun jedes Bild im Bedienfeld Objektstatus einen eigenen Statusnamen erhalten hat. Der Status­name ist nun auch in den Unter­ebenen aufgeführt und fasst die Bilder zusammen.

Schaltflächenaktionen

Eine Stärke der interaktiven Möglichkeiten in InDesign ist, dass ein beliebiges Objekt in eine Schaltfläche umgewandelt werden kann. Die in diesem Beispiel verwendeten Schaltflächenaktionen sind kompatibel mit den Flash verweigernden iPads.

Der nach links zeigende Pfeil wurde ausgewählt und in eine Schaltfläche umgewandelt. Dazu steht im Menü Objekt > Interaktiv > In Schaltfläche umwandeln zur Auswahl. Alternativ führt das Bedienfeld Schaltflächen unten ein entsprechendes Symbol auf.

Danach wird die Aktion Gehe zu vorherigem Status ausgewählt. Das Erscheinungsbild kann mit den Zuständen Cursor darüber und Klicken verfeinert werden (Abbildung 5).

Auch der nach rechts zeigende Pfeil wird in eine Schaltfläche umgewandelt und mit der Aktion Gehe zu nächstem Status belegt.

Die Texte mit Autobezeichnungen haben die Aufgabe, das entsprechende Bild einzublenden (Abbildung 6). Hier muss man pro Textrahmen (1) die Aktion Gehe zu Status (2) einfügen. Danach den richtigen Namen des Objektstatus überprüfen und dort jeweils einen anderen Status auswählen (3). Das Verknüpfen der Texte mit der Aktion und dem richtigen Status wird zur Fleissarbeit.

Das Drehen des Tablets

Um ein Drehen des Tablets zu berücksichtigen, müssen Dokumente auch im jeweils anderen Format aufgebaut werden. Was nach viel Aufwand tönt, ist in der Praxis weniger schlimm. Man ändert einfach das Format mit dem neuen Seitenwerkzeug oder im Menü Datei > Dokumenteinrichten auf Hochformat. Danach richtet man die Objekte neu aus und speichert das Hochformat unter einer neuen Bezeichnung (Abbildung 7).

In einem strukturierten Ablauf wird zu Beginn des Projekts ein Hoch- und ein Querformat erstellt und korrekt mit Mustervorlagen aufgebaut. Danach werden diese Dokumente je als eine InDesign-Vorlage gespeichert.

Ist das Querformat fertig gestaltet und verfügt dieses über die entsprechenden Interaktionen, so werden sämtliche Inhalte kopiert. Im Dokument des Hochformates werden die Inhalte ganz einfach eingefügt. Die Objekte müssen teils unter neuen gestalterischen Kriterien ausgerichtet werden, doch die Interaktionen bleiben dabei alle erhalten. So gesehen ist der Aufwand überschaubar.

Die Diashow testen

Mit der DPS sind in InDesign im Menü Fenster > Erweiterungen der Folio Builder und der Overlay Creator zu finden.

Ist im Layout der Objektstatus ausgewählt, zeigt das Bedienfeld Overlay Creator eine Diashow an (Abbildung 8). Hier stehen erweiterte Einstellungen zur Verfügung wie beispielsweise ein automatisches Abspielen beim Öffnen der Seite. Die Option Zum Abspielen/Anhalten tippen bewirkt, dass der Benutzer eine automatisch abgespielte Diashow durch Tippen abspielen und anhalten kann. Durch Doppeltippen würde die Diashow zurückgesetzt. Ausserdem stehen Überblendungsmöglichkeiten zur Verfügung.

Die Seite des digitalen Magazins kann aus dem Bedienfeld Overlay Creator in der Vorschau betrachtet werden. Dazu wird die Datei temporär gerendert und im Adobe Content Viewer, der Bestandteil der Creative Suite ist, geöffnet (Abbildung 9).

Folio erstellen, Artikel hochladen

Die beste Kontrolle bietet aber das Tablet selbst. Dazu müssen Sie sich im Bedienfeld Folio Builder zuerst mit der Adobe ID anmelden. Nach der Anmeldung können Sie in den Optionen von Folio Builder ein neues Folio erstellen (Abbildung 10). Das Folio ist gewissermassen der Magazinname oder die Ausgabe.

Nachdem das Folio erstellt wurde, können nun die Artikel hochgeladen werden. Dazu muss erst das InDesign-Dokument im Querformat offen sein. Danach wählt man in den Optionen von Folio Builder > Neuer Artikel aus. Hier wird der Artikelname eingetragen (Abbildung 11). Nun klickt man auf Hinzufügen, sodass das Querformat in die DPS hochgeladen wird.

So wird im Folio Builder automatisch ein Eintrag mit der Bezeichnung Querformatlayout angezeigt. Im gleichen Verzeichnis wird danach das hochformatige InDesign-Dokument hochgeladen (Abbildung 12).

Betrachten als App

Um das digitale Magazin auf dem Tablet betrachten zu können, müssen Sie auf dem Tablet im App-Store den kostenlosen Adobe Content Viewer (auch Adobe Viewer genannt) herunterladen und installieren (Abbildung 13).

Die Anmeldung in der App Adobe Content Viewer erfolgt mit derselben Adobe ID wie im Folio Builder. Danach wird mitgeteilt, dass das Magazin verfügbar ist. Sie können es aus der DPS auf ihr Tablet laden (Abbildung 14).

So lässt sich die Seite des Magazins nun testen. Man kann mit Gesten den Display betätigen, die Pfeile prüfen, die Texte antippen, um zu sehen, wie die Bilder in Erscheinung treten. Beim Drehen des Tablets wird automatisch das Hochformat angezeigt.

Unter digitalpublishing.acrobat.com kann man hochgeladene Magazine mit den Folio-Producer-Tools verwalten, auch hier mit der gleichen Adobe ID.

Wer nun denkt, mit einem «Päckli» CS5 oder 5.5 sei auch gleich noch die Veröffentlichung einer eigenständigen App mit dabei, der irrt. Um letztlich eine App zu veröffentlichen, werden teils schwer durchschaubare Kosten seitens Adobe und Apple fällig.

Die Adobe Digital Publishing Suite ist eine Hosting-Plattform, welche momentan in drei Editionen (Single, Professional und Enterprise) erhältlich ist. Aktuelle Informationen dazu erhalten Sie auf der Website von Adobe (Suchfeld > Digital Publishing Suite und unter developer.apple.com).