Animation at Blue Mountains TAFE

Looking at ideas of sequential art and some of the techniques, terminology, tools and software used to create animations.

Monday, March 06, 2006

Rollovers in flash




Tonight we explore the world of button in flash. We will be creating "buttons" and givng them rollover effects.


To do this open flash:

  1. Set the document size to 250 by 250 so it will fit on the blog
  2. Create and object, say a red circle with the oval tool
  3. Double click with the move tool to select your object
  4. Press F8 to convert to a symbol
  5. Choose the button option and name it appropriately
  6. Double click your new symbol
    This takes you inside the symbol.
  7. Right click into the hit frame to define your hot spot and add a keyframe
  8. Add another keyframe into the over frame.
  9. Add text or objects you want to appear when the mouse moves over the hotspot.
  10. To display more when the mouse button is held down, right click into the Down frame, add a keyframe and make the desired changes
  11. Your button is complete, click back to Scene 1 and test your movie.
    Placing an animation with rollover effects into your blog.
  12. Save the file and go to File and Publish setting to explore choices
  13. To blog it got choose the html and swf options and Publish.
  14. This places the files in your folder where the files was last saved.
  15. We are using http://www.openomy.com/ bmphotoshop with the usual password to store the swf file
  16. Login into openomy and upload your swf file, as you would attach an email
  17. Tag it ani so it stays with the animation files
  18. When it is uploaded make sure you make it public or it will not appear without a password
  19. Copy the address/path to put into the code so your blog can call it
  20. Exit openomy and go to your folder and open the html file, got to View Source to see the html.
  21. You need the bit between object and object
  22. You will see the file name appear twice in the code, once at value="" and then at src="" - this is where you will paste the address/path from openomy.
  23. Next copy the object to object, log into your blog and start a new posting.
  24. Paste the code into your new post in Edit html mode
  25. Congratulations, Publish post and your done!!!

0 Comments:

Post a Comment

<< Home