Featured Tutorials

adobe,photoshop,panorama,panoramic,images,photos,photo merge,merging,how to,automatic,automatically Panoramic images the easy way with Photoshop PhotoMerge

Panoramic images the easy way with Photoshop PhotoMerge

Creating Panoramic images from your photos is easier than you think, when you know how. So..

flash tutorials, fireworks, particle effects, flash animation,fireworks in flash,creating fireworks,fireworks movie,fireworks display,how to create fireworks,flash fireworks tutorial,fireworks tutorial Flash Firework Frenzy

Flash Firework Frenzy

Create a realistic particle based firework display using Flash. This technique was once us..

swift3d,3D,sci-fi,flash animation,3d flash,swift 3D,flash city,future city,future city model,3d city model,3d city,3ds max,brazil renderer,futuristic city,future world Futuristic city, 3D techniques in Flash

Futuristic city, 3D techniques in Flash

See the tricks behing the advanced Flash animation that was used to bring this futuristic ..

flash tutorials, animated eyes, follow mouse, interactivity,eyes in flash,eyes that follow,eye tracking,animate eyes,photos of eyes,womans eyes Realistic Eye Animation

Realistic Eye Animation

Create animated eyes that blink, wink and following the mouse pointer using Flash...

download, textures, 3D modeling, futuristic, buildings, space ships,free textures,space textures,wall textures,texture download Futuristic Texture Pack

Futuristic Texture Pack

A collection of futurstic textures used in the Future city project...

Featured Videos

A very cool tutorial on one of Photoshop CS3's fancy new tools, t..

This tutorial will teach you how to create huge print resolution ..

Learn how to create 3d spinning animated text with thie Swift 3D ..

This speed painting video is a great way to see how you would go ..

Some amazing footage of how Photoshop can be used to great effect..

Realistic Animated Eyes in Adobe Flash

Learn how to create realistic animated eyes that follow the mouse, blink and even wink in flash, great for a splash page or intro

Please Scroll Down after changing page

Download the FLA source file for this tutorial / wipeout44_eyes.zip / Flash 8


The first step is to choose your eye images, I found this selection on a FREE stock photo website which was perfect for what I needed. (Alternatively you could also use a picture of a friends face ha ha)


Open you're chosen image in Adobe Photoshop and resize it using the Image -> Image Size option to your required width and height, for mine it was width 670 x height 200.


Then use the Polygon Select Tool to select the inside area of the eye then use the delete brush to carefully remove the iris/pupil area of the eye. Then save this file with the File -> Save for Web option then select JPG from the right dropdown with a quality setting of about 85 and save the file as eyes.jpg


Next open up your chosen eye image (to find my version I did various searches on google and some FREE stock photo sites, but you can download my versions in the downloads section) I decided to resize and save my iris as width 80 x height 80 pixels, I saved this image as a PNG with a transparent background, but you can save as a JPG if you wish.


Next load up Adobe Flash and Import your new images using the File -> Import option. Before importing the iris image be sure to create a new layer above the first and left click the first frame, this will import the second image into the new layer above the eye layer. Position the iris image to the right hand side over the inside eye area.


Left click on the iris image press CTRL + C to copy, then CTRL + V to paste . Now move this new copy over to the left hand side. Next make sure you have both of the images selected you can hold down the SHIFT key for this, then right click on either and select "Create Symbol" give them a name e.g. "moving_eyes" set them as a "Movie Clip" then click "OK"


Once you have created this symbol ensure that it is selected, then go down to the "Properties" panel and give this clip a global instance name (naming movies basically gives them the ability to be used in the world of action-script as in enables you to control or find the path of a movie from code, I will explain more as we go on) if you do not see a properties panel you can open it by going to the Window -> Properties menu.


Now double click on your new "moving_eyes" movieclip, this will take you into the movie clip timeline. Now you will need to perform the same steps again, i.e. click both of the iris images and create them as a symbol this time name them "eyes" and once created give them an instance name of "eyes" in the properties panel. This creates a main movie "moving_eyes" with another movie inside called "eyes"


Now you will need to create a mask for your new "eyes" movie, so create another layer above the first then use a standard brush tool to draw out the inside eye area (this will be the area where the eyes are visible) after you've done this for both the left and right eye right click on the layer name and select "Mask".


Now to complete the mask, you will need to click on the layer below that contains the "eyes" movie clip, then hold down the left mouse button and drag it up jus underneight the masked layer. The layer underneith should then change to a green icon, and you should end up with something simular to the image above.

In order to show the final masked effect in real-time, you will need to select the lock icon on both the mask and masked layers. (More flash tips)


Create a new layer, then right click on the first frame of this layer and click "Actions" then add the following code:

Frame (1)

startDrag("drag", true);
When entering custom action-script code into the script editor, you will need to turn off the "Script Assist" option. (More flash tips)


Now create two more keyframes on the top layer with the following code:

Frame (2) The _x)/12) numbers represent the amount of drag freedom, the (-12); numbers are the starting positions.

Frame (3)


Also make sure you extend the other layers to cover the 3 frames, simply right click and choose the "Insert frame" option

Page 1 of 3

 Subscribe to our feed

Send to a friend