Flash Ecard Projects
ActionScript and Script Assist Button
Now we will code our button. This code will tell Flash to listen for a mouse event, such as our button being clicked. Then we will write a function to tell Flash what to do when the button is clicked. Our function will tell Flash to go back to the first frame and play the animation again.
ActionScript to Load External SWF
Let's add the ActionScript that will load the external ecard swf into our Flash intro swf.
Add ActionScript to Button for Envelope Animation
We will add ActionScript to our button. This code will tell Flash to stop the animation on Frame 80 and listen for the button to be clicked. When the button is clicked, the ActionScript will move the animation on to Frame 81 and the second half of the animation.
Animated Palm Trees from Raster Graphics
Raster graphics can be a challenge when creating animation. Here's how to animated palm trees in Flash CS5.
Balloon - Rectangle Primitive Tool Rounded Corners
To create a text balloon movie clip with rounded corners we can use the Rectangle Primitive tool.
Create a Backwards Tween in Flash CS4
Flipping the envelope. This looks like a difficult animation but in reality it is very simple. We will use two movie clips to make it appear that the envelope has flipped over.
Creating a Button in Flash CS4 – eCard Project
In this tutorial, we will create a button symbol from text. We will set the color of the text to a different color for each of the three rollover stages of our button.
Download and Install Sendcard
In this tutorial, we will download and install Sendcard on a local server for development and testing. This is the first step in developing our ecard website and Facebook app.
Drawing Envelopes with Flash Object Drawing Mode
Now that we have decided on the graphics for our envelope animation, we are ready to start drawing them. In the next few tutorials, we will learn about both of Flash’s drawing modes, adding filters and placing symbols in the Library.
Ecard Project - Finishing the Element List
Continuing on with our ecard project, we will get a little more practice with the Object Drawing mode and Flash filters as we draw the rest of our animation elements.
eCard Project - Flash CS4 Object-based Tweens
In this tutorial, we will continue to build the object-based tween model blinking lights animation for our eCard project.
eCard Project - Flash Script Assist Stop Action
We will continue to work on the eCard project in Flash CS4. We will use Script Assist to help us add the ActionScript stop code that will stop our animation after it plays through once.
eCard Project - Spray Brush Tool and Snow Tween
In this tutorial, we will add a snowfall to our animation. You will learn how to draw the snow with the new Spray Brush tool.
Ecard Shop Animation
At this point in our Flash project, we have our card shop filled with miniature cards. Now it's time to start the presentation of our artists. Each artist has a card on the shelf. We will animate each of these cards and display the artist's information in a text balloon.
Envelope Animation Motion Path
Now that we have our storyboard and design elements ready, we are going to start working on the first part of the ecard envelope animation. The first thing we will do is make a motion path.
Fade-in Effect for Text in Flash CS4 Ecard Project
In this tutorial, we will continue working on the envelope animation for our Flash ecard project. We have already built the fly-in tween that moves the envelope onto the center of the stage. Now, we will create the fade-in animation for the Click on Stamp text message.
Flash CS4 Button UI Component
We will use the Flash UI button component to add a Replay button to our eCard.
Flash CS4 eCard - Project Set Up
In this tutorial, we will create an eCard with Flash CS4. The card will have flickering Xmas lights. We will use the new object-based tween animation model to create the blinking lights animation.
Flash CS4 Merge Drawing Mode
In this tutorial, we will draw the back of our envelope and cut out a triangular opening. Because we need to cut out the triangle shape from the rectangular envelope shape, this is a good time to use the Merge Drawing mode in Flash.
Flash CS5 Animated Butterfly
How to animated a raster butterfly image in Flash CS5.
Flash CS5 Palm Tree Animation
We will use Motion Tweens to animate the palm trees in Flash.
Flash Ecard Server Software
If you are starting your own Flash ecard service, there are a few things that you will need besides a copy of Adobe Flash. Besides creating the Flash animation for a Flash ecard, you will need a program that will run your ecard service. You have several choices for your ecard server software.
Flash Fly-in Effect for Envelope Animation
We will continue with the object-based tween that we started in the previous tutorial to make our envelope fly onto the screen, while flipping and rotating. It will stop in the center of the stage.
Flash Intro - Flip the Envelope Flap
For our Flash intro animation, we will be flipping the envelope flap upward to open the envelope and reveal our thumbnail image of the ecard.
Flash Product Tour Project - Layout
How to plan the layout for a Flash product tour application.
Grouping Elements for Animation in Flash CS4
We will continue to work on the envelope intro for our ecard in Flash CS4. Our next step is to setup the stage and the elements that we will animate to make it appear that the envelope flips over on to its back in anticipation for opening.
Grouping Movie Clips for Easier Flash Intro
Grouping movie clips and shapes together is one way to simplify your animation in Flash CS4.
Invisible Button for the Envelope Animation
Now we are to the point in our project where we will add the button which we will program to trigger the second half of the envelope animation. We will make an invisible button and put it right over the top of the stamp.
Main FLA - Flash Product Tour Project
For the Product Tour our next step is to decide if we want to create the entire project in one big fla file or create each section of the Product Tour as its own fla.
Planning Your Ecard Project - Storyboard
Flash skills from drawing vector shapes and applying filters to animating with the new object-based Flash animation and loading the main ecard animation as an external swf. This project will be an intro animation with design elements that can be customized to match any ecard.
Preparing to Open the Envelope
Now that we have flipped our envelope to reveal the back side, we will get ready to open the top flap to reveal the card inside.
Product Tour Text Balloon Animation
Now we will add the motion tween for our text balloon animation in our Flash Product Tour project.
Program Button with ActionScript and Script Assist
Now we will code our button. This code will tell Flash to listen for a mouse event, such as our button being clicked. Then we will write a function to tell Flash what to do when the button is clicked. Our function will tell Flash to go back to the first frame and play the animation again.
Sendcard Admin Area and Plugins
In the last tutorial, we installed Sendcard on our local computer for testing and development. But we still have some free plugins to consider.
Sendcard Ecard Script for Flash Ecard Site
In the next few articles, I will show you how to setup and run an ecard website with the free Sendcard ecard script by Peter Bowyer. After we get Sendcard working as a website, we will convert it into a Facebook app.
Setup to Load External SWF
Finally, we have come to the end of our journey. We have built the intro swf for our ecard and we are ready to load the external ecard swf into our Flash intro swf.
Soundbooth and Flash
One of the drawbacks of using royalty free mp3 is that sometimes these files are very large. There are a few solutions to this problem that even the novice can manage.
Storyboard for Section One of Product Tour Project
Now that we have the storyboard and overall concept for our virtual card shop, it's time to build it.
Using Flash Filters and Filter Preset Library
Now that we have drawn the objects for the envelope and stamp, we can add a few extra touches to make the envelope look more realistic. In this tutorial, you will learn how to apply Flash filters to our envelope and store our custom filter in the Preset Library.
Top Ten Articles
Previous Features
Site Map
Follow @ArtAnimationTut
Tweet
Content copyright © 2018 by . All rights reserved.
This content was written by . If you wish to use this content in any manner, you need written permission. Contact Diane Cipollo for details.