Bij het doorlopen van dit lesbestand werkt u met de map CityGuide_Folio in de map TutorialAssets. U maakt rechtstreeks in InDesign interactieve objecten. Aan het einde van deze les zou de eerste pagina van het hoofdartikel er als volgt moeten uitzien op de iPad.

Voltooid folio weergegeven op de iPad

A. Liggende (horizontale) weergave B. Staande (verticale) weergave C. Hyperlinks D. Video-overlays 

Als u dit nog niet hebt gedaan, downloadt u de aanvullende lesbestanden. Zie Zelfstudie voor installatie.

Artikelen importeren

In de vorige les hebt u een artikel gemaakt door het brondocument te openen en Artikel toevoegen te kiezen. Een andere methode is het importeren van artikelen. Als u de juiste mapstructuur en naamgevingsconventies gebruikt, kunt u een of meer artikelen importeren.

Wijs een artikelmap aan wanneer u een artikel wilt importeren. Wijs de foliomap aan als u meerdere artikelen wilt importeren.

  1. Voordat u artikelen importeert, opent u de InDesign-brondocumenten in de map TutorialAssets > CityGuide_Folio om te controleren of alle koppelingen zijn bijgewerkt en de bestanden zijn opgeslagen.

  2. Navigeer naar de artikelweergave en kies de optie Import Article (Artikel importeren) in het menu van het deelvenster Folio Builder.

  3. Selecteer Import Multiple Articles (Meerdere artikelen importeren).

  4. Klik op het pictogram van de map Locatie en navigeer naar TutorialAssets > CityGuide_Folio. Klik op Openen.

    Selecteer de map CityGuide_Folio en niet een submap.

  5. Klik op OK om de artikelen in de map CityGuide_Folio te importeren en te uploaden naar de server.

  6. Sleep het artikel WiFi Ad naar het einde van de lijst.

    Het deelvenster Folio Builder na het importeren van artikelen

Folio-eigenschappen wijzigen

  1. Klik in het deelvenster Folio Builder op het pijlpictogram om terug te keren naar de folioweergave. Selecteer het folio City Guide en kies Eigenschappen folio in het deelvenster Folio Builder.

  2. Typ City Guide Monthly als publicatienaam.

    De publicatienaam komt niet overeen met de folionaam. De publicatienaam wordt weergegeven in de viewer. De folionaam wordt gebruikt voor interne doeleinden, zoals koppelingen en het instellen van uitvoeringen.

  3. Als u dit nog niet hebt gedaan, geeft u Cover_v.jpg bij Verticaal en Cover_h.jpg bij Horizontaal op. Klik vervolgens op OK. Deze omslagafbeeldingen worden weergegeven in de map CityGuide_Folio.

    De voorvertoning van omslag wordt weergegeven in de viewerbibliotheek. Voor het publiceren van de app zijn voorvertoningen van omslagen vereist.

    Dialoogvenster Eigenschappen van folio

Een interactieve hyperlink toevoegen

Nu gaat u de Enjoy-documenten bewerken om interactieve objecten toe te voegen.

InDesign heeft veel interactieve functies. Slechts een aantal van deze functies werkt echter met de gereedschappen voor digitale publicatie. Behalve de ondersteunde interne functies heeft het deelvenster Overlay Creator interactieve overlays die alleen werken met de gereedschappen voor digitale publicatie.

