Unit 02

1
Certificate in Digital Applications Level
02 Animation Guides for Intro, Weather and
Outros.

• Unit 02 Multimedia Presentation

2
Animation Walkthrough Guide

• There are 12 different kinds of Animation you can
  use for Objects in Flash and you will need to use
  a range of them for your Introduction Animation,
  your Weather Forecast and your Outro Animations.
• Listed below are the links to the guides for
  different way you can have your objects animate,
  practice each stage and follow the instructions
  as best as possible.

1 How to Make an Object Move (Tween)
2 How to make objects stand still to the end
3 How to Add more Objects
4 How to Zoom In and Out of an Object
5 How to make and Object Swing
6 How to Make an Object Spiral
7 How to Make an Object Fade on and Off
8 How to Save the Animation
9 How to
12 How to
10 How to
11 How to
3
1 - Animation Walkthrough Guide - Tweening
Task 1 How to Make an Object Move (Classic Tween)
The first stage of any animation in Flash is how
to move things from A to B. There are multiple
ways of doing this, the most popular being Motion
Tween, Shape Tween and Classic Tween. The first
thing you are faced with in Flash is the Dialog
box, if this is a new animation then you should
choose Flash File (ActionScript 3.0)

Click here for the Teach-ICT tutorial Classic tween will move an object from one place to another Set it in the Library Make it a Shape Double Click on the Shape to edit it. Contains images
Step 1 Go into Flash, and start a new Flash File document
4
1 - Animation Walkthrough Guide - Tweening
Task 1 How to Make an Object Move (Classic Tween)

• Step 2 A large white area will appear, this is
  your frame, everything within the white area will
  be saved, everything outside will not.
• You will be working with several things in here
  so get used to the language used.
• Layers will be down in the bottom right.
• Library will be on the right hand side.
• Toolbar should be on the left hand side.

Click here for the Teach-ICT tutorial Classic tween will move an object from one place to another Set it in the Library Make it a Shape Double Click on the Shape to edit it. Contains images
5
1 - Animation Walkthrough Guide - Tweening
Task 1 How to Make an Object Move (Classic Tween)
Step 3 At the top of the Screen, click on
Insert and then select New Symbol. A box should
pop up asking you what to call it. Give it an
appropriate name that you will remember
throughout this production, we will start with
our In The News by-line text (Company
Slogan). Then choose Graphic from the Type drop
down menu.

Click here for the Teach-ICT tutorial Classic tween will move an object from one place to another Set it in the Library Make it a Shape Double Click on the Shape to edit it. Contains images
6
1 - Animation Walkthrough Guide - Tweening
Task 1 How to Make an Object Move (Classic Tween)
Step 4 Next Select the Text Tool on the left
hand side of the screen (or Press the letter T).
You can also do this with a shape if you
prefer. In the middle of the screen type the
company slogan. It should be something catchy and
news related. It will probably be tiny and not
the colour you want but type it anyway.

Click here for the Teach-ICT tutorial Classic tween will move an object from one place to another Set it in the Library Make it a Shape Double Click on the Shape to edit it. Contains images
7
1 - Animation Walkthrough Guide - Tweening
Task 1 How to Make an Object Move (Classic Tween)

• Step 5 On the left hand side of the screen on
  the Tools bar, click on the top icon, the
  Selection Tool
• On the Right Hand Side of the screen make sure
  the Properties Panel is open and clicked on.
• Next use the Properties to change the
• Font Family,
• the Font Size
• the Font Colour

Click here for the Teach-ICT tutorial Classic tween will move an object from one place to another Set it in the Library Make it a Shape Double Click on the Shape to edit it. Contains images
8
1 - Animation Walkthrough Guide - Tweening
Task 1 How to Make an Object Move (Classic Tween)
Step 6 Now it is done and the text is how we
like it, we need to go back to the Scene. Your
text will have disappeared but this is
normal. On the Right Hand Side of the screen
click on Library. Your Symbol should be there now
ready to be dropped in when you want it.

