Adobe FLASH for the radiologist educator

Document Sample
Adobe FLASH for the radiologist educator Powered By Docstoc
					Adobe FLASH for Creating Image Animations and Multimedia Educational Presentations (Hands-on Tutorial)

Kevin Daly, MD, Boston, MA

Spencer Gay, MD, Charlottesville, VA

Thurs, Dec 4, 2008 08:30 AM - 10:00 AM

Fri, Dec 5, 2008 08:30 AM - 10:00 AM

1. Introduce Adobe Flash as an ideal multimedia format for developing and delivering online electronic educational
content for the radiologist educator.
2. Demonstrate basic features of Adobe Flash Professional for creating Flash movies.
3. Show how to create a short Flash video clip from a sequence of radiographic images.
4. Show how to create a basic Flash based multimedia educational presentation.

Adobe Flash is a widely compatible, versatile multimedia format for delivering animated graphics, interactive
content, digital video and sound over the Internet. Many commercial websites, news organizations and educational
websites use Flash extensively to deliver multimedia content. It is also an ideal format for online multimedia
educational presentations incorporating slides, graphics, images, narration and video. Flash movies can be used to
display image animations and video clips such as a stacked sequence of radiographic images, cine clips of moving
structures or a sequence of 3-D images. The purpose of this course is to demonstrate the basics of creating Flash
movies using Adobe Flash Professional. The attendee will learn how to create short Flash video clips of
radiographic image sets and how to create multimedia educational presentations suitable for web distribution in the
Flash format. The use of third party tools for converting existing PowerPoint presentations into Flash format will
also be discussed. No prior experience with Adobe Flash Professional is necessary as this course is designed as
an introduction to the Flash development environment.

All slides, demonstration files and this handout are available online for download:

―Adobe‖, the Adobe logo, Flash®, the Flash logo (stylized ―f‖) are either registered trademarks or trademarks of
Adobe Systems Incorporated in the United States and/or other countries.
Adobe product screen shot(s) reprinted with permission from Adobe Systems Incorporated.

Presentation Outline
 Introduction: What is Flash? Why would I want to learn how to use it?

   Flash Professional CS3 Hands-On Tutorial
     Introduction: desktop, layout, common tools
     Exercise 1: Create a short FLASH movie from a stack of JPG radiographic images
     Exercise 2: Create a short FLASH movie from an existing digital video source
         Creating an embedded video
         Creating & encoding an externally linked Flash Video File (.FLV)
     Exercise 3: Create a multimedia presentation in FLASH using a presentation template

   Use of 3rd party tools for doing a PPT to FLASH conversion

   Wrap-up / Conclusions

Adobe Flash Hands on Tutorial                               RSNA 2007                                    Page 1 of 12
FAQ: FLASH for the Radiologist


What is FLASH?

          Adobe Flash or simply Flash refers to the Adobe Flash Player and the Adobe Flash Professional authoring
          program. Flash Professional can be used to create web applications, games and movies. The Flash
          Player is a client application available in most common web browsers. It supports vector and raster
          graphics1, a scripting language called ActionScript and bi-directional streaming of audio and video. Flash
          was introduced in 1996 and has become a popular method for displaying animation and interactivity in web
          pages. Flash is commonly used to create animation, advertisements, various web-page components, to
          integrate video into web pages and more recently to develop Internet applications. Flash files, traditionally
          called ―Flash movies‖ have a .swf file extension and may be an object of a web page or ―played‖ in a
          standalone Flash Player.

          Flash was initially released in 1996 by Macromedia as a vector based web animation tool. Users initially
          had to visit the Macromedia website to download the software. Over the ensuing years, Flash and Flash-
          based content became increasingly popular and by 2000 the Flash Player was being distributed with all
          AOL, Netscape and Internet Explorer browsers. Additional features were added including scripting
          language, support for MP3 audio and improved video support. According to Adobe, 99% of Internet-
          enabled desktops worldwide currently have Flash Player installed. 2 This compares with Java installed on
          85%, Microsoft Windows Media Player installed on 84% and Apple QuickTime Player installed on 67% of
          desktops in the same survey. Versions of Flash Player are available for all major platforms, browsers as
          well as many mobile devices. Adobe reports an installed base of over 750 million Internet connected
          desktops and mobile devices. Therefore, Flash is now a widely compatible Internet software environment.

