Prezi is a Flash-based visualization, storytelling, and presentation tool that allows you to create nonlinear presentations. Using the simple editor, you can place text, images, video, Flash files, and draw lines to show relationships between each item. The final result is a visual map that lets users zoom in and out and navigate to content in a clickable environment.

It takes a while to get used to Prezi’s interface—especially the Zebra, which allows you to position and resize objects. The site offers excellent support with an online manual, tutorial videos, examples, and a blog. Perhaps the best feature is that it allows designers to focus on designing. Using Prezi, you can present a concept and supply multiple branches to supporting media without writing a line of code—it’s like sketching an idea on a napkin!

As a hosted solution, Prezi has three pricing structures: Free, Enjoy (approximately $58/year), and Pro (approximately $176/year). The Free version gives you up to 100 MB of storage on their site, includes the Prezi logo on your presentation, and makes your presentations public. For an annual fee, the Enjoy and Pro versions let you create private presentations and access additional online storage space. Pro allows you to download a desktop version of their editing software. Free and Enjoy users design online by uploading content to the Prezi server. All versions allow you to use the simple editor; download your presentations and show them from your computer; create groups to share and collaborate with; import images, videos, PDFs, and Flash files; and embed presentations into blogs and websites.

Prezi is easy to use but when putting together a presentation, I found it sometimes took several seconds to respond while moving or resizing an object. Even with its few glitches, Prezi is a unique tool you’ll want to consider adding to your toolset.—Cyndy Cashman

Company: Prezi
Price: Approx. $176/year (Pro)
Web: www.prezi.com
Rating: 4.5

Hot: Innovative; easy to use; affordable
Not: Occasional slow response

If Dreamweaver is your main website-development tool, you’ll want to give FusionCharts for Dreamweaver a test run. This extension installs in the Dreamweaver Insert panel and provides a user-friendly interface for creating animated, colorful, interactive, and data-driven charts.

If you don’t like looking at code, you’ll appreciate the ability to add interactive, animated Flash charts to a webpage without ever leaving Design view. The FusionCharts interface contains three tabs: Data Grid, Chart Selection, and General Options. The Data Grid tab allows you to manually enter data or import it from either a CSV or XML file. The Chart Selection tab displays 34 types of 2D and 3D charts from which to choose. The Advanced button expands the panel to display an array of menus that allow you to customize almost every aspect of your chart. The last tab, General Options, provides settings for specifying your chart’s dimensions, font size, adding labels, and more.

One of my favorite features is the integrated preview. The Preview button is always available so you can view your changes before the final chart is published. If you accidentally click the OK button before you mean to, you only have to select the chart in the HTML page and click the Edit Chart button.

I found FusionCharts for Dreamweaver easy to use and was impressed with the hundreds of presets and styles. The online documentation loads quickly and is easy to understand. The gallery of examples is inspiring. While there are other chart-building applications available, it’s worth your time to download a trial copy.

FusionCharts for Dreamweaver is available in Designer and Developer Editions. The Designer Edition, which was used for this review, is for users who want to create animated charts without writing code. The Developer Edition is for developers who develop database-driven websites.—Cyndy Cashman

Company: Extend Studio
Price: Approx. $87.07
Web: www.extendstudio.com
Rating: 5

Hot: Easy to use and affordable
Not:

Attention Flash designers: Have you ever wished you could include interactive 3D objects in a Flash movie or game without having to be an ace programmer? If this describes you, then you’ll want to check out FreeSpin3D. This easy-to-use Flash component allows you to import and control 3D models in a Flash document.

FreeSpin3D’s clear-cut control panel makes rotating and animating 3D objects in your Flash movie painless. The program’s real magic, though, is how easy it is to add mouse and keyboard commands that allow the user to control an object. Adding user interaction is as easy as selecting a 3D object on the Stage, checking Keyboard Control in the control panel, and clicking the Plus button to open the Behaviors dialog. The window contains a drop-down menu listing four types of behaviors: BasicRotation, Freefall, Movement, and Sticky Object. The behaviors Freefall and Movement each contain motion presets such as Fall and Bounce and Fly.

Depending on the behavior selected, you can change values for the x- and y-axes, z-space, speed, acceleration, as well as customize the keyboard selection for the types of movement. Once you’ve made your selections and given the object an Instance name, FreeSpin3D writes the ActionScript 3 code needed to control the object. Editing the texture of a model is as simple as opening the object’s symbol source folder in the Flash Library and locating and editing the texture JPEG files in Photoshop.