Click here for the Teach-ICT tutorial Classic tween will move an object from one place to another Set it in the Library Make it a Shape Double Click on the Shape to edit it. Contains images
9
1 - Animation Walkthrough Guide - Tweening
Task 1 How to Make an Object Move (Classic Tween)
Step 7 Next pick up the Object from the Library
and drop it on to the screen. This is where the
Animation begins and all the action happen on the
Timeline at the bottom of the screen. Move on to
the little box under 25 and click once. (24 is
one second, you might want it longer) Right
click on it and select Insert Keyframe

Click here for the Teach-ICT tutorial Classic tween will move an object from one place to another Set it in the Library Make it a Shape Double Click on the Shape to edit it. Contains images
10
1 - Animation Walkthrough Guide - Tweening
Task 1 How to Make an Object Move (Classic Tween)
Step 8 What you have now is a Timeline of
Frames, These are Cells on your Animation, each
cell represents where the object is at that
point. So far nothing is moving, that is fine,
the object is starting and ending at the same
point.

Click here for the Teach-ICT tutorial Classic tween will move an object from one place to another Set it in the Library Make it a Shape Double Click on the Shape to edit it. Contains images
First Frame where it starts
Last Frame where it ends
Restart Point where it starts for the next bit
11
1 - Animation Walkthrough Guide - Tweening
Task 1 How to Make an Object Move (Classic Tween)
Step 9 Next Right Click anywhere in the Grey
area between frames. Select Create Classic
Tween. You should now have an arrow from Frame
1 to Frame 25 (or whatever frame you choose) like
this. This means the animation can now
work. Next click the left mouse in Frame 1 where
the round black dot is.

Click here for the Teach-ICT tutorial Classic tween will move an object from one place to another Set it in the Library Make it a Shape Double Click on the Shape to edit it. Contains images
12
1 - Animation Walkthrough Guide - Tweening
Task 1 How to Make an Object Move (Classic Tween)
Step 10 Next Move the object (My text) to
wherever you want it to be when the animation
begins, it can be off the white area if you
want. Then click on the last cell where the end
of the arrow is (not on the black dot at the end)
Then move the object (Text) to where you want it
to be at the end of the time. Press Enter and
see how the animation moves around now.

Click here for the Teach-ICT tutorial Classic tween will move an object from one place to another Set it in the Library Make it a Shape Double Click on the Shape to edit it. Contains images
13
1 - Animation Walkthrough Guide - Tweening
Task 1 How to Make an Object Move (Classic Tween)

• Step 11 Next Click inside Frame 50 (2 seconds)
  and follow the same routine as before
• Right Click
• Insert Keyframe
• Go into the new grey area
• Right Click
• Create Motion Tween
• Click in the last Cell
• Move the Object (text) to where you want it to
  end.
• Press Enter.
• Repeat until you are happy.

Click here for the Teach-ICT tutorial Classic tween will move an object from one place to another Set it in the Library Make it a Shape Double Click on the Shape to edit it. Contains images
14
2 - Animation Walkthrough Guide Standing Still
Task 2 How to Make an Object Stay Still to the
end.
Step 01 Your Introduction animation needs to be
30 seconds long and each there are 24 frames per
second. Altogether this is 720 frames. We have
created 2 seconds so far (48 frames or
cells). Right click on the last cell of the
created animation and select Copy Frames. Then
Click inside the last cell with the round black
dot, Right click and Paste Frames.

Click here for the Teach-ICT tutorial Objects should not move all the way through the animation Have some come to a halt Have some stay a while and then leave. Mix and match throughout the animation with fading and shrinking.
15
2 - Animation Walkthrough Guide Standing Still
Task 2 How to Make an Object Stay Still to the
end.
Step 02 Scroll all the way to the last cell on
the Timeline (Should be about 650) Right click on
the last cell of the created animation and select
Paste Frames. You should now see that there is a
line with an arrow in it and there is a longer
timeline now. Go to Frame 720 and paste the
frame one last time. At any point now you can
change the position of the object on the timeline
and it will add in a Keyframe for you. Press
Enter to see it if works.

