Graphical Animation - Flash Introduction

2,260 views

Published on

Intro Lesson 5/12

Published in: Technology, Art & Photos
0 Comments
1 Like
Statistics
Notes
  • Be the first to comment

No Downloads
Views
Total views
2,260
On SlideShare
0
From Embeds
0
Number of Embeds
2
Actions
Shares
0
Downloads
67
Comments
0
Likes
1
Embeds 0
No embeds

No notes for slide

Graphical Animation - Flash Introduction

  1. 1. M5 Satree Phuket Aj. Jamie
  2. 2.  What are graphics?  Pictures displayed on a computer.  What is animation?  The creation of moving pictures or graphics.
  3. 3.  Aims of this course:  Find out what graphical animation is.  Discover what graphical animation can be used for.  Learn to create animations using Adobe Flash.  Be able to upload and display animations on the internet.
  4. 4.  Adobe Flash Player is a tool available in most web browsers that allows you to display animations.  Adobe Flash also has many web animation authoring tools available for users.  The authoring tool we will be using in class is Adobe Flash CS4.  Note: In 2005 the company Macromedia was taken over by the company Adobe, so Macromedia Flash is now known as Adobe Flash.
  5. 5.  Flash allows you to create web applications, games and movies, as well as application for mobile phones, such as screensavers.  You can create complete websites just using Flash.  Flash files are usually known as Flash movies, and have a .swf file extension.
  6. 6.  Take a look at some impressive Flash websites on the internet: http://ge.ecomagination.com/smartgrid/#/landing_page http://www.mono-1.com/monoface/main.html  http://www.mikimottes.com/  http://waterlife.nfb.ca/
  7. 7.  Task today – Introduction to Adobe Flash.  Start – All programs – Adobe – Adobe Flash  Create New – Flash Document  You have now created a blank Flash Movie and are ready to begin editing.
  8. 8.  On the left of your screen you should see the tools panel.  This panel contains your basic selection, drawing and colour tools which you should already be familiar with.
  9. 9.  We used layers in Photoshop.  It is the same in Flash, layers can be used to create more complicated drawings or animations.  For example, use a layer for each part of the drawing you want to animate.  Use a separate layer for the background.
  10. 10.  At the top of your screen you will see a timeline.  Each of the frames in the timeline lasts for a small period of time.  fps is the frame rate per second. The default is 12 frames per second. Your can change this if necessary in properties.
  11. 11.  Time to create your first animation!  Draw a simple image.  Then, right click frame 5, and select Insert Key Frame  Make sure the red bar is over frame 5, and change the picture.  Use Control – Test Movie to view your animation.  This is a simple way to create an animation, it is called frame by frame animation.
  12. 12.  Something else to try…  Start again. Follow the same steps then but Insert – Blank Key Frame.  What happens this time?  A BLANK frame is inserted. Add something to this blank screen and test your movie again.  Remember, use Insert Key Frame to CHANGE your original image, or use Insert Blank Key Frame to create a new, different image.  Use Insert Frames to display a frame for a longer time, without changing it.
  13. 13.  We need to save our work as a .swf file because this is the format that Flash files are displayed on the web as.  To do this; File – Export – Export Movie  Give your work a filename (ONLY use letters and numbers, and no Thai script)  Hit OK at the next screen.  You have now created a Flash movie ready for uploading to the internet.
  14. 14.  I want you to create a animation of anything you want. (your friend, a cartoon, a car, a sunset, a card, a dog…. up to you.)  Include some text on the animation.  Try and make the animation 5-10 seconds long.
  15. 15.  If you need any help to create pictures or you have never used graphic software before, there is an excellent beginners guide here: (pages 3 and 4 guide you completely through the drawing of a house) http://www.adobe.com/devnet/flash/articles/beg_drawing.html  More help can also be found here, another excellent beginners guide: http://www.webdevelopersnotes.com/tutorials/flash/flash_design_t utorial_drawing_tools_in_flash.php3

×