Docstoc

Flash Tutorial

Document Sample
Flash Tutorial Powered By Docstoc
					                                          Animation using Flash



Contents
Opening Flash ................................................................................................................ 1
Flash Interface ................................................................................................................ 1
Timeline ......................................................................................................................... 3
Motion tween ................................................................................................................. 4
Shape tween ................................................................................................................... 7
Animation using symbols .............................................................................................. 9
Move ............................................................................................................................ 11
Change size .................................................................................................................. 12
Change colour .............................................................................................................. 14
Fade .............................................................................................................................. 15
Animation using timeline effects ................................................................................. 16



Opening Flash




                                                                                 1. Click on Flash File
                                                                                    (ActionScript 3.0)




                                                                        Flash Interface




                                                                              2. You can either leave the
                                                                                 stage default size or change
                                                                                 the size by clicking on the
                                                                                 button that says 550x400
                                                                                 pixels.
Flash techniques                                                                                                                   1
   3. You can also change the colour of the stage by clicking on the white
      box next to Background.




                                                                        Panels
  Tools                                Timeline




                               Stage


                                                      Work Area




                   Property
                   Inspector
Flash techniques                                                             2
                 Timeline
                 Playhead
                                                  Change the frame view




                 Status bar

                 Layer controls

                                     For all of these layer operations click on the black circle underneath the
                                     appropriate option and next to the correct layer. E.g. to hide the contents of
                                     Layer 1 click on this circles
                 Layers
                              Show/Hide layer
                                                                      Show Outline of
                                                                      objects on layer
                                                 Unlock/Lock
                                                 Layers




Layer name
Double click on text
to change the name




  Insert Layer




                                                            Delete Layer

                  Add Motion Guide

                                           Insert Layer Folder




                 Flash techniques                                                                              3
Basic animation techniques