Where is Flash being used on the web today?

          Due to widespread compatibility and the ability of Flash to handle graphics, animation, audio, video and
          user interaction, Flash is one of the most utilized media formats on the web today. 7 of the 10 most
          popular websites use Flash in some form. uses Flash to display video,
          advertisements and sets of photographs. Google video and YouTube both use Flash as their preferred
          format. Yahoo uses Flash to display video and advertisements. uses Flash for
          advertisements, to stream audio and to display some product images.

          Flash is being used extensively for web-based distance learning. Many sites that deliver online courses or
          online degrees are now using Flash to deliver their educational content over the web. RSNA is now using
          Flash as the primary method for streaming refresher courses from the annual meeting on its website. The
          slides, graphics, text transcript and audio from the original presentation can be integrated into an online
          web based presentation for at home CME that requires only a modest amount of bandwidth.

          Have you ever seen a slick graphic animation or interactive display on a website and wonder how did that
          website do that? Right click over the object. If the context sensitive menu that pops up includes the option
          ―About Adobe Flash Player‖ as one of the options, it was done using Flash.

Why use Flash over HTML alone?

          Hypertext Markup Language (HTML) alone is fine for creating static websites where text and images are
          placed a fixed positions. Even with plain HTML, website developers must design sites carefully to achieve
          a similar appearance across platforms and browsers. Web pages may display quite differently between
          platforms and browsers due to variability in installed fonts, font size, screen size, browser size and colors.

  Vector graphics is the use of geometrical primitives such as points, lines, curves, and polygons, which are all based upon mathematical
equations to represent images in computer graphics. Raster graphics represent images through a rectangular grid of pixels, or points of color
viewable via a computer monitor, paper, or other display medium. Raster graphics deal more practically than vector grap hics with photographs
and photo-realistic images, while vector graphics often serve better for typesetting or for graphic design.
  Adobe - Flash and Shockwave Players : Technology Breakdown Accessed 9/26/2007

Adobe Flash Hands on Tutorial                                            RSNA 2007                                               Page 2 of 12
        HTML alone does not really support dynamic sites where text, images and animations are moving around
        on the screen. Traditionally these effects were achieved with animated GIF images or java applets.
        Animated GIFs can be used for simple animations but can take a long time to load since each step in the
        animation requires a separate image to be downloaded. Animated GIFs also lack interactivity. Java
        applets can be used to create animations and interactivity, but java applets require programming skill and
        can be less stable than Flash movies.

What are alternatives to Flash?

        Flash is somewhat unique in its ability to display animations with only minimal bandwidth requirement
        because it uses vector graphics and was designed initially as an animation program. For the purposes of
        displaying video over the web, there are multiple players and formats other than Flash capable of web-
        based video streaming, including QuickTime, Windows Media Player and RealPlayer. QuickTime comes
        installed on Apple computers but Windows users must download the Windows-based plug-in. Windows
        Media Player comes installed on most versions of Windows but Apple users must download and install the
        Mac-based plug-in. RealPlayer must be downloaded and installed on both Apple and Windows platforms.
        In contrast, as Flash Player is already installed on almost all platforms and browsers, you can be fairly
        confident that the maximum number of people can play a Flash based video without having to download
        any additional software. Other benefits of Flash based video include user friendly startup, watermarking,
        ability to make your own custom controls and piracy protection.

        For displaying pure video, Flash is the most compatible format; however Flash video may take up more
        space for the same amount of quality compared to other formats like H.264, .mov, .mp4 and .wmv.
        Displaying Flash video will also require you to convert your video to Flash and then set it up to work with a
        Flash player. This is not very difficult, but is more work than just uploading a completed .mov or .wmv video
        file to your website. Another advantage of Flash for video is that unless your visitors are especially savvy,
        they can only watch the video, not download it—minimizing piracy.

