How to create a button using Creative MovieFX

In this tutorial we will start from a shape in Flash – a simple rectangle – and, by using Creative MovieFX we will transform it into a button with just a few simple options.

Firstly I just want to remind you that, in order to be able to solve the tutorial, you will need the Creative MovieFX extension installed on your computer; if you encounter any problems while doing that, please visit the “How to install an extension” tutorial.

Click here to download the source file and the required files for solving this tutorial.

1. Let’s start by opening Flash and creating a new Flash file – ActionScript 3.0. Right click on the stage to open the Document Properties window. Name the file “How to create a button using Creative MovieFX”, set its dimensions to 380x100 pixels and the background color to white (#FFFFFF). Set the frame rate to 35 fps.

2. Extract the attached archive in the folder of your choice; open the “How to create a button using Creative MovieFX.fla” file and from the library of this file (open the Library panel using CTRL+L), copy the “button” movie clip to the library of your file.

3. Drag the “button” movie clip on the stage, at coordinates X=14, Y=11 – centered with respect to the stage.

4. From the Components panel (CTRL+F7), drag an instance of Creative MovieFX on the stage; following, open the component’s configuration interface from the top menu: Window>Other Panels>MovieFX Panel.

5. From the Time Manager, enable the Wait effect element, but leave the Delay, the In and Out effect elements disabled; also, make sure the Loop and Start Hidden options are disabled.

6. From the Wait Effect tab, select the None Effect Name; the duration of the Wait Effect element is not important as long as it’s positive (greater than 0).

7. From the Actions tab, the Rollover Effect section, select the Tint effect, set its duration to 20 frames; make sure the Load Preset Duration is disabled. In the Rollover Effect Parameters section, set the color to red (ff0000).

8. Let’s pass to the event-triggered actions section of the Actions tab. Let’s deal with the sound first; using the Flash top menu – File>Import>Import to Stage, import the sound file you found in the archive to your Flash file. In the Library of the file, right-click the sound file and select Linkage; enable the Export for ActionScript option and set the linkage identifier to something simple, such as “Sound”.

9. In the Creative TextFX interface, the Actions tab, the Event-triggered actions section, select option addSound. Set the Event Type to press and the Sound Library ID to “Sound” (the linkage identifier we previously set).

10. In the same place in the component interface, add the addURL action; set the Event Type to press, the target to “_blank” and the URL to “http://www.extendstudio.com”.

11. In the Filters tab, load the “Extend_extrude” preset, applying a Bevel filter to the button.

12. Press CTRL+Enter to preview your file.

Thank you for your time and I hope this tutorial was useful to you. I invite you to read the rest of our tutorials and check out our other products on www.extendstudio.com. If you have any questions or suggestions, please contact me at jon.stanciu@extendstudio.com.