Motion tween

                                1. Hold down the left mouse button
                                   to show the list of shapes for the
                                   shape tool
                                2. Select the oval tool
                                3. Draw the oval tool on your canvas
                                4. Use the section tool
                                5. Double click on the shape to select
                                   both the shape and the
                                   stroke(border)




                              Stroke colour – use this
                              to change the colour of
                              the border

                             Fill colour (colour
                             the shape




   6. You shape will be filled with little white dots which means it has been
      selected. You will also see the Properties panel beneath the shape.


Flash techniques                                                                4
                                                    7. Using the
                                                       pointer tool
                                                       move the oval
                                                       to the left of
                                                       the stage
                                                    8. With the oval
                                                       tool still
                                                       selected hold
                                                       down Ctrl+G
                                                       on your
                                                       keyboard to
                                                       group the
                                                       object. You
                                                       can only
                                                       perform
                                                       motion
                       tweens on symbols of grouped objects.
                   9. Your shape should now have a blue rectangle
                       around it, this means it has been grouped
                   10. Right click on a frame e.g. frame 45 and
                       select Insert Keyframe




Flash techniques                                                   5
Make sure frame 45 is selected and use the pointer tool to move the oval to
the end of the stage.




Right click between frames 1 and 45 and then select Create Motion Tween




Flash techniques                                                              6
Shape tween

                                                  1. Draw a shape on the
                                                     stage
                                                  2. Decide how long you
                                                     want the animation to
                                                     last.

                                                  3. Right click on frame 40
                                                     and then click on Insert
                                                     Keyframe




                                       Make sure frame 40 is selected:




Use the pointer tool to select the shape
Press delete to delete the shape.

You timeline should now look like this:
White a what frame at frame 40 as it is now empty.




Flash techniques                                                             7
Draw a new shape with a different colour at frame 40
Like this:




Right – click between frame1 and 40 and select Create Shape Tween




Flash techniques                                                    8
Your shape tween should now be working.




Animation using symbols
If you are going to animate using this technique then you must first create all
your text and image and place them on separate layers.
     You can copy and paste images from the internet and covert them into
       symbols OR
     You can use the shapes tools to create shapes




                                                Use the text tool (T) to type in
                                                your text. Change the name of
                                                the layer by double clicking on
                                                the words Layer 1.

                                                You must place each
                                                separate text entry and image
                                                on a separate layer.

Flash techniques                                                               9
Click on the button below to do that




                                            Convert each image or text entry
                                            into graphic symbols


                                         Modify>Convert to Symbol
                                         Select Graphic




It should appear in your library


                     For each piece of text or image do the following:
                         Insert a new layer
                         Use the text tool to type out the text or copy and
                           paste the image from Google images
                         Convert the text/image to a symbol
                           Modify>Convert to symbol
                              o Save it as a graphic symbol with an
                                  appropriate name.

                     One you have all your symbols saved in your library you
                     can start the animation.


Flash techniques                                                               10
Examples of the following:
    Move
    Change size
    Change colour
    Fade in
    Change size


Move
Make sure you convert the text or image to a graphic symbol
before you begin the following steps

At the first key frame place the symbol where you want it to be at the
beginning of the animation.




Decide on how long you want to animation to last e.g. 50 frames.
Right click on the frame and click on Insert Keyframe(F6)




Flash techniques                                                         11
                                             Make sure the last keyframe
                                             is highlighted
                                             Now move the symbol to where
                                             you want it to be at the end of
                                             the animation.



                                             Now place your cursor between
                                             the two keyframes.

Right click and click on Create Motion Tween




The frames should now have an arrow going through them and should be
coloured purple.




Change size
Make sure you convert the text or image to a graphic symbol
before you begin the following steps

Decide on how long you want to animation to last e.g. 45 frames.
Right click on the frame and click on Insert Keyframe (F6)




Flash techniques                                                          12
                   Use the Free Transform to resize the image.




                                      Now go between the two key
                                      frames, in the grey area.
                                      Right click on click on Create
                                      Motion Tween




Flash techniques                                                       13
The frames should now look like the ones below




Change colour
Make sure you convert the text or image to a graphic symbol
before you begin the following steps
Decide on how long you want to animation to last e.g. 50 frames.
Right click on the frame and click on Insert Keyframe (F6)




Click back on the first frame of the animation.



Flash techniques                                                   14
                                                  Click on the symbol
                                                  Next to the word Color
                                                   in the properties panel
                                                   click on the arrow and
                                                   selct Tint
                                                  Select the appropriate
                                                   colour. If you want the
                                                   symbol to have a solid
                                                   colour chose 100%
                                                   otherwise you can have
                                                   a mixture of the original
                                                   colour and the tint
                                                   colour.




                                         Now go between the two key
                                         frames, in the grey area.
                                         Right click on click on Create
                                         Motion Tween



Fade

Make sure you convert the text or image to a graphic symbol
before you begin the following steps

Same as above but instead of choosing Tint you choose Alpa from the Color
drop-down list and choose 0%




Flash techniques                                                          15
If you want the symbol to fade in: Choose Alpha 0% on the first frame. Then
create motion tween.
If you want the symbol to fade out: Choose Alpha 0% on the last frame.
Then create motion tween.




Animation using timeline effects
You must first collect all your images then


                                                   Click on
                                                   Insert>Timeline
                                                   Effects>Effects and
                                                   choose form the options

                                                   You also have the
                                                   option of selecting
                                                   Insert>Timeline
                                                   Effects>Transform/Tra
                                                   nsition.




Flash techniques                                                        16
Once you have chosen your options e.g Blur


                                                            You will be able to
                                                            preview the
                                                            animation to see
                                                            what it looks like.

                                                            Effects Duration:
                                                            the more frames you
                                                            have the longer the
                                                            effects last for. The
                                                            less frames the
                                                            shorter the effect.

                                                            When you change
                                                            the settings you
                                                            must then click on
                                                            Update Preview to
view the changes.
Click on OK when you have finished.




The timeline will show the duration of your effect and the effect will also
appear in the Library




Flash techniques                                                                  17

				
DOCUMENT INFO
Shared By:
Categories:
Stats:
views:222
posted:4/19/2010
language:English
pages:17
Jun Wang Jun Wang Dr
About Some of Those documents come from internet for research purpose,if you have the copyrights of one of them,tell me by mail vixychina@gmail.com.Thank you!