How can I convert my digital video to the Flash format?

        Displaying Flash video will also require you to convert your video to Flash and then set it up to work with a
        Flash player. This is not very difficult, but is more work than just uploading a completed .mov or .wmv video
        file to your website. Flash Professional can handle almost any native digital video format and convert it to
        Flash video (.flv). There are also standalone video converters that can convert most video formats to

What are the file types / extensions involved in creating a Flash movie?

        .fla       This is the "project" file, from which you export your movie. Never upload this to your server.
                   Analogous to .PSD files for Photoshop.

        .flv        Flash video file: contains compressed video for playback within a .swf movie or .swf player if you
                   are including externally linked video in your project. You upload this to the server.

        .swf       ―swiff‖ This is the movie file that is played by the Flash Player. It may contain links to .flv files if
                   flash video is utilized. You upload this to the server.

Where would Flash be useful for educational purposes?

        Flash is most appropriate for delivering web-based content; although it could also be used for CD-ROM or
        DVD-ROM based content such as electronic CME courses.

              Animations consisting of a stack of radiographic images for display on an educational website.
              Flash animation consisting of cine images of a moving structure.
              Flash based presentation incorporating text, graphics, images, video, narration.
              Flash based video demonstrating how to perform an interventional procedure on an educational

Adobe Flash Hands on Tutorial                                     RSNA 2007                                         Page 3 of 12
What are alternatives to Flash for delivering Web-based educational content?

        HTML alone       Capable of integrating text and images. Much educational content does not require
                         animations or video

        PowerPoint       PowerPoint presentations can be exported to HTML format and uploaded to your website;
                         however there are several drawbacks with this approach. Content is not readily compatible
                         between different browsers and appears best on Internet Explorer browser (Microsoft).
                         Content can be copied or ―stolen‖. Output may be inconsistent between browsers and file
                         sizes can be large.

        Windows Media (*.wmv / *.avi) Streaming video format. Can customize output size and bit rate. Generally
                      file size is large and often requires a broadband connection. Users must have Windows
                      Media Player installed (OK for most Windows platforms but Mac users must download and
                      install a plug-in). Quality degrades as bandwidth is reduced.

        QuickTime (Apple *.mov) Similar to Windows Media Video. Windows users must download and install a
                      plug-in. Compatibility and large file size are drawbacks. It is possible to export PowerPoint
                      presentations on the Mac platform directly to QuickTime movies (which then need to be
                      compressed further). This option in not available on Windows versions of PowerPoint.

        RealNetworks Another video format that is even less compatible than QuickTime and Windows Media.
                     All users must download and install the Real plug-in.

        Scripting and server side techniques: JavaScript, java applets, cgi-perl, Coldfusion, ASP. All can be used
                        to deliver interactive content (quizzes, user feedback) but require some programming
                        expertise. None do animation or video well.

What are alternatives to Flash Professional for creating Flash movies?

        While Flash Professional is the principal development environment for creating flash movies (.swf files),
        there are alternative ways of creating flash movies without learning Flash Professional.
        Existing digital video can be converted to Flash video (.flv) through a variety of 3 party conversion tools.

        Many video editing tools are capable of exporting the video in Flash format (.flv or .swf).

        3rd party conversion tools are available for converting PowerPoint presentations into Flash movies. We
        reviewed a number of these tools last year and found several that are quick, easy to use and deliver good
        output. This may be the easiest way to go if your intent is to adapt an existing PowerPoint presentation to
        a web version for online distribution. These tools can be quite powerful and obviate the need to totally re-
        create the PowerPoint in Flash Professional manually. The best tools can accurately convert the slides,
        images, symbols, animations, slide notes, narration and timing into a Flash movie. Converting embedded
        video within the PowerPoint can be challenging.

                                        Price         Description / Features             Output
         PowerConverter          $249                 Simple PPT to FLASH plug-in        Flash (*.swf)                      Easy to use                        Executable (*.exe)

         Articulate                     $499-$699     PPT to FLASH plug-in               Flash (.swf)                           More features                      Executable (*.exe)
                                                      Can include streaming video        ZIP (*.zip)
         authorPoint                    $299          PPT to FLASH plug-in               Flash (*.swf)                            Similar to Articulate              Executable (*.exe)
                                                      Can include streaming video