Click here for the Teach-ICT tutorial Objects should not move all the way through the animation Have some come to a halt Have some stay a while and then leave. Mix and match throughout the animation with fading and shrinking.
16
3 - Animation Walkthrough Guide Adding more
Objects
Task 3 How to Add more Objects to the Animation.
Step 01 There are lots of ways of adding more
objects but the safest way is by adding them each
to a separate Layer, then you will have more
control over the movements. First go to the
Timeline toolbar at the bottom of the Page and
click on the New layer icon. A new layer will be
created called Layer 2. Double click on it to
rename it something that will ultimately help you
remember.

Click here for the Teach-ICT tutorial Objects should not move all the way through the animation Multiple objects with different animations Overlapping actions and timed movements. What you see on the news animations.
17
3 - Animation Walkthrough Guide Adding more
Objects
Task 3 How to Add more Objects to the Animation.
Step 02 Next we need to Import our Images to
the Library. Click on File, Import and Import to
Library. Then go and find all the Images you will
be using on the Animation. One should be the
Logo, the others should be related to the section
of the project you are on, News things for the
Intro and outro Animation, Weather things for the
Weather Forecast. We will start with the
Logo. You can select more than one Image by using
the Ctrl Key. When they are all Imported, they
should appear in the Library Tab at the far side
of the screen.

Click here for the Teach-ICT tutorial Objects should not move all the way through the animation Multiple objects with different animations Overlapping actions and timed movements. What you see on the news animations.
18
3 - Animation Walkthrough Guide Adding more
Objects
Task 3 How to Add more Objects to the Animation.
Step 03 Next make sure the Logo layer is
selected. Then pick up your Logo from the Library
and drop it on the screen. If it is too large or
too small, press CrtlT. A box should appear.
Make sure the little Chain Link (Constrain) is
active or it will stretch disproportionally. You
should now see that the object is on for the
whole length of the animation without moving
(there is no arrow).

Click here for the Teach-ICT tutorial Objects should not move all the way through the animation Multiple objects with different animations Overlapping actions and timed movements. What you see on the news animations.
19
3 - Animation Walkthrough Guide Adding more
Objects
Task 3 How to Add more Objects to the Animation.

• Step 04 Next make a new Layer for each of the
  other objects that will go on your animation. You
  can have them on the same layer but different
  layers works better and is easier to manage.
• New Layer
• Rename Layer
• Drag Object from Library onto Layer
• Resize Object on Layer using CtrlT
• Then when all the layers are complete we can move
  the objects around like cards by arranging the
  layers. Make sure the Text Layer is on top, it is
  the only one not see through.

Click here for the Teach-ICT tutorial Objects should not move all the way through the animation Multiple objects with different animations Overlapping actions and timed movements. What you see on the news animations.
20
3 - Animation Walkthrough Guide Adding more
Objects
Task 3 How to Add more Objects to the Animation.
Step 05 Now we can start animating them one at
a time. Start with the Logo layer. First move it
to wherever you want it to start. For me I want
it off the screen when the text starts to move so
I will move it into the grey area. I want it to
stand still for 3 seconds so I click in Frame 72
(3x24fps) on the Logo Layer. Then Right Click
and select Insert Keyframe on the Logo
Layer. You should see a Square box now at Frame
72 with a Black Dot after it on the Logo Layer.

Click here for the Teach-ICT tutorial Objects should not move all the way through the animation Multiple objects with different animations Overlapping actions and timed movements. What you see on the news animations.
21
3 - Animation Walkthrough Guide Adding more
Objects
Task 3 How to Add more Objects to the Animation.
Step 06 Next move somewhere down the line on
the Logo Layer (remember every 24 frames is one
second) Click on the cell where you want the logo
animation time to end up. Then Right click and
Insert Keyframe. A box and circle should now have
appeared at the place you selected. Next go into
the grey area between the two points you made and
click once. Then Right Click and select Create
Motion Tween. You will notice that there is no
Arrow, this is fine as it is not a Shape.