At the time of this review, FreeSpin3D was only available for Flash CS3. However, according to company CEO, Amir Fischer, an updated version with additional features is in the testing phase and will soon be available for CS4.—Cyndy Cashman

Company: Revolver animation & game technologies Ltd.
Price: $299
Web: www.freespin3d.com
Rating: 5

Hot: Easy to add interactive 3D objects without knowing ActionScript 3
Not:

Creating attractive animated Flash charts is unbelievably easy with Dynamic Web Charts. Using this inexpensive Dreamweaver extension, you can easily create static charts by manually entering data, or dynamic charts that pull data from a database.

Installing Dynamic Web Charts is quick using the Dreamweaver Extension Manager. After installation, Dynamic Web Charts is easy to locate in the Dreamweaver interface via the newly created Insert tab labeled WebAssist. Alternately, you can access it by choosing Insert>WebAssist>Dynamic Web Charts>Dynamic Web Charts. (I’d rather use the tab menus.) Supporting files include an easy-to-follow Getting Started Guide and dynamic chart solution recipe files for PHP, ASP (VBScript or JavaScript), and ColdFusion.

The Dynamic Charts Editor walks you through the step-by-step process for creating either static or dynamic charts. After choosing a style from a list of preset styles (that you can customize) and selecting the type of chart from the drop-down menu, you’re ready to create either a static or dynamic data chart. If you choose static, you can enter your data or import a CVS file to build you chart. If you choose dynamic, the wizard displays a series of menus and fields, allowing you to point-and-click to select grouping, range, and calculation controls. Based on your selections, Dynamic Web Charts creates the SQL to display your data. Advanced users familiar with XML will appreciate the XML Editor that allows you to edit chart nodes, combine multiple charts, and customize output.

I found Dynamic Web Charts easy to use and was impressed by how quickly it generates charts. Whether you’re an advanced or new Web designer, Macintosh or PC user, I think you’ll find Dynamic Web Charts a valuable tool you’ll want to consider adding to your Web development toolbox.—Cyndy Cashman

PRICE: $49.99
FROM: WebAssist.com Corporation
WEB: www.webassist.com
RATING: 5

LAYERS VERDICT
HOT Easy to use and affordable
NOT

CSS guru Eric Meyer, in collaboration with WebAssist, has released CSS Sculptor for Dreamweaver. This easy-to-use extension makes creating CSS layouts in Dreamweaver a snap. The last two releases of Dreamweaver included CSS templates; however, users needed an in-depth knowledge of CSS to modify the layouts. Enter CSS Sculptor!

This template-based application makes it easier for both designers and programmers to quickly design CSS layout. It’s easy to install this extension using the Manage Extension Command in Dreamweaver, and then the application is launched by choosing File>New CSS Sculptor Page.

The interface contains six tabs: Layout, Box, Type, Design, Print, and Output. Each tab’s screen contains controls for customizing the look of the final page. Layout (the first tab) contains 41 different CSS layouts, including one-, two-, and three-column static, elastic, fluid, fixed, and hybrid layouts with optional header and footers. Users can select from the included color schemes or create their own. The ability to customize almost all aspects of a layout from margins and padding to borders and colors is a welcome attribute.

I have to say that when I initially opened the program, I was skeptical of how useful it would be…but I quickly changed my mind. CSS Sculptor allowed me to generate a custom layout for a client that conformed to Web standards, was accessible, and best of all, contained the code necessary to correctly display pages in Firefox, Safari, and Internet Explorer. CSS Sculptor is one of those programs where you might find yourself saying, “I don’t know how I got anything done without it!”—Cyndy Cashman

PRICE: $99.99
FROM: WebAssist.com Corporation
WEB: www.webassist.com
RATING: 5

LAYERS VERDICT
HOT Cross-browser compatibility
NOT

If you’ve ever wanted to add a professional-quality, animated banner to a website or blog, you’ll want to check out BannerZest from Aquafadas. This theme-based animation software makes it easy to quickly add Flash-based slide shows and animated banners without owning or knowing anything about Flash. BannerZest is available in two flavors: Standard or Pro. This review is based on experiences using the Pro version.

