1 / 13

Animation

Animation Chapter 3 Animation What is it? Anything that moves on the web. Examples? Note, many types of animations require plugins (e.g. Flash, RealPlayer, QuickTime, etc) Goals of Animation Get attention/entertain/advertise Explain Set mood Examples Advertisement Punch the monkey

oshin
Download Presentation

Animation

An Image/Link below is provided (as is) to download presentation Download Policy: Content on the Website is provided to you AS IS for your information and personal use and may not be sold / licensed / shared on other websites without getting consent from its author. Content is provided to you AS IS for your information and personal use only. Download presentation by click this link. While downloading, if for some reason you are not able to download a presentation, the publisher may have deleted the file from their server. During download, if you can't get a presentation, the file might be deleted by the publisher.

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.

More Related