2. Turn in Your Homework
Meta Refresh Slideshow Files
3. Your Folder
• Put everything in a folder with your lastname
and ﬁrst initial.
• Drag and drop your folder onto my dropbox
4. General Folder Organization
• Click to add content
5. General Folder Organization
Meta Tag "Refresh" Animations
7. GIF Animation
8. GIF Basics
• Pronounced "JIF" like the peanut butter (but it
depends on who youʼre talking to.)
• GIF is a format for images on the Web
‣ Small Images
‣ Limited to 256 color palette
• Good for line drawings, large blocks of color,
computer generated graphics
• Ability to animate a series of images
9. Where are they on the Web?
• Banner ads!
• Spinning 3D logos!
• "Under Construction" pages
• Mailbox icons
• Talking or Blinking Cats
• MySpace comments
10. Where else are they?
• Loading animations
‣ Common AJAX
11. Where else are they?
• Animated headers and Flash
12. Where else?
‣ Katie Bush
13. Letʼs make a GIF
14. Photoshop for GIF Animation
• In Photoshop, open the Animation
• Make frames from layers
• Turn layers on and off for each frame
• Adjust duration and looping
• Use Save for Web and Devices...
• Turn off layers before duplicating
• Duplicate any elements that need to
rotate or change in size
• Use the same layer for changes in
16. Homework, due Feb 9
• Create two GIF animations
‣ Artistic, creative animation using
photography, drawings, or some
‣ Create a loading animation that
• Watch this tutorial on creating