Creating a Flash banner using BannerZest is surprisingly quick and easy. Upon launching the program, the first thing you’ll see is a designated drag-and-drop area. To create a banner, you must first select your images and drag-and-drop them onto the designated area. This action launches an Inspector panel that allows you to choose the layout and type of animation from a list of 27 themes. Once you select a theme, you can adjust most of the theme’s attributes, such as dimensions, background colors, gradients, borders, fonts, and transitions. Even though you must use a theme to create a banner, adjusting the settings allows you to create a custom look. Adding a URL link to the banner images is easy using the Media panel tools.

The final step is to publish the banner. The Publish settings allow you to specify whether you want to publish the banner to a Web server or a local directory. Clicking the Show HTML button opens a window containing the code needed to integrate the banner on a server. Clicking the Show Banner button opens an HTML page displaying the banner.—Cyndy Cashman

PRICE: $129 Pro ($49 Standard)
FROM: Aquafadas SAS
WEB: www.aquafadas.com
RATING: 5

LAYERS VERDICT
HOT Easy to use; ability to customize settings
NOT

Step 1. Create a Flash Document

Launch Flash. On the welcome screen click Flash File (ActionScript 3.0). It’s located under the Create New column. Choose Window > Workspace > Default to open the panels you’ll be using. In the Properties panel enter 15 in the Frame Rate field. Click the Background color swatch and select black for the background color.

Step 2. Setting up the Timeline

Insert two layers in the Timeline by clicking the Insert Layer button. Starting with the top layer, name the layers: actions, flowers, and text. Extend the Timeline by selecting Frame 25 in all of the layers and pressing F5.

In the actions layer insert a Keyframe (F6) in Frames 2, 5, 12, and 20. Next, starting with Frame 2, label each frame respectively: hut, lily, paradise, and cone. To label a frame first select it. In the Properties panel enter the name of the label in the Frame Label field.

Step 3. Creating Symbols

The flower and hut images were created using the built-in symbols from Illustrator CS3. You can draw your own images in Flash or import them from another program. If you choose to import images, select the flowers layer and choose File > Import to Stage. If you choose to draw your images select the flowers layer before you start drawing. Draw a hut or building and three different flowers. The flowers used in the tutorial are cone, lily, and paradise.

Next, convert all of the images to a Button symbol. Start by selecting a flower and pressing F8 to open the Convert to Symbol dialog. Enter cone in the Name field, select Button for the type and click OK. Double-click the symbol to edit its Timeline. Insert a Keyframe (F6) in the Hit frame. Using the Rectangle tool (R) specify the hit area by drawing a filled rectangle over the flower. Return to the Main Timeline by clicking the Scene 1 button. Repeat this process to convert the rest of the images to buttons.

Step 4. Naming Button Instances

An Instance must have a name before Actionscript can be used to control it. The Instance names for the flowers are cone, lily, and paradise. If you choose to use different names, you’ll need to use the Instance names you assigned when you add Actionscript.

On the Stage select the coneflower button. In the Properties panel enter “cone” in the Instance name field. Select the paradise flower button and enter “paradise” in the Instance name field. Repeat the process for the lily and hut buttons. Arrange the buttons on the Stage as seen in Step 2’s graphic.

Step 5. Adding Text

Move the Playback head to Frame 1. Click the text layer to select it. Use the Text tool (T) and select a font and color from the Properties panel. Using the font and color of your choice type the name of your garden center and suggest the user try some perennials.

Step 6. Arranging the Screens

Move the Playback head to Frame 5 (lily). Select both the flowers and text layers and insert a Keyframe(F6) Arrange the buttons on the Stage as shown in the graphic. Rewrite the text on the text layer to describe the lily. Place an Instance of the lily button on the right side of the screen. With button still selected choose Graphic from the dropdown menu in the Properties panel.

Repeat this procedure to change the contents in Frame 12 (paradise) and frame 20 (cone). Warning, if you forget to change the behavior from button to graphic your movie will not work as expected after you’ve added the ActionScript. Flash will also display a warning and error description in the Output panel.

The movie should stay on the first frame until the viewer clicks a flower. However, without a stop action in the first frame of the Timeline the movie automatically plays. We’ll fix this now.

Select the first Keyframe of the actions layer. Choose Window > Actions or press F9 to open the Actions panel. Make sure the Script Assist is turned off. In the Script pane, type stop();

Step 7. Adding ActionScript

Select Frame 1 of the actions layer. In the Script pane add the following: (You should already have stop(); in the pane.)

Test your movie by choosing Control > Test Movie.