Adobe Flash Hands on Tutorial                                RSNA 2007                                        Page 4 of 12
        Screen recording software is available that can record everything that appears on your computer screen
        including mouse movements along with narration. Any presentation software can be utilized. These tools
        are particularly suitable for recording software demonstrations.

                                      Price         Description / Features            Output

         Camtasia Studio              $299          Screen recording tool             FLASH (*.swf)                           Many features                     QuickTime (*.mov)
                                                    Must record through               Windows Media (*.avi /
                                                    Camtasia                          *.wmv)
                                                    Can include streaming video       Real
         Qarbon ViewletCam            $149          Screen recording tool             FLASH (*.swf)                             Simple, fewer features            Windows Media (*.avi)
                                                    Flash output in single .SWF       Animated GIF (*.gif)
                                                    file                              Executable (*.exe)

What are alternative export formats for my Flash project?

        Flash documents (.FLA file) can be exported into a variety of formats besides the standard Flash movie
        (.SWF file). Individual frames can be exported as single images and the entire Flash document can be
        exported in an alternative video format or a stacked sequence of images. Since Flash is currently the most
        web compatible video format, it is generally suitable to display animated content only in Flash. However,
        there may be circumstances when you wish to have multiple formats available or want to display snapshot
        images of your Flash movie elsewhere on your website. Flash documents can be exported in the following
        formatd by selecting File | Export | Export Image…. or Export Movie…. within Flash Professional:

        Video Formats                                         Image Sequences (stacked images)
        Flash (*.swf)                                         EMF Sequence (*.emf)
        Windows AVI (*.avi)                                   WMF Sequence (*.wmf)
        QuickTime (*.mov)                                     EPS 3.0 Sequence (*.eps)
        Animated GIF (*.gif)                                  Adobe Illustrator Sequence (*.ai)
                                                              DXF Sequence (*.dxf)
                                                              Bitmap Sequence (*.bmp)
                                                              JPEG Sequence (*.jpg)
                                                              GIF Sequence (*.gif)
                                                              PNG Sequence (*.png)

