Content on this page requires a newer version of Adobe Flash Player.

Get Adobe Flash player


Summary:

Expanding & Contracting Sphere in Flash

    ●  Shape Tweens are one of the most interesting effects you can accomplish with Flash.

    ●  Shape Tweens can be very effective in communicating a story or concept, especially if used to convey transformation or motion.

    ●  They work with text, images and vector drawings.


Learn About:

Introduction to Movie Clips Classic Tweens Shape Tweens Filters Movie Clips

• This tutorial is part of the Aesop's Fables and Drag and Drop Projects.

Other People's Work:

Here are examples of work inspired by this tutorial.

Content on this page requires a newer version of Adobe Flash Player.

Get Adobe Flash player

Content on this page requires a newer version of Adobe Flash Player.

Get Adobe Flash player

Content on this page requires a newer version of Adobe Flash Player.

Get Adobe Flash player

Content on this page requires a newer version of Adobe Flash Player.

Get Adobe Flash player

Content on this page requires a newer version of Adobe Flash Player.

Get Adobe Flash player

Content on this page requires a newer version of Adobe Flash Player.

Get Adobe Flash player

Content on this page requires a newer version of Adobe Flash Player.

Get Adobe Flash player

Content on this page requires a newer version of Adobe Flash Player.

Get Adobe Flash player

Content on this page requires a newer version of Adobe Flash Player.

Get Adobe Flash player

Step #1: Open Your Project in Flash ~

Open YOUR PROJECT in Flash

 

 

… (Remember: all these tutorials are intended to be
applied to YOUR PROJECT) …

… make a New Layer, and lock lock your other layers.

new layer


Step #2: Select the Oval Tool ~

Get the Oval Tool which is behind the Rectangle Tool or hit the keyboard shortcut letter (o) …


Step #3: Stroke Color ~

Go to: Window > Color or hit the keyboard shortcut letters: Cmd(⌘)+Shift(⇧)+F9

+ +

… click on stroke …

… and set the stroke color to none = null


Step #4: Fill Color ~

Click on Fill Color

… and select Radial as the Fill Style.


Step #5: Set the Gradient Color ~

Double-Click on the "image" on the left and choose an orange color.

Then, choose a Darker color for the other side.


The idea is to lower the Value of one side so it's a darker color, like this:

Content on this page requires a newer version of Adobe Flash Player.

Get Adobe Flash player


Step #6: Make a Sphere ~

Select the Oval Tool, hold Shift down and drag out a circle.

Content on this page requires a newer version of Adobe Flash Player.

Get Adobe Flash player

Holding Shift keeps the circle perfectly round …


Step #7: Adjust the Gradient ~

Select the Gradient Transform Tool by hitting the keyboard shortcut letter: (f) …

 

Click and drag like this …

Content on this page requires a newer version of Adobe Flash Player.

Get Adobe Flash player

Use the handles to rotate the gradient and shrink it if necessary.


Step #8: Make a Movie Clip ~

Get the Selection Tool or hit the keyboard shortcut letter (v) …


double-click on the sun.

Content on this page requires a newer version of Adobe Flash Player.

Get Adobe Flash player


Hit f8(or Right-Click and select: ) and make a Movie Clip.

Content on this page requires a newer version of Adobe Flash Player.

Get Adobe Flash player


Step #9: Double Click on the Movie Clip AGAIN ~

Double-click on the new symbol AGAIN to edit it.


Now you are working INSIDE the Movie Clip.
movie within a movie

Remember: A Movie Clip is a movie WITHIN a movie.

Content on this page requires a newer version of Adobe Flash Player.

Get Adobe Flash player


Right-Click on approximately frame 10 or 15 and Insert Keyframe

Content on this page requires a newer version of Adobe Flash Player.

Get Adobe Flash player


Step #10: Make the Sun Bigger ~

Then select the Free Transform Tool or hit the keyboard shortcut letter (Q) …


… hold the Shift key down and make the shape a little bigger:

Content on this page requires a newer version of Adobe Flash Player.

Get Adobe Flash player


Step #11: Motion Tween ~

Right-Click between keyframes 1 and 15 - select "Create Classic Tween"

Content on this page requires a newer version of Adobe Flash Player.

Get Adobe Flash player


… and hit the keyboard shortcut: Cmd(⌘)+Enter to view your work!

Content on this page requires a newer version of Adobe Flash Player.

Get Adobe Flash player



Step #12: Make it go Backwards ~

Now go back to Frame 1 keyframe - Right-Click and select Copy Frames

Content on this page requires a newer version of Adobe Flash Player.

Get Adobe Flash player

… click on Frame 30 (or twice the distance from Frame 1) …

… Right-Click and Paste Frames.

Content on this page requires a newer version of Adobe Flash Player.

Get Adobe Flash player

Lastly, Right-Click between frame 15 and 30, and select Create Classic Tween.

create-classic-tween.jpg


Step #13: Filters ~

Go back to Scene 1 …

Content on this page requires a newer version of Adobe Flash Player.

Get Adobe Flash player

… go to: Window > Properties > Filters & add Drop Shadow - Bevel and any thing else that looks good to you …

Content on this page requires a newer version of Adobe Flash Player.

Get Adobe Flash player

… add Bevel too.

Content on this page requires a newer version of Adobe Flash Player.

Get Adobe Flash player


Hit the keyboard shortcut: Cmd(⌘)+Enter to view your work!


Last Step: Save and Attach ~

Save your work as - FIRST_NAME_LAST_NAME_PROJECT_NAME.fla]

Content on this page requires a newer version of Adobe Flash Player.

Get Adobe Flash player

 

•   ALWAYS save your projects using the following naming convention:
FIRST_NAME_LAST_NAME_PROJECT_NAME


  •   DO NOT name your project any other way - Improperly named projects will not receive credit and you will be sad.


  •   NEVER leave your work on the desktop or depend on a flash drive - instead, save your work in a folder you can find later - preferably on a virtual drive where it can be backed up.