In ActionScript 3 event listeners and handlers are used to control interactions. In our movie we created a function, event listeners to listen for when the user clicks the mouse and an event handler to perform an action when the mouse is clicked.

Experienced Flash designers and beginners alike will want to consider adding Eltima’s Flash Decompiler Trillix to their collection of Mac OS X utilities. This easy-to-use tool decompiles SWF files and converts them to either Flash documents or extracts the contents and organizes it into a collection of Flash objects.

The program contains two control screens: one for converting a SWF file to an FLA document and the other for extracting its contents to objects. The Window menu allows you to select the simple or advanced mode for both screens. The simple modes for both screens contain fields to enter the SWF filename and the destination filename. It also has a button that allows you to navigate to the file’s location on your computer where you want the destination file saved. The advanced screens contain lists of settings allowing you to control how the movie’s content will be converted or extracted. The conversion screen’s built-in setting description field provides helpful explanations for each setting. In contrast, the extract screen’s settings require a visit to the Help files to determine the best settings.

How accurately the program converts or extracts the contents depends on the complexity of a file’s contents. Currently, the program supports ActionScript 1.0 and 2.0 and SWF files created with Flash up to version 8. While none of the files I converted functioned flawlessly, I was able to edit the resulting files and restore functionality. If you’ve ever deleted a Flash document you thought you wouldn’t need again only to have a client come back and ask you to update a movie, Flash Decompiler Trillix is a must-have tool.— Cyndy Cashman

PRICE: $79.95
FROM: Eltima Software
EMAIL: sales@eltima.com
WEB: www.eltima.com
FOR: Mac
RATING: 4

LAYERS VERDICT
HOT Easy to use and affordable
NOT Converted files may not work same as source file

Traditionally when a movie clip instance containing a vector shape is scaled up or down in Flash, it is scaled both horizontally and vertically. Sometimes scaling geometric shapes, such as rectangles with curved corners, can yield some pretty ugly results. You can avoid an ugly mess by using Flash CS3’s 9-slice scaling allows you to specify the areas of a movie clip to scale.

Step 1. Draw a rectangle

Select the Rectangle Primitive tool from the Tool panel. Draw a rectangle on the Stage while pressing the Up Arrow. Release the mouse button when you are satisfied with the size of your rectangle. The rectangle’s corners will be inverted. If you prefer to draw a rectangle with rounded corners, press the Down Arrow while clicking-and-dragging. You can also switch between pressing the down and up arrow as you draw to modify the corner radiuses.

To change the corner radius after releasing the mouse, switch to the Selection tool (V). Select the rectangle and change the corner radius in the Properties Inspector.

[Tip: When you use the Rectangle Primitive tool to draw a shape, you can select it again and use the settings in the Properties Inspector to change its shape.]

Step 2. Convert to a symbol

To apply 9-slice scaling an object must be converted to a Movie clip Symbol.

Select the rectangle then Right-mouse click. Choose Convert to Symbol from the menu. The Convert to Symbol dialog will open. Enter a name and select Movie clip for the type. Click the Advanced button. At the bottom of the window click the checkbox next to Enable guides for 9-slice scaling. Click OK to close the window.

Step 3. Working with slice guides

Open the Library panel if it isn’t already open. You can open the panel by pressing Command + L (PC: Control + L) Select your Movie clip. Notice the symbol’s slice guides are displayed in the Library Preview area. Double-click the Movie clip icon in the Library. This will open the Symbol in its editing mode. Reposition the guides so that the corners are outside the guides. This tells Flash not to scale the corners. Click the Scene 1 button to return to Scene 1.

Step 4. Scale

Select the Free Transform tool (Q) in the Tool Panel. Click on the Instance of the Movie clip rectangle on the Stage. Click the Scale button in the Tool Panel. Click-and-drag a corner point outward to make the rectangle larger. Notice the radiuses of the four corners do not scale. Try scaling the rectangle down. Only the parts of the rectangle inside the slice guides scale.

Hope this helps!

Step 1: Draw the calculator

Use the rectangle tool (R) to draw a filled rectangle the shape of a calculator. Lock layer 1 by clicking the circle under the lock. Next, insert a new layer. It will automatically be named layer 2.

Step 2: Add text

Click in the first frame of layer 2 to select it. Switch to the Text tool (T). Type “Simple Calculator”, “First Number”, “Second Number”, and “Total” on the Stage.

