Full version of my Project Showcase presentation at the STC Summit 2011 in Sacramento. Includes information about graphics using Visio and SnagIt, and includes references and software alternatives.

1. Embedding Flash Movies in PDFs
STC Technical Communication Summit 2011
Lance-Robert, twitter@stc-sd.org

2. The challenge
• Documenting hardware subsystems that change over time
- Frequent page turning required
- Readers could inadvertently skip pages and miss details
• Information must be presented in a format readers can use
- Minimal time on the part of the reader
- Little, if any, instruction for readers to see results
- All information for a given subsystem on a single page
Embedding Flash Movies in PDFs Page 2 of 28

3. The possible solutions
Solution Advantages Disadvantages
Multiple images in • Easiest solution from writer • Frequent page turning required
document perspective • Reader can inadvertently skip or lose place
• Fairly easy to implement • Scrolling required
Online help/HTML
• Easy to maintain • Not an option (version control issues)
• Looks like a movie or TV show • Can take time to produce, load, and play
• Familiar to readers who browse the • Can significantly increase PDF file size
Flash video (FLV)
web • Might have to be re-filmed if configuration
changes
• Looks cool, if done right • Can take time to produce, load, and play
• Familiar to readers who browse the • Can bring up painful “skip intro” memories
Flash animation web • Can be “choppy” and not render well
• Can significantly increase PDF file size
• Can be difficult to maintain
• Loads quickly, no motion • Not nearly as “flashy”
• Can be viewed instantly as required • Common reaction is “That’s it?”
Flash static movies • No rewinding or fast forwarding
• Small increase in PDF file size
• Easy to maintain
Embedding Flash Movies in PDFs Page 3 of 28

4. The software
• Adobe FrameMaker 8
- Purpose:
- Creates document source for the PDF file
- Current version is 10
- Some alternatives for creating PDF files:
- Adobe InDesign
- MadCap Flare or Blaze
- QuarkXPress
- Microsoft Word
- Any desktop publishing or word processor program that generates PDF files
• Microsoft Visio 2007 Professional
- Purpose:
- Creates block diagrams, PNGs, and PDF of last graphic (phase 1 in this example)
- Blocks can optionally use dynamic “data link” to Microsoft Access and other databases
- Current version is 2010 (standard, professional, and premium)
- Some alternatives for creating diagrams:
- SmartDraw (a San Diego company)
- Adobe Illustrator
- Inkscape
- Gliffy
Embedding Flash Movies in PDFs Page 4 of 28

5. • TechSmith Snagit 10
- Purpose:
- Creates screen captures
- Creates spotlight and callouts in PNG files
- Some alternatives for modifying PNG files:
- Microsoft Visio
- Adobe Fireworks
- Adobe Photoshop
- Any graphics program that modifies PNG files
• Adobe Acrobat 9 Professional
- Purpose:
- Creates PDF files from document source
- Imports and plays Flash SWF files (includes built-in Flash player)
- Current version is X (10)
- Some alternatives for creating PDF files:
- PDFMaker
- Various open source and commercial programs
Embedding Flash Movies in PDFs Page 5 of 28

6. • Adobe Flash CS5 Professional
- Purpose:
- Creates Shockwave Flash/small web file (.SWF or “swiff”) files from Flash (.FLA) source
- Not all Flash movies contain animation
- Some alternatives for creating SWF files:
- Adobe Flash Catalyst
- Adobe Captivate
- QuarkXPress
- SWISHMax
- KoolMoves
- Any commercial or shareware program capable of producing SWF output
Embedding Flash Movies in PDFs Page 6 of 28

7. The process
• Block diagrams in Visio
- Create block diagrams for each phase and transition.
- Link diagrams to a database using the data link function (optional, but extremely handy).
- Change the heading, caption, label, or description for each phase and transition.
- Save diagrams as portable network graphics (PNGs), using Visio’s default settings.
Embedding Flash Movies in PDFs Page 7 of 28

8. - Save the last Visio diagram (phase 1 in this example) as a PDF.
- Select the diagram you want to save.
- Save only the selection, not the whole file, as a PDF.
- Saving the diagram as a PDF provides improved resolution in the final PDF, versus the low-resolution Flash
default.
- In Acrobat, crop the PDF to remove the excess.
Embedding Flash Movies in PDFs Page 8 of 28

9. • PNGs
- Edit the transition PNGs using Snagit or a similar program.
- Add the highlighting and callouts as required.
- Can also use Microsoft Visio, Adobe Fireworks, or other programs.
Embedding Flash Movies in PDFs Page 9 of 28

10. • Flash
- Start the Flash program, and create a new Flash file using ActionScript 3.0.
- Some helpful links on the Flash start screen:
- Getting started: Detailed overview of Flash
- New features: What’s new in this version
- Developers and Designers: Links to tutorials and code samples
- Flash Exchange: Free and paid Flash programs and samples to extend Flash’s capabilities
Embedding Flash Movies in PDFs Page 10 of 28