Maak eerst een hyperlinkobject voor het 'D. I. Y. Meet'-logo.

  1. Navigeer in het deelvenster Folio Builder naar de lay-outweergave van het Enjoy_Article en dubbelklik op Staande lay-out om Enjoy_v.indd te openen.

  2. Selecteer het gereedschap Rechthoek op de werkbalk en sleep vervolgens een rechthoek over het 'D.I.Y. Meet'-logo op de eerste pagina. Controleer of de rechthoek geen streek of vulling heeft.

  3. Open het deelvenster Hyperlinks (kies Venster > Interactief > Hyperlinks) en kies vervolgens Nieuwe hyperlink in het deelvenstermenu.

  4. Selecteer URL in het menu Koppelen naar en typ een URL in het URL-veld (wij hebben http://www.bikeworks.org/ gebruikt). Schakel het selectievakje Gedeelde hyperlinkbestemming uit. Laat onder Appearance de selectievakjes Invisible Rectangle en None ingeschakeld. Klik op OK.

    Een hyperlink toepassen op een rechthoekig frame
  5. Dubbelklik in het deelvenster Folio Builder op Liggende lay-out om het document Enjoy_h.indd te openen. Kopieer en plak het hyperlinkobject van het bestand Enjoy_v.indd naar het bestand Enjoy_h.indd. Plaats het object over het 'D.I.Y. Meet'-logo.

  6. Als u snel een voorvertoning van het document wilt weergeven, slaat u het document op en kiest u Bestand > Voorvertoning van folio. Klik op de hyperlink. Sluit Adobe Content Viewer vervolgens af.

Hyperlinks worden standaard geopend in een in-app-viewer en niet in de browser voor mobiele apparatuur. U kunt het deelvenster Overlay Creator gebruiken om de instellingen zodanig te wijzigen dat websites worden geopend in Mobile Safari. Hierna komt u meer te weten over het deelvenster Overlay Creator.

Een filmoverlay maken

Films die u toevoegt aan een InDesign-document, worden interactief wanneer u de bestanden samenvoegt tot een pakket. U voegt de video toe en gebruikt vervolgens het deelvenster Overlay Creator om de instellingen te wijzigen. We voegen een film over fietsen toe.

  1. Kies in het bestand Enjoy_h.indd het volgende: Bestand > Plaatsen, blader naar de map CityGuide_Folio > Enjoy_Article > Links en dubbelklik op cycling_432x234.mpg. Plaats het filmbestand in de rechterbovenhoek.

    De ontwerpers hebben een videoafbeelding met een filmpictogram gemaakt om aan te geven dat het object interactief is. Vervolgens gebruikt u die afbeelding als poster.

  2. Selecteer in het deelvenster Media (Venster > Interactief > Media) de optie Choose Image in het pop-upmenu Poster. Dubbelklik op cyclist.jpg in de map CityGuide_Folio > Enjoy_Article > Links.

    De nieuwe posterafbeelding wordt weergegeven. Laten we nu het deelvenster Overlay Creator gebruiken om te bepalen hoe de film wordt afgespeeld.

  3. Kies Venster > Uitbreiding > Overlay Creator om het deelvenster Overlay Creator te openen.

  4. Terwijl het filmobject nog is geselecteerd, selecteert u Controller tonen bij tikken in het deelvenster Overlay Creator.

    Filminstellingen bewerken met de Overlay Creator
  5. Kopieer de afbeelding met het selectiegereedschap, schakel over naar Enjoy_v.indd en plak de afbeelding. Verplaats deze naar het lege gebied op de eerste pagina en lijn deze uit op de omringende objecten.

  6. Als u een voorvertoning van de film wilt weergeven, slaat u het document op en kiest u Bestand > Voorvertoning van folio. Klik op de film om deze af te spelen. Sluit de Adobe Content Viewer vervolgens af.

Een presentatieoverlay maken

Laten we nu een interactieve diavoorstelling maken met het deelvenster Objectstatussen. We hebben de afbeeldingen al toegevoegd aan de tweede pagina van het verticale Enjoy-bestand. U rangschikt deze in een stapel, zet ze om naar een object met meerdere statussen en maakt knoppen waarmee u door de dia's kunt navigeren.

  1. Open Enjoy_v.indd in InDesign en ga naar pagina 2.

  2. Selecteer de zeven afbeeldingen tussen de rode pijlen en klik vervolgens op de knop Align Horizontal Centers en Align Vertical Centers in het configuratiescherm. Centreer de afbeeldingen tussen de pijlen.

  3. Terwijl de afbeeldingen nog zijn geselecteerd, kiest u Venster > Interactief > Objectstatussen om het deelvenster Objectstatussen weer te geven. Klik op de knop Convert Selection To Multi-State Object.

    Afbeeldingen samengevoegd tot object met meerdere statussen

    Elke afbeelding wordt weergegeven als een afzonderlijke status in het deelvenster Objectstatussen.

  4. Wijzig de objectnaam in Zeeslakken in het deelvenster Objectstatussen.

    Wanneer uw objecten met meerdere statussen in het horizontale en verticale document dezelfde objectnaam hebben, wordt de status onthouden wanneer u de iPad draait. Nu u het object met meerdere statussen hebt gemaakt, moet u gebruikers de mogelijkheid bieden om hier doorheen te bladeren.

  5. Kies Venster > Interactief > Knoppen om het deelvenster Knoppen weer te geven en selecteer vervolgens de rode pijl aan de linkerkant.

  6. Klik op Object omzetten naar knop en kies vervolgens Ga naar vorige status via het pluspictogram naast Actions.

    Navigatieknoppen maken

    Laten we nu de weergave van de knop licht wijzigen wanneer de gebruiker hierop tikt.

  7. Klik op [Klikken] in het deelvenster Knoppen en klik vervolgens op het pictogram Slagschaduw in het configuratiescherm.

  8. Selecteer de rode pijl aan de rechterkant, zet deze om in een knop en pas de actie Go To Next State toe. Stel de weergave voor [Klikken] in op een slagschaduw.

    Met de knoppen kunnen gebruikers tikken om van afbeelding naar afbeelding te gaan. Laten we ze de mogelijkheid bieden om met veeggebaren door dia's te bladeren.

  9. Selecteer het object met meerdere statussen. Selecteer in het deelvenster Overlay Creator de optie Veeggebaar om status te wijzigen.

    Veeggebaren inschakelen voor de diavoorstelling
  10. Kopieer en plak de pijlen en het object met meerdere statussen van het bestand Enjoy_v.indd naar pagina 2 van het bestand Enjoy_h.indd. Plaats de pijlen onder het object met meerdere statussen zodat het beter past.

  11. Als u een voorvertoning van de diavoorstelling wilt weergeven, slaat u het document op en kiest u Bestand > Voorvertoning van folio. Klik op de navigatieknoppen om door de dia's te bladeren. Sluit Adobe Content Viewer vervolgens af.

Een panoramaoverlay maken

Voor panorama's zijn zes afbeeldingen vereist, waarbij elke afbeelding staat voor een zijde van een kubus.

  1. Open Enjoy_v.indd en ga naar pagina 3.

  2. Selecteer het gereedschap Rechthoekkader in de gereedschapsset en sleep om een rechthoek van de gewenste grootte te maken.

  3. Selecteer Panorama in het deelvenster Overlay Creator.

  4. Klik op de bronmap en selecteer de map CourtyardPano in de map CityGuide_Folio > Enjoy_Article > Links. Klik op Openen.

    De voorbeeldrechthoek heeft de vorm aangenomen van de panorama-afbeeldingen, maar we willen dat het klikgebied kleiner is.

  5. Houd Ctrl+Shift (Windows) of Command+Shift (Mac OS) ingedrukt en sleep een selectiehandgreep om het formaat van het panoramaobject te wijzigen in ongeveer 400 x 400 pixels.

    Een panorama-overlay maken

    Laten we de standaardinstellingen voor het panorama gebruiken om het volledige scala aan bewegingsmogelijkheden te bieden.

  6. Kopieer en plak het panoramaobject van het bestand Enjoy_v.indd naar pagina 3 van het bestand Enjoy_h.indd.

  7. Sla de InDesign-bestanden op en sluit deze.

Een voorvertoning van het folio op uw iPad (alleen Mac OS) weergeven

Gebruik vervolgens de functie Voorvertonen op apparaat om een voorvertoning van uw folio weer te geven. Als u op een Windows-computer werkt, slaat u dit over en gaat u naar het volgende deel voor uitleg over het weergeven van voorvertoningen via het uploaden en downloaden van bestanden.

  1. Als u dit nog niet hebt gedaan, installeert u de Adobe Content Viewer vanuit de App Store op uw iPad. Zoek in de App Store naar ''Content Viewer''.

  2. Sluit uw iPad aan op uw Mac OS-computer en start de Adobe Content Viewer-app.

  3. Navigeer in het deelvenster Folio Builder naar het folio City Guide dat u zojuist hebt gemaakt.

  4. Kies onder in het deelvenster Voorvertoning > Voorvertonen op [naam iPad-apparaat].

  5. Bekijk het folio City Guide Magazine.

    • Draai de iPad zodat zowel de horizontale als de verticale versie van het bestand wordt weergegeven.

    • Maak een veeggebaar naar links en naar rechts om verschillende artikelen weer te geven. Veeg omhoog en omlaag om een artikel te lezen.

    • Blader naar het Enjoy-artikel. Controleer of de interactieve overlays werken.

    • Tik op een niet-interactief gebied om de navigatiebalken weer te geven en tik op de knop Startpagina om naar het begin van het folio te gaan. Tik op de knop Inhoudsopgave in de linkerbovenhoek om de inhoudsopgave en miniaturen weer te geven. Sleep de scrubber om door voorvertoningen van het artikel te bladeren.

    Tikken om navigatiebalken in de Adobe Content Viewer weer te geven

De bestanden uploaden en hiervan een voorvertoning weergeven

U kunt ook voorvertoningen van folio's op uw iPad weergeven door u aan te melden bij het deelvenster Folio Builder, het folio te uploaden en vervolgens het folio te downloaden.

  1. Kies Aanmelden in het menu van het deelvenster Folio Builder. Meld u vervolgens aan met een Adobe-id die geverifieerd is voor samenwerking met DPS.

    Als u een Creative Cloud-lidmaatschap hebt, gebruikt u uw Creative Cloud-aanmeldgegevens. Als u geen Creative Cloud-lidmaatschap hebt, meldt u zich aan bij http://digitalpublishing.acrobat.com en volgt u de aanwijzingen om uw account te verifiëren.

  2. Nadat u bent aangemeld, selecteert u het folio City Guide in het deelvenster. Kies vervolgens Uploaden naar de Folio Producer in het deelvenstermenu.

    De folio-elementen worden naar de acrobat.com-server geüpload.

  3. Als u dit nog niet hebt gedaan, installeert u de Adobe Content Viewer vanuit de App Store op uw iPad.

    Opmerking:

    Als u een ander mobiel apparaat hebt, zoals een Android-tablet of een Kindle Fire, kunt u de Adobe Content Viewer downloaden via Google Play of de Amazon Appstore.

  4. Start de Adobe Content Viewer op uw iPad.

  5. Als u zich nog niet hebt aangemeld, tikt u op de knop Aanmelden. Meld u aan met de Adobe-id waarmee u zich hebt aangemeld bij het deelvenster Folio Builder.

    Uw iPad moet verbinding hebben met internet als u zich wilt aanmelden.

  6. Wanneer hierom wordt gevraagd, downloadt u het folio City Guide Magazine en geeft u dit weer.

    Als u InDesign-brondocumenten bewerkt, selecteert u het artikel en kiest u Bijwerken in het deelvenstermenu om de artikelen bij te werken. In de Adobe Content Viewer op de iPad wordt u gevraagd om het bijgewerkte folio te downloaden.

Hoe nu verder

U weet nu wat de basisbeginselen van het maken van artikelen en folio's zijn en hoe u interactieve overlays kunt toevoegen. Als u meer wilt weten over overlays en andere DPS-functies, voert u een of meerdere van de volgende handelingen uit:

  • Open de brondocumenten in Overlay_Examples_Folio en experimenteer met de verschillende overlay-elementen. U kunt de bestaande overlays in de documenten bewerken of uw eigen overlays maken.

  • Download de gratis app DPS Tips. Zoek naar ''DPS Tips'' in de App Store van uw iPad of iPhone, of zoek in de Google Play Store naar Android-apparaten of in de Amazon Appstore naar de Kindle Fire.

  • Wilt u een app voor publicatie bij de Apple App Store indienen? Als u een Adobe Creative Cloud-lidmaatschap hebt, kunt u een onbeperkt aantal apps voor één folio voor de iPad maken en indienen. U kunt ook een Single Edition-licentie kopen om een app voor één folio te maken. Als u klaar bent om uw app te maken, selecteert u het folio in het deelvenster Folio Builder en kiest u vervolgens App maken in het deelvenstermenu. U wordt gevraagd om de Step-by-Step Publishing Guide te downloaden. Volg de instructies in die handleiding om uw eerste app te maken.

  • Als u apps voor meerdere folio's wilt maken, kunt u een Professional- of Enterprise-abonnement op de Digital Publishing Suite aanschaffen.

Dit werk is gelicentieerd onder de Creative Commons Naamsvermelding/Niet-commercieel/Gelijk delen 3.0 Unported-licentie  De voorwaarden van Creative Commons zijn niet van toepassing op Twitter™- en Facebook-berichten.

Juridische kennisgevingen   |   Online privacybeleid