Step 3: Draw input fields

Input fields are used to store information entered by the user. In this step we’ll draw two input fields for the user to enter numbers.

With the Text tool still selected choose Input Text in the Properties panel and click the Show border around text button. Select Arial for the font and 18 for the font size. Choose a font color other than white from the color swatch menu.

Click and drag the Text tool on the Stage to draw an input text field. Switch to the Selection tool (V). Select the input field and choose Edit > Duplicate or use the keyboard shortcut Command + D (PC: Control + D). Drag one field to the right of the label “First Number” and the other to the right of the label “Second Number”.

Step 4: Add variables

A variable is a container that holds data. When the user enters a number in the input field the data is stored in a variable. In this step we’ll give each input field a variable name.

Select the input field next to “First Number”. In the Properties panel enter “firstnumber” in the Var field. Next, select the input field next to “Second Number”. In the Properties panel enter “secondnumber” in the Var field.

Step 5: Draw a dynamic field

Dynamic text fields are used to display information derived from variables. We’ll use a dynamic text field to display the calculator’s results.

Select the Text tool (T) and choose Dynamic Text in the Properties panel. Click and drag the Text tool on the Stage to draw a dynamic text field. Switch to the Selection tool (V). In the Properties panel enter “total” in the Var field.

Step 6: Create buttons

We want the calculator to be able to add or subtract. Create two button symbols. Create one button for addition and one button for subtraction. Place both buttons on the Stage.

Step 7: Adding numbers

In this step we’ll use the variable names to add the contents of the two input fields and display the results in the dynamic field. Using the term Number in front of the name of each variable tells Flash that the variable’s content is a number.

Select the plus button. Open the Actions editor (F9). Enter the following script:

on (release) {
total = Number(firstnumber) + Number(secondnumber);
}

Step 8: Subtracting numbers

Select the minus button. Open the Actions editor (F9). Enter the following script:

on (release) {
total = Number(firstnumber) - Number(secondnumber);
}

Step 9: Test the movie

Test the movie by choosing Control > Test movie. Enter numbers in the “First Number” and “Second Number” fields. Click either the plus to add the two numbers or the minus button to subtract the second number from the first. The answer will display in the “Total” field.

And that’s it; a quick and simple Flash calculator.

LipSync MX v2.0.3 is one of those rare programs that makes you want to call your friends and say, “You’ve got to try this!” Designed for creating “…high-quality lip-sync animations for Flash,” LipSync MX lives up to its claim. The program is based on the association of phonemes (the smallest distinguishable unit of speech) with corresponding visemes (mouth positions). Even though the program can recognize 40 different phonemes, it’s impractical to include 40 different mouth positions in an animation. Instead, LipSync splits phonemes into nine families and corresponding visemes; for example, the mouth position is the same for the letters M, B, and P; F and V; etc. The male and female default visemes sets included with the program are easy to modify to fit your characters, or you can create your own from scratch.
For such a powerful program, the interface is amazingly simple. The Quick Actions located on the left side of the screen contains four buttons that walk you through the four steps used to create a SWF file. The SWF file, which is exported, contains a frame-by-frame animation of the character talking. To use the animation, you import the SWF file and the audio file into your Flash document and set the Sync to Stream. I tested a 40-second audio clip containing a number of technical terms. I was amazed at the synchronization quality. In the past, I have looked at other products, but found them too time-consuming or complex. Or, they required hosting on their servers. In contrast, LipSync MX is easy to use; affordable; performs amazingly fast synchronization; and, maybe just as important, is fun to use. Now, if they’d just make a Macintosh version.—Cyndy Cashman

PRICE: $99
FROM: Di-O-Matic, Inc.
PHONE: 514-369-2400
WEB: www.lipsync-mx.com
FOR: Windows
RATING: 5

LAYERS VERDICT
HOT Easy to use, fast, and affordable
NOT

A visual cue will help draw people into checking out your images. Get website visitors to explore your pictures by having the image come into focus when it is rolled over.

This simple technique entices users to spend more time exploring your site. In this tutorial I’ll show you how to create the focus effect using a Movie clip Symbol.

Before beginning you may want to scroll to the bottom of the page to see the finished project.

This tutorial assumes you have basic Flash skills including using the drawing tools, Properties Panel, Color Panel, and Actions Editor to add a "stop" action to a frame in a Timeline.

Step 1. Create a Movie Clip