11. - Layers:
- Create four new layers.
- Label the new layers: actions, labels, diagrams, and buttons.
- Save the FLA file.
- Labels layer:
- Create three new key frames in the labels layer at ten-second intervals: 10 seconds, 20 seconds, and 30
seconds.
- Using the Properties tab, add three new labels to the labels layer: Phase0, Changes, and Phase1.
Embedding Flash Movies in PDFs Page 11 of 28

12. - Diagrams layer:
- Create three key frames in the diagrams layer at the same ten-second intervals: 10 seconds, 20 seconds,
and 30 seconds.
- Import the PNGs into the diagrams layer individually using CTRL-R (Windows) or CMD-R (OS X).
- If Flash asks if your diagram is part of a sequence, click No. This prevents Flash from importing all of your
diagrams into the same frame.
Embedding Flash Movies in PDFs Page 12 of 28

13. - Stage:
- Click the stage, and set the stage size in the Properties tab to fit the diagrams.
- For this example, use 600 x 480 pixels.
- Center and adjust the diagrams to fit.
Embedding Flash Movies in PDFs Page 13 of 28

14. - Buttons layer:
- Insert one keyframe for the entire buttons layer (0 through 30 seconds).
- From the Components tab, drag a button to the buttons layer.
- Define the button’s instance name in the Properties tab. The first one is Phase0, no space. This matches the
name on the labels layer.
- Define the button’s label in the Component Inspector. The first one is Phase 0, with a space.
- For additional buttons, drag them from the Library.
- Define additional button instance names and labels.
- Align and distribute buttons with the bottom of the stage.
Embedding Flash Movies in PDFs Page 14 of 28

15. - Actions layer:
- Add ActionScript to the actions layer.
- Very important to include the stop() command first, lest your movie run in a continuous loop.
- Button instance names (Phase0, Phase1, and Changes) move the play head to their associated frame labels
and diagrams when clicked.
- Additional phases and changes are easy to add: just copy, paste, and edit as required.
- Click the check mark to make Flash check your syntax.
- Hold on! Isn’t this (gasp!) programming?
Embedding Flash Movies in PDFs Page 15 of 28

16. “Feel the fear, and do it anyway.”
—Susan Jeffers
Embedding Flash Movies in PDFs Page 16 of 28

17. - Test the Flash movie:
- Move the play head back and forth to view all the frames.
- Save your file.
- Press CTRL-ENTER (Windows) or CMD-ENTER (OS X) to compress the FLA file and save it as an SWF file.
- Click the buttons to ensure they point to the right diagrams.
- You can exit Flash at this point.
Embedding Flash Movies in PDFs Page 17 of 28

18. - Import the SWF into your PDF file:
- In Acrobat, select the Flash Tool from the multimedia toolbar, or select Tools > Multimedia > Flash Tool.
- Double-click the intended location on the PDF page (does not have to be precise).
- The Insert Flash dialog displays.
- Browse to the SWF file you created and select it.
- Leave Snap to content proportions selected (the default).
- Click Show Advanced Options.
Embedding Flash Movies in PDFs Page 18 of 28

19. - Set the Playback Style to “Play content in floating window.”
- Select Create poster from file and browse to the PDF you made from the Visio phase 1 diagram.
- Click OK.
- The PDF of the Visio diagram is inserted into the page.
Embedding Flash Movies in PDFs Page 19 of 28

20. - Click the Select Object tool (arrow).
- Manually position and resize the graphic, if required.
- Click the Hand tool.
- The entire graphic you imported is now a clickable “hot spot.”
- To see the Flash movie, click anywhere on the graphic.
- It takes a little time to load and play the first movie while the Flash player loads, but subsequent movies will
play immediately.
- To see the different phases and changes, click the buttons as desired.
- To exit the Flash movie, click the faint, grey X at the upper-right corner.
Embedding Flash Movies in PDFs Page 20 of 28

21. The static demo
Temporal Subsystem (TSS) Phase 1 Configuration
Processor Phase Heisenberg
RAM
Inducer Compensator
I/F I/F I/F I/F
System Bus
I/F I/F I/F I/F
ROM Control Timers Registers
Figure 1: Temporal subsystem block diagram (click to activate)
Embedding Flash Movies in PDFs Page 21 of 28

22. The animated demo
Temporal Subsystem (TSS) Phase 1 Configuration
Processor Phase Heisenberg
RAM
Inducer Compensator
I/F I/F I/F I/F
System Bus
I/F I/F I/F I/F
ROM Control Timers Registers
Figure 2: Temporal subsystem block diagram animation (click to play)
Embedding Flash Movies in PDFs Page 22 of 28