How do I get Flash?

        Flash Player is free and comes preinstalled on all major web browsers. You may be prompted to download
        and install the latest version of the player if the site you are accessing requires the latest version of the
        Flash Player (latest version is Flash Player 10.0). Flash Player only allows you to play Flash movies (.SWF

        To create Flash movies, you need Flash® Professional, which is the developing environment for Flash.
        Adobe has just released a new version, Adobe® Flash® CS4 Professional (version 10.0). It can be
        purchased in a standalone version from Adobe for $249 (educational discount) or $699 retail. Flash® CS4
        Professional is part of the Creative Suite 4 which bundles several Adobe products aimed at the website
        developer. Adobe® Creative Suite 4 Web Standard is $399 (educational) and includes Adobe®
        Dreamweaver® CS4, Adobe® Flash® CS4 Professional, Adobe® Fireworks® CS4 and Adobe®
        Contribute® CS4. The CS4 Web Premium version adds Photoshop® CS4 Extended, Adobe® Illustrator®
        CS4 and Adobe® Acrobat® 9 Professional to the bundle and costs $499 educational. Dreamweaver® CS4
        is a web development tool for designing, developing and maintaining websites. Fireworks® CS4 is a tool
        for developing web user interfaces and creating and optimizing images for the web.

        It is also possible to create Flash movies without Flash Professional. Many third party software packages
        are capable of generating output in the Flash file format (*.swf). See Alternatives to Flash Professional

Adobe Flash Hands on Tutorial                               RSNA 2007                                    Page 5 of 12
Where can I learn more about Flash and How to create Flash Movies?

        The Adobe Website has extensive support and tutorials available for learning flash:

        Main Adobe page for Flash

        Adobe Design Center: Multiple tutorials are available free.

        There have been several articles published in the radiology literature on the use of Flash for educational
        presentations and for creating simple movies. Some are web only versions:

        Chun-Shan Yam
        Using Macromedia Flash for Electronic Presentations: A New Alternative
        Am. J. Roentgenol., Aug 2006; 187: W209 - W217.

        Chun-Shan Yam
        Simple Method for Inserting Flash Movies into PowerPoint Presentations
        Am. J. Roentgenol., Apr 2007; 188: W374 - W378.

        Chun-Shan Yam
        An Alternative for Presenting Interactive Dynamic Data Sets in Electronic Presentations: A Scrollable Flash
        Movie Loop
        Am. J. Roentgenol., Nov 2007; 189: W295 - W300.

        Denis Hoa, Antoine Micheau, and Gerald Gahide
        Creating an Interactive Web-based e-Learning Course: A Practical Introduction for Radiologists
        RadioGraphics 2006 26: e25; published online as 10.1148/rg.e25

        Software texts are also available:

        Adobe Flash CS3 Professional Classroom in a Book by Adobe Creative Team 2007

        Teach Yourself Adobe Flash CS3 Professional in 24 Hours (Sams Teach Yourself) (Paperback)
        by Phillip Kerman (Author)

Adobe Flash Hands on Tutorial                               RSNA 2007                                     Page 6 of 12
Introduction to FLASH Workspace
Opening Flash

Flash Professional Workspace
Multiple Panels
        Similar to Photoshop
        Panels can be shown / hidden using Window menu. Can always go back to the default layout or hide all
        Workspace can be extensively customized by rearranging panels

           Tools Panel: contains tools for drawing, coloring, selecting
           Stage Panel: displays what will be shown in the Flash movie
           Properties Panel: context sensitive property information based on the selected object. If no object is
            selected, the Properties panel displays information on the Flash document (size, publish settings,
            background color and frame rate).
           Timeline: displays animation timeline in frames
             Organizes and controls a document’s content over time in layers and frames.
             Like films, Flash documents divide lengths of time into frames.
             Layers are like multiple film strips stacked on top of one another, each containing a different image
                that appears on the stage
           Panel Well: can contain library panel & additional panels
           Workspace Layouts can be saved and set to serve as your default layout
           Window menu controls which panels are visible. If you don’t see what you want, go to the Window
            Menu. To hide all panels, F4
           New Flash documents can be displayed as new windows or new tabs
           Help: Flash Help (internal help) can browse and search F1

Useful Keyboard Shortcuts
       Show/Hide panels….F4
       Insert New Frame…F5
       Convert to Keyframe…F6
       Convert to Blank Keyframe F7
       Publish Preview….F12

        Tool                    Shortcut                              Tool                    Shortcut
        Arrow                   V                                     Pencil                  Y
        Sub Select              A                                     Brush                   B
        Lasso                   L                                     Ink Bottle              S
        Line                    N                                     Paint Bucket            K
        Pen                     P                                     Dropper                 I
        Add Anchor Point        =                                     Eraser                  E
        Delete Anchor Point     -                                     Hand                    H
        Convert Anchor Point    C                                     Magnifier               M, Z
        Text                    T                                     Free Transform          Q
        Oval                    O                                     Fill Transform          F
        Rectangle               R                                     Object Drawing          J

Terminology: Frames & Keyframes
   • Frame….Flash divides lengths of time into frames in the timeline

   • Keyframe….frame in which you define a change to an object’s properties for an animation or include
      ActionScript code to control some aspect of the document

   • Tween….Flash can automatically fill in the frames between keyframes to produce fluid animations without
      having to draw each individual frame. Called ―tweening‖ for between

Adobe Flash Hands on Tutorial                              RSNA 2007                                     Page 7 of 12
Exercise 1: Creating a Flash Movie from a stack of Radiologic Images

    Goal: Create a Flash Movie (.swf) of a stacked sequence of radiologic images for your website

   1. Launch Flash
   2. Select New from the File Menu
   3. Select Flash File (ActionScript 2.0) then OK
   4. Select File | Import | Import to Stage…. (or Ctrl-R)
   5. Navigate to Flash Course\Exercise1\CardiacCT\1001.jpg and click open
         -You will be prompted to import all of the images in the folder (they are numbered sequentially) YES
         -Each image will be imported as a KeyFrame on the timeline
   6. Click anywhere on the stage outside the images to deselect the images
         -Properties panel will then reflect Properties for the Document (instead of the images)
   8. Click on Size Button on Properties Panel (says 550 x 400 pixels)
         -Document Properties dialog pops up
   9. Select Match: Contents
         -This will resize & recenter the stage to fit the content of the movie (the imported images)
   10. Save Flash file: File | Save As…
         -Call it Exercise1.FLA in the Working Folder
   11. View the movie: File | Publish Preview | Default (HTML) or F12

   Export Options
       File | Export | Export Movie….
       -Choose Animated GIF as an example
       -Reduce size of Animated GIF to 250 pixels

   Image Import Considerations
      •   All major Image formats are supported for import
      •   Flash will compress the imported file if not already compressed using JPEG algorithm (you can set the
          quality factor) when you publish the file
      •   Flash will leave imported JPEG images at their imported quality (will not recompress)
      •   Limited image editing tools in Flash once imported (cannot crop)
      •   Best to optimize image first (Photoshop, Fireworks or ImageReady), resize & save as JPEG
      •   Smallest file size with adequate quality: remember web only needs 72 dpi
      •   Size: Ideally No larger than 640 pixels wide (although you can scale in Flash)
      •   For multiple images in sequence, name files sequentially: CT1.jpg, CT2.jpg, CT3.jpg

Adobe Flash Hands on Tutorial                                RSNA 2007                                  Page 8 of 12
Exercise 2: Incorporating Video

Video can be incorporated in 2 different ways:
     Embedded: the entire video is imported into the main .swf file (can create large main file size)
     Play externally as a .flv file (Best for clips >30 sec & those with sound)
Embedding video
     Makes the main file bigger
     Quality isn’t as good as playing an external .flv file
     Appropriate for very short video (<30 sec) without sound where you don’t want to maintain separate files or
        when you need precise frame by frame control
External video file
     Video is imported, compressed using one of the Flash Player’s two supported codecs and saved as a .flv
     The main .swf file will contain links to the .flv file. Both files need to be uploaded to your website
What video formats can be imported into Flash ?
     QuickTime (.mov)
     Digital video (.dv)
     MPEG (.mpg or .mpeg)
     Windows Media (.asf or .wmv)
     Video for windows (.avi)
Video Compression
     Flash handles video compression through the use of codecs (compressor/decompressor)
     Sorenson Spark (older but works on Flash 6 & 7 players)
     On2 VP6 (newer, better quality but requires Flash 8 player)

Exercise 2: STEPS: Importing an Embedded Video
   1. File | New…. Choose Flash File(ActionScript 2.0)
   2. File | Import | Import Video….
   3. Locate Video to be imported: Flash Course\Exercise2\Clip1.AVI
   4. Choose ―Embed video in SWF and play in Timeline‖ from Deployment options
   5. Embedding Options… default options ok
   6. Encoding Options
           a. Default is Flash 8 Medium Quality (400kbps) bit rate
           b. Video Tab: On2 VP6 is default codec (does require Flash 8 Player or later)
           c. Crop & Resize: Adjust Cropping to just show the MRA
   7. Click Next then Finish to begin the encoding process
   8. Choose background Color
   9. File | SaveAs…. Flash Course\Working Folder\Exercise2.FLA is fine
   10. Publish preview to view: File | Publish Preview | Default (HTML) or F12

Adding Buttons
   11. Select Clip if not already selected & name clip in the Properties panel: ―Clip1‖ is fine
   12. Click Window | Components (or Ctrl+F7) to show Components Panel
   13. Expand Video Item within Components panel
   14. Drag & Drop PlayButton & PauseButton to Stage just below the movie
   15. Click Window | Behaviors to bring up Behaviors Panel
   16. With Play button on Stage selected: Click + to add behaviors and select Embedded Video | Play as the
           a. You will be prompted to select the video clip to play (―Clip1‖)
           b. The behavior should show up as an OnRelease event for the Play button
   17. Repeat above to add function to the pause button:
           a. Click Pause button 1st to select
           b. Behaviors panel: ―+‖ to add: Embedded Video | Pause
           c. The behavior should show up as an OnRelease event for the Pause button
   18. Resize Stage to the Contents: Click anywhere on stage outside objects to deselect
           a. Click on Size button on the Properties Panel
           b. Click Match Contents within the Document Properties panel
   19. Save the File
   20. Publish Preview: File | Publish Preview | Default (HTML) or F12
Adobe Flash Hands on Tutorial                             RSNA 2007                                    Page 9 of 12
Exercise 2: Importing an Externally linked video (.FLV)

    1.    File | New | Flash File (ActionScript 2.0)
    2.    File | Import | Import to Stage….
    3.    Select Thoracentesis.avi when prompted: Flash Course\Exercise2\Thoracentesis.avi
    4.    Select ―Progressive download from a web server‖ as Deployment option
    5.    Encoding Options:
               a. Medium Quality
               b. Video tab: Leave default options
               c. Audio tab: Can decrease to 16 kbps mono to minimize audio tract overhead
               d. Crop and Resize….Resize video to 360 x 240 pixels to decrease size
    6.    Choose video skin to determine appearance of controls.
    7.    Click Next to Start import.
    8.    You will be prompted to Save the File if you haven’t already.
    9.    After importing a Flash video component is placed on the stage.
    10.   Resize the stage to fit the output (Deselect the object, click size button in Properties panel, choose Match:
          Contents in the Document Properties Dialog box.
    11.   File | Publish Preview | Default (HTML) to view the output.

Adobe Flash Hands on Tutorial                                  RSNA 2007                                    Page 10 of 12
Exercise 3: Flash Based Presentation
   1. File | New… Chose Flash Slide Presentation from General Tab
   2. Add additional slides from the Screen Navigator panel by clicking ―+‖ sign or right-click within the screen
       thumbnails to add additional slides
   3. Select the parent ―presentation‖ screen
   4. Click anywhere on the stage to select the document
   5. Choose Background color for Presentation from Properties panel
   6. Window | Components (Ctrl+F7) to show Components panel
   7. Click + on User Interface on Components panel to expand
   8. Drag 3 Buttons onto the stage at the bottom
   9. Click on Each button & go to Parameters Tab at bottom of desktop
            a. Label the buttons by changing label parameter
            b. ―Home‖, ―Prev‖, ―Next‖
   10. Window | Behaviors to show Behaviors panel if not already open
   11. Add behavior to each button
            a. Select Home button by clicking on the Home button
            b. Add Behavior ―+‖ Screen | Go To First Slide (for Home)
            c. Function will show up as ―OnRelease‖ event for the button
            d. Select Prev Button & add event ―Go To Previous Slide‖
            e. Select Next Button & add event ―Go To Next Slide‖
   12. Click on Text Tool ―T‖ on Tools Panel
            a. Click & Drag box at bottom of the presentation slide
            b. Type ―RSNA 2007‖
            c. Adjust Font Size to 22, Color white & Italics style
   13. Click on slide1 thumbnail on L side of desktop
   14. Add Text to Slide1 ―Imaging of Cervical Spine‖ or whatever you want
   15. Click on slide2 thumbnail on L side of desktop
   16. Add Text on L side of slide ―Imaging Modalities, -Plain Film, -CT –MRI‖
   17. File | Import | Import to Stage…..
            a. Navigate to Flash Course\Exercise3\CSpine.jpg
            b. Open
            c. Image is imported to stage
   18. Resize image by selecting Free Transform tool from Tools menu & adjusting size
   19. Move image to R of slide by clicking selection tool (arrow at top of tools panel), clicking & dragging the
       image on the stage
   20. Save the document: File | Save As ―Exercise3‖ is fine in the working folder
   21. Select Slide 3
   22. File | Import | Import to Stage….
            a. Open Neck MRA folder within Exercise3 folder
                (Flash Course\Exercise3\NeckMRA\101.jpg)
            b. You will be prompted to import all images as a sequence (Yes)
   23. To move / resize the imported images, we need to show the Timeline to edit all images:
            a. Window | Timeline or (Ctrl+Alt+T)
            b. Select All images: click on Layer 1 to select all frames
            c. Click on Multiple Frames box & widen bracket at top of timeline to cover all frames
            d. Now we can move & scale (Free Transform) images to R side of screen
   24. Add another layer for the text (bottom L of timeline panel)
   25. With Layer2 selected add Text using Text tool ―T‖ from tools panel
            a. ―Contrast Enhanced MRA‖
            b. Adjust Font size, color, style as needed
   26. Select Slide 4
   27. Add text to Slide4 by clicking on the text tool ―T‖ on tools panel, dragging on stage & typing
   28. Add text to Slide5 by clicking on text tool ―T‖ on tools panel, dragging on stage & typing
   29. Now Preview the output: File | Publish Preview | Default (HTML) or F12

Adding Sounds / Narration
    Narration can be added to each slide in your presentation:
    File | Import | Import to Stage then selecting an audio file and following the prompts

Adobe Flash Hands on Tutorial                               RSNA 2007                                   Page 11 of 12
If you have an existing PPT file you want to web-distribute:
Use of 3rd party tools for doing a PPT to FLASH conversion
    We evaluated 20 PowerPoint to FLASH 3 rd party conversion tools last year. They come in two general forms:
    PowerPoint plug-ins and Screen recording software. Conversion tools that work as a PowerPoint plug-ins are
    relatively easy to use. Narration can be added by recording sounds within PowerPoint. Then the conversion
    tool is launched within PowerPoint to trigger the conversion process. Animations, narrations, slide notes and all
    slides are captured and turned into a Flash based presentation. Screen recording software works by capturing
    everything on the screen or within a window as a video. Any presentation software can be utilized (not
    PowerPoint specific). Mouse movement is captured. The recording can then be exported in multiple video
    formats, including Flash video. File sizes tend to be much larger than with the PowerPoint plug-in tools.

Example: PPT  Flash Conversion Steps
    Choose PowerPoint Presentation
    Add narration to PowerPoint presentation within PPT
          - Best to use a hands free / lapel microphone or USB Condenser Microphone
          - PowerPoint will record slide timings along with the narration that will be captured by the PPT to
              FLASH converter
          - To Pause or Resume Narration Recording: Right Click……Pause Narration or Resume Narration
    Launch 3rd party tool to convert to FLASH
          - PowerConverter is shown in this example
          - Follow steps in Dialog Box to convert the narrated PowerPoint file to FLASH (or EXE) format
          - Choose FLASH player style: simple, or with thumbnails & speaker notes
          - View the Result
    Distribute Output:
          - Upload to web server
          - Can e-mail link to website
          - Place on shared network drive
          - Distribute on CD-ROM

Flash Resources
• is starting point for extensive online resources
• has this presentation as well as the files used in this course for download
•   Software texts are also available.
     – Adobe Flash CS3 Professional Classroom in a Book by Adobe Creative Team 2007
     – Teach Yourself Adobe Flash CS3 Professional in 24 Hours (Sams Teach Yourself) by Phillip Kerman

Thank you
Please complete course evaluations & turn in as you exit

Adobe Flash Hands on Tutorial                                RSNA 2007                                     Page 12 of 12

Shared By:
Jun Wang Jun Wang Dr
About Some of Those documents come from internet for research purpose,if you have the copyrights of one of them,tell me by mail you!