Create a new Flash Document and save it. In the Properties panel enter 15 in the Frame rate field. Use Flash’s default size for the Stage, or click the Size button and enter your own dimensions. Click OK to return to the Timeline.

Instead of creating the animation on the Main Timeline, we’ll use a Movie clip Symbol. Using a Movie clip to hold the animation makes it easy to duplicate and use the effect for additional images.

Choose Insert > New Symbol. The Insert New Symbol window will open. Enter “display” in the Name field and select Move clip for the Type. Click OK.

Step 2. Import and Convert an Image

Choose File > Import > Import to Stage. Select the image on the Stage and convert it to a Movie clip (Control-click [PC: Right-click] and choose Convert to Symbol). Enter “display content” in the Name field and select Move clip for the Type. Click OK. You’ve just created a nested Movie clip.

Note: In pre Flash 8 days you would have had to create two copies of the same image and added a blur filter in an image-editing program. No more. Flash 8 includes a blur filter. Now instead of two images we only need one. The trick is to convert the image to a Movie clip Symbol, then apply the blur filter. Filter effects cannot be added to Graphic Symbols.

Step 3. Add a Blur

Use the Selection tool (V) to select the Instance of “display contents” on the Stage. Select the Filters tab in the Properties panel. Enter 10 in the Blur X and Blur Y fields. Select High from the Quality menu.

Step 4. Add Keyframes

Insert Keyframes in Frames 15 and 30 (F6). Select the Instance of “display content” in Frame 15. In the Properties panel click the Minus button to remove the filter.

Step 5. Add Motion Tweening

Select Frame 1. Hold down the Shift key and click on Frame 15. Control-click [PC: Right-click] and choose Create Motion Tween from the menu.

Step 6. Add a Button

Insert a new layer. Rename the layer button. Select the Rectangle tool. Draw a filled rectangle large enough to cover the image. The fill color doesn’t matter. Select the rectangle on the Stage and convert it to a Movie clip (Control-click [PC: Right-click] and choose Convert to Symbol). Enter “invisible” in the Name field and Button for the Type. Click OK.

Double-click the button to edit its Timeline. Click the Keyframe in the Up frame to select it. Next, click-and-drag the Keyframe to the Hit frame, then release the mouse button. Click “display” at the top of the Timeline to return to the “display” Timeline. The button is no longer the fill color you used but has changed to aqua. The button will be invisible when you publish your movie.

Step 7. In Focus

Insert a Keyframe in Frames 15 and 30 of the “button” layer. Move the Playback head to Frame 1. Select the Instance of the button. Open the Actions editor. Turn on Script Assist by clicking the Script Assist button. Click the Plus button and choose Global Functions > Timeline Control > play. Click the first line to select the script. Uncheck “Release” and check “On Roll Over”.

Step 8. Return to Blur

Move the Playback head to Frame 30. Select the Instance of the button. Open the Actions editor. Turn on Script Assist by clicking the Script Assist button. Click the Plus button and choose Global Functions > Timeline Control > play. Click the first line to select the script. Uncheck “Release” and check “On Roll Out”.

Step 9. Timeline Actions

Insert a new layer above the “button” layer. Rename the layer “actions”. Select Frame 1. Open the Actions Editor. Click the Plus button and choose Global Functions > Timeline Control > stop. Insert a Keyframe (F6) in Frame 15 and add another stop action.

Insert a Keyframe (F6) in Frame 30. In the Actions Editor click the Plus button and choose Global Functions > Timeline Control > goto. Click the Radio button next to “Go to and Stop”. Leave the default settings of Type: Frame Number and Frame: 1.

Step 10. Main Timeline Action

Click the Scene 1 button located at the top of the Timeline to return to the Main Timeline. Insert a new layer and rename it “actions”. Select Frame 1. Open the Actions Editor. Click the Plus button and choose Global Functions > Timeline Control > stop.

Step 11. Add Display Instance

Open the Library (Command-L [PC: Control-L]). Drag an Instance of “display” onto the Stage. Choose Control > Test Movie. Roll your mouse over the image to bring it into focus. When you roll your mouse off of the image it will become blurred again.

Step 12. Stay In Focus Option

If you don’t want the image to return to its blurry state, open the “display” Movie clip and remove Frames 16 – 30. Then remove Keyframe 15 in the “button” layer by selecting the Keyframe then Control-click [PC: Right-click] and choose Clear Keyframe.

Enjoy!