Download
animation n.
Skip this Video
Loading SlideShow in 5 Seconds..
Animation PowerPoint Presentation

Animation

582 Views Download Presentation
Download Presentation

Animation

- - - - - - - - - - - - - - - - - - - - - - - - - - - E N D - - - - - - - - - - - - - - - - - - - - - - - - - - -
Presentation Transcript

  1. Animation Chapter 3

  2. Animation • What is it? • Anything that moves on the web. • Examples? • Note, many types of animations require plugins (e.g. Flash, RealPlayer, QuickTime, etc)

  3. Goals of Animation • Get attention/entertain/advertise • Explain • Set mood

  4. Examples • Advertisement • Punch the monkey • Entice viewer to click in the window, which is a link to some commercial site • Can distract from the main content of the site • Can consume a deal of bandwidth • Mood • Eyeball Design: FX Zone • Adds to the ‘feel’ of the page • Does not detract from main content, but enhances it (if done right)

  5. Examples (cont.) • Entertainment • Strong Bad: New Hands

  6. How Animation works on the Web • Frame Animation • A series of still images displayed one after the other. Each image differs slightly from the previous. • File size depends on the number of frames and amount of change between each image • Can produce very large files • Most banner Ads are in this form • Example • Napoleon Dynamite Animated Gif(Buddy Icon)

  7. How Animation works on the Web (cont.) • Vector Animation • Used when objects move across a defined path • Typically requires a plug-in (like Flash) • Requires less file space • Has little need for compression • Why? • Uses mathematics to define shapes, paths, and speeds.

  8. Compressing Frame Animation • Each Frame is compressed as discussed last week. • Each frame is an image, thus each one is compressed as a separate still image • Frame difference compression is then applied (works best with line drawings) • What is Frame difference compression? (discussed more in chapter 5) • Rather than storing each frame individually, only the change in pixels is stored between each frame.

  9. Lets Look at an Animated Gif • Open Napolean Dynamite in Adobe Photoshop to se each frame

  10. File Formats for Animation • Animated gifs do not require plug-ins • Flash: .swf • Fireworks: .phg • Video • QuickTime: .mov • RealVideo: .ram • Windows Media: .wmv • Plus many more (mpg, dcr, etc)

  11. Building Animation in Flash • Check out page 62-64 • Lets check it out in class!

  12. Creating 3D Animation • Cinema4D • Reasonably priced software • GMAX • Free learning tool for 3D object creation and animation • 3D Studio Max • Etc.

  13. Embedding Animation in a Web Page • Animated gifs • These are inserted the same way a still image is inserted • Check page 68 for information on ebedding flash files (.swf) • Good Usablity Note! • Rather than placing a video right on the page, put a link allowing the users to choose to view the video or not.