Click here for the Teach-ICT tutorial Objects should not move all the way through the animation Multiple objects with different animations Overlapping actions and timed movements. What you see on the news animations.
22
3 - Animation Walkthrough Guide Adding more
Objects
Task 3 How to Add more Objects to the Animation.
Step 06 Next go to the last Frame in the
section and then move the Object (Logo) to where
you would like it to end up. You will see that a
long set of dots and a line will have appeared,
each of these dots represents a Frame of
movement. Now click inside the timeline and a
small round circle will have appeared on that
line we talked about above. Experiment with
moving and bending them, this will alter the path
the object takes from the first point to the last
point.

Click here for the Teach-ICT tutorial Objects should not move all the way through the animation Multiple objects with different animations Overlapping actions and timed movements. What you see on the news animations.
23
3 - Animation Walkthrough Guide Adding more
Objects
Task 3 How to Add more Objects to the Animation.
Step 07 When you are done, we need to make sure
the animation you just made stays where it is
until the end of the Intro. Go to the Cell with
the Larger (second) Black dot immediately after
the Animation we just created. Click on the
Onion Skin Icon at the bottom of the screen. We
should now see a ghost of where the animation is.

Click here for the Teach-ICT tutorial Objects should not move all the way through the animation Multiple objects with different animations Overlapping actions and timed movements. What you see on the news animations.
24
3 - Animation Walkthrough Guide Adding more
Objects
Task 3 How to Add more Objects to the Animation.
Step 08 Now move the object (Logo) to be over
the position the last animated logo finished
on. From Here To Here Now the Logo file should
be in that spot to the end of the animation,
unless you intent on putting in additional
animations onto it. Now repeat the process from
Step 5, Slide 20 for the rest of the objects.

Click here for the Teach-ICT tutorial Objects should not move all the way through the animation Multiple objects with different animations Overlapping actions and timed movements. What you see on the news animations.
25
3 - Animation Walkthrough Guide Adding more
Objects
Task 4 How to Zoom In and Zoom Out of an Object.
Step 01 Now we have mastered putting things on
to the timeline and making them move, everything
after this is tricks placed on objects in the
timeline. For this we will set the timings on an
object so it zooms in or out of the
screen. First Select the object on the timeline.
And click the frame where you want the zoom to
start.

Click here for the Teach-ICT tutorial Objects should not move all the way through the animation Allows you to focus on an object Allows control over what happens to it. Can Zoom off the screen. Can look like the camera is zooming in.
26
LO1 Assessment (P, M, D)

Task ACTIVITIES Grade
Section 1 Banner on Page template Section 1 Banner on Page template Section 1 Banner on Page template
1 Banner present, full width of page /1
2 Suitable text on banner eg Under-18 Zone /1
3 Correct logo within banner, proportions retained /1
4 Logo is hyperlinked to smartsleisurepark.co.uk /1
Section 2 Use of Images Section 2 Use of Images Section 2 Use of Images
1 Map of park included on home page (may be edited) /1
2 Map edited to draw attention to at least two locations/activities featured on microsite /1
3 Image showing only one type of product on sale in shop (from shop.jpg) /1
4 Image is well cropped and not distorted /1
5 Cropped image links to shop.jpg or suitable edited version showing range of products /1
6 Onion café menu included and legible on screen /1
7 Onion café menu image compressed to lt350KB /1
8 Suitable thumbnails created for clubs introduction page /1
Section 3 Website Links Section 3 Website Links Section 3 Website Links
1 At least one correctly functional email link is included (but not necessarily to the addresses given in Smarts Info) /1
2 Any two of the following emails links are included info_at_smartsleisurepark.co.uk, shop_at_smartsleisurepark.co.uk, café_at_smartsleisurepark.co.uk, clubs_at_smartsleisurepark.co.uk /1
3 Links to both Kidz and Teenz Club information on clubs introduction page (accept any functional links including text) /1
Section 4 Website Other Content Section 4 Website Other Content Section 4 Website Other Content
1 Audio file embedded on page /1
2 Plays only on click /1
3 Applet clock inserted on a page /1
4 Clock is functional /1
5 Files in required formats (menu is included and images are all .jpg and lt350KB, audio is present and in .mp3) /1