23. The Flash resources
• Adobe online
- Flash information and product purchase ($699 new, $199 upgrade, educational discounts available)
- http://www.adobe.com/products/flash/
- Free 30-day trial (full version, 858.5 MB)
- https://www.adobe.com/cfusion/tdrc/index.cfm?product=flash&promoid=GXWGG
- Developer connection (getting started guides and tutorials)
- http://www.adobe.com/devnet/flash/?navID=gettingstarted
- Flash ActionScript 3.0 free samples (10 MB Zip file for all)
- http://www.adobe.com/devnet/flash/samples/
- Flash Exchange Community (free and commercial downloads and add-ons)
- http://www.adobe.com/cfusion/exchange/index.cfm?event=productHome&exc=2&loc=en_us
- Flash cookbook (find and share code recipes)
- http://cookbooks.adobe.com/flash
Embedding Flash Movies in PDFs Page 23 of 28

24. • Acrobat online
- Learning center tutorials
- http://www.acrobatusers.com/learning_center/tutorials
- Acrobat Development Center
- http://www.adobe.com/devnet/acrobat/index.html?view=home
- Acrobat development documentation
- http://www.adobe.com/devnet/acrobat/index.html?view=documentation
- Acrobat JavaScript reference
- http://www.adobe.com/devnet/acrobat/javascript.html
- PDF Developer Junkie blog
- http://blogs.adobe.com/pdfdevjunkie/
- UVSAR blog, includes Advanced Video in Acrobat 9 Pro webinar (July, 2010) and replacement SWF player
- http://www.uvsar.com/go/auc7
Embedding Flash Movies in PDFs Page 24 of 28

25. • Flash (SWF) alternatives
- Adobe Flash Catalyst CS5 ($399 new)
- http://www.adobe.com/products/flashcatalyst/
- Adobe Captivate CS5 ($799 new, $299 upgrade)
- http://www.adobe.com/products/captivate/
- Qarbon ViewletBuilder 6 ($399 new, $199 upgrade)
- http://www.qarbon.com/presentation-software/viewletbuilder/
- QuarkXPress 8 ($799 new, $299 upgrade)
- http://8.quark.com/
- http://quark.com/about/web_seminars/
- SWISH Max 4 ($105) and miniMax 4 ($49), Windows only
- http://www.swishzone.com
- KoolMoves ($49) and KoolWizard ($25), Windows only
- http://koolmoves.com/index.html
• Flash on the iPad and iPhone?
- Frash: Adobe Flash on iOS
- http://appadvice.com/appnn/2010/07/flash-now-on-ios/
- Gordon: Open source Flash runtime written in JavaScript runs Flash on the iPhone and iPad
- http://www.9to5mac.com/flash-javascript-iphone-gordon-63453645
- Skyfire mobile browser
- http://www.skyfire.com/
Embedding Flash Movies in PDFs Page 25 of 28

26. • Flash classes, resources, and instruction DVDs
- Commercial providers ($)
- San Diego Flash User Group (SDFUG)
- http://sdfug.org
- Lynda.com online classes and DVDs ($)
- http://www.lynda.com/home/websearch.aspx?q=Flash
- Virtual Addiction’s Flash CS4 Essential Training DVD by Emily Kay (12 hours, $45)
- http://virtualaddiction.com/
- iTunes U Flash and Actionscript classes (free)
- http://apple.com/itunes
- Local community colleges
- San Diego Continuing Education (free, sample class listing below)
- http://sdce.edu/
Embedding Flash Movies in PDFs Page 26 of 28

27. • Recommended books, eBooks, and PDFs (O’Reilly 35% discount code: DSUG)
- Flash CS5: The Missing Manual
- Chris Grover, O’Reilly Media, ISBN 978-1-449-38025-0
- Creating a Web Site with Flash CS4: Visual QuickProject
- David Morris, Peachpit Press, ISBN 978-0-321-59151-7
- ActionScript 3.0: Visual Quickstart Guide
- Derrick Ypenburg, Peachpit Press, ISBN 978-0-321-56425-2
- Adobe Flash CS4 Professional HOW-TOs: 100 Essential Techniques
- Mark Schaeffer, Adobe Press, ISBN 978-0-321-58004-7
- Flash Out of the Box (Flash MX 2004)
- Robert Hoekman, Jr., O’Reilly Media, ISBN 978-0-59600-691-4
- Flash Hacks: 100 Industrial-strength Tips and Tools (Flash MX 2004)
- Sham Bhangal, O’Reilly Media, ISBN 978-0-596-00645-7
- Official SWISHMax Bible
- Donna L. Baker, Wiley Publishing, ISBN 978-0-76547-563-1
Embedding Flash Movies in PDFs Page 27 of 28

28. The contact information
• Thank you for attending!
• I welcome your questions, suggestions, and comments:
- Lance-Robert (Lance to my friends)
- twitter@stc-sd.org
• Twitter feed for the San Diego and Orange County STC Chapters, includes job links:
- http://twitter.com/STCSoCal
Embedding Flash Movies in PDFs Page 28 of 28