Adobe InDesign CS5 – Illustrated Unit H: Adding Interactivity and Exporting Documents

1. Adobe InDesign CS5 – IllustratedUnit H:Adding Interactivity and ExportingDocuments

2. Objectives • Upon completion of this unit, you should be able to: • Create a document for the Web • Create a hyperlink • Create an animation • Export a document as a Flash Player file • Create a button • Create a rollover

3. Objectives • Export a document as an interactive Adobe PDF file • Understand export options for the Web

4. Creating a Document for the Web • Existing documents can be converted for the Web • It is ideal to create a Web document from scratch in the New Document dialog box • Allows you to choose Print or Web as the intended output for the document • When you choose Web • Some settings in the dialog box change to reflect the Web environment • Current unit of measure and color mode

5. Creating a Document for the Web FIGURE H-1: New Document dialog box

6. Creating a Document for the Web FIGURE H-2: Viewing the Interactive workspace

7. Creating a Hyperlink • Hyperlinks • Make it possible to jump to other locations • In the same document • To other documents • To Web sites • Can appear as a rectangle or can be invisible • Created using the Hyperlinks panel

8. Creating a Hyperlink • Each hyperlinks requires a source and a destination • Source: actual link that a user will click • Can be text, a text frame, or a graphics frame • Destination: place the source jumps to • Hyperlinks • Only active in InDesign documents exported as Adobe PDF or SWF files

9. Creating a Hyperlink FIGURE H-3: New Hyperlink dialog box

10. Creating a Hyperlink FIGURE H-4: Viewing the hyperlink

11. Creating a Hyperlink FIGURE H-5: Buddy Dog Humane Society Web site

12. Creating an Animation • Animation • Effect used to cause an object to move in a specific way (e.g., zoom in from the side or spin) • Can add a lot of fun and visual interest to InDesign documents • Created using the Animation panel • Select the object that you wish to animate • Choose a type of animation from the Preset menu on the panel

13. Creating an Animation • You can choose: • How many seconds the animation should last • How many times it should occur • The event that will cause it to occur

14. Creating an Animation FIGURE H-6: Choosing an animation preset

15. Creating an Animation FIGURE H-7: Preview panel

16. Exporting a Document as a Flash Player File • Shockwave Flash (or SWF) • Popular format for online animations and games • Files are scalable and compact • Makes them perfect for the Web • Files can be viewed by anyone with Flash Player

17. Exporting a Document as a Flash Player File • To export an InDesign document as an SWF file • Choose Flash Player (SWF) in the Save as type list (Win) or Format list (Mac) in the Export dialog box • Generate an HTML File • To preview the SWF file in a browser window after exporting

18. Exporting a Document as a Flash Player File FIGURE H-8: Export SWF dialog box

19. Exporting a Document as a Flash Player File FIGURE H-9: Viewing the interactivity pointer

20. Creating a Button • A button refers to an interactive, clickable item • Becomes active when the document is exported as an interactive Portable Document Format (PDF) or SWF file • A button can be made out of just about any object in InDesign • Shape, placed image, or text

21. Creating a Button • To create a new button • Select the object • Click the Convert to Button command on the Object menu • Buttons panel opens, prompting you to choose an action and an event • Event: required treatment of the button • Action: what will happen as a result of the action

22. Creating a Button FIGURE H-10: Converting the apple to a button

23. Creating a Button FIGURE H-11: Defining the action for the event

24. Creating a Rollover • When you create a button: • You can change its appearance, or state, when an event takes place • To define a new appearance: • Select the button • Click either [Rollover] or [Click] on the Buttons panel • Make changes • New appearance appears on the Buttons panel

25. Creating a Rollover • Working with effects • Ten effects can be applied to InDesign objects from the Object Effects menu • More than one effect can be applied to an object at a time • Preflight panel • Use to check an open document for errors

26. Creating a Rollover FIGURE H-12: Selecting the [Rollover] appearance FIGURE H-13: Effects dialog box

27. Creating a Rollover FIGURE H-14: Viewing the drop shadow effect

28. Exporting a Document as an Adobe PDF File • PDF, Portable Document Format • File format used in Adobe Reader and Acrobat software programs • Allows you to view documents created from other software programs and saved in PDF file format • Without needing those programs installed • Makes it easier for a large audience to view

29. Exporting a Document as an Adobe PDF File FIGURE H-15: Export to Interactive PDF dialog box

30. Exporting a Document as an Adobe PDF File FIGURE H-16: Viewing Apple button.pdf in Adobe Reader

31. Understanding Export Optionsfor the Web • Designers must: • Create printed materials • Translate materials for use on the Web • InDesign Makes it easy to prepare Web-ready graphics and pages • Can be exported for use in: • Adobe Flash • Adobe Dreamweaver • Other HTML editors

32. Understanding Export Optionsfor the Web • InDesign documents can be exported for use on the Web as: • JPEG (Joint Photographic Experts Group) • Dreamweaver • SWF (Shockwave Flash) • FLA • XML

33. Understanding Export Optionsfor the Web FIGURE H-17: Viewing the exported file in Adobe Flash Professional CS5