Introduction to Multimedia Unit 6 Multimedia Element Animation

Introduction to Multimedia Unit 6 – Multimedia Element: Animation 2013 -14 Semester 1

Unit 6: Multimedia Element: Animation Introduction to Multimedia Unit Outline • In this unit, we will learn – – – Animation Guidelines Flipbook Sampling Rate and Playback Rate Cel Animation Frame-based Animation Path-based Animation Computational Animation Program-based or Script-based Animation Special Animation Effects Animation Software Animation File Formats 2

Unit 6: Multimedia Element: Animation Introduction to Multimedia Introduction • Animation is an illusion, a perception of motion. • Animation: Simply a moving or changing graphic image • Animation: A series of still images played back fast enough to trick our minds into believing that there is movement To create the illusion of animation, a series of still images is displayed fast enough so the viewer believes the images are moving. 3

Unit 6: Multimedia Element: Animation Introduction to Multimedia Introduction • Animation is an excellent way to increase appeal of a multimedia application and ensure return visits. • Animation can be used to simplify complex concepts and visualize concepts. • Animations can be simple, as in blinking text, marquee-like scrolling headlines, rotating logos, animated icons, Web buttons, 2 -D action figures, 3 -D action figures. 4

Introduction to Multimedia Unit 6: Multimedia Element: Animation e id l S y ud t f- S l Se Animation Guidelines • Animations should impact not detract. • Animate what we want users to notice. • Animation should be appropriate to the mood and content of the application. • Do not use too many animated objects per page. • Animation that does the same thing over and over is annoying. • Use transitions and special effects that help communicate message. • Make sure animation loads quickly. 5

Introduction to Multimedia Unit 6: Multimedia Element: Animation e id l S y ud t f- S l Se Animation Guidelines • Use animation where taking video shots may be unpractical or impossible but where depicting motion is necessary. • Use animation where minute details are to be depicted. – Video often has a lower resolution than animation. 6

Unit 6: Multimedia Element: Animation Introduction to Multimedia Flipbook • Digital animation is based on flipbooks. • A flipbook is a book with a series of pictures varying gradually from one page to the next, so that when the pages are turned rapidly, the pictures appear to animate. Flipbook 7

Unit 6: Multimedia Element: Animation Introduction to Multimedia Sampling Rate and Playback Rate • Two rates are used to measure animation: sampling rate and playback rate • Sampling rate refers to the number of images created per second available to be used in an animation. • Playback rate is the number of frames displayed per second when animation is being viewed. • Playback rate cannot be higher than the sampling rate. 8

Unit 6: Multimedia Element: Animation Introduction to Multimedia Sampling Rate and Playback Rate • To create the illusion of motion effectively, the playback rate of animation must be between 24 and 30 frames per second at full-motion video standards. • On the Web, the standard is generally 12 to 15 frames per second. • Anything less than 12 frames per second, however, will create a jerky motion as the eye detects the changes from one frame to the next. 9

Unit 6: Multimedia Element: Animation Introduction to Multimedia Cel Animation • Images are drawn on pieces of celluloid. • Celluloid images are placed on a stationary background. • The background remains fixed as objects change from frame to frame. 10

Introduction to Multimedia Unit 6: Multimedia Element: Animation Example of cel animation 11

Unit 6: Multimedia Element: Animation Introduction to Multimedia Frame-based Animation • Computer-based cel animation is based on changes that occur from one frame to the next. • Each keyframe is unique and illustrates a key event in the timeline of the animation. The difference between one keyframe and the next keyframe could be the result of a new position, color, shape, or any number of other characteristics or combinations of characteristics. • Tweening: process of drawing “between’’ frames; requires at least two keyframes 12

Unit 6: Multimedia Element: Animation Introduction to Multimedia Path-based Animation • Also known as vector animation; an animated object is created by following an object’s transition over a line or vector • Involves the creation of one object and a path; then tweening is used to fill in the frames as the object moves along the path With path-based animation, the computer program manipulates the object by drawing the frames along the path that the object follows. 13

Unit 6: Multimedia Element: Animation Introduction to Multimedia Computational Animation • Allows an object to be moved across a screen by varying its x- and y- coordinates • Is similar to path-based animation; however, instead of specifying a path for the object to travel, its position is varied based on axes 14

Unit 6: Multimedia Element: Animation Introduction to Multimedia Program-based or Scriptbased Animation • Involves the use of programming / scripting languages to create animation • Animations created are often more flexible than those created using the other methods because they can be very easily modified to use new images and objects. 15

Unit 6: Multimedia Element: Animation Introduction to Multimedia Special Animation Effects • Morphing: process of blending together two images into a series of images • Morphing uses frames to create the illusion of one object changing into another. • In Adobe Flash, morphing on simple vector graphics can be created by using a process called shape tweening. Morphing 16

Unit 6: Multimedia Element: Animation Introduction to Multimedia Special Animation Effects • Warping: Distortion of an image (only one image is used) Software can be used to distort or warp an image to create a special animation effect. 17

Unit 6: Multimedia Element: Animation Introduction to Multimedia Special Animation Effects • A film loop consists of a series of animated frames looped to play over and over again. • Trail effect is when the image from the previous frame is not completely erased so that it appears in the new frame. 18

Unit 6: Multimedia Element: Animation Introduction to Multimedia Onion-skinning • Is a common feature provided by animation software • Enables animators to see previous and following frames while they are drawing the current frame Onion-skinning 19

Unit 6: Multimedia Element: Animation Introduction to Multimedia Animation Software • Some animation software combine both bitmapand vector-editing tools within a single environment. • Animation software allow animators to import media elements of various file formats. • Some animation software use a timeline for development and control. • Some animation software has a built-in scripting language – Example: Action. Script in Adobe Flash 20

Unit 6: Multimedia Element: Animation Introduction to Multimedia Animation Software • Examples – Adobe Fireworks – Adobe Flash 21

Unit 6: Multimedia Element: Animation Introduction to Multimedia Animation File Formats • Animated GIF – Also known as GIF 89 a – Requires no plug-in for viewing in browsers – Is supported by all major browsers • SWF – This file format is for viewing only – To view SWF files, Adobe Flash Player must be installed on user’s computer. • Quick. Time (MOV) – Apple’s animation and movie file format – Is non-platform specific 22

Unit 6: Multimedia Element: Animation Introduction to Multimedia Animation File Formats • MPEG (Moving Picture Experts Group) – Moving Picture Experts Group created standards for interactive animation and video. – MPEG files tend to be much smaller and of much higher quality for the size since MPEG uses very sophisticated compression techniques. • AVI (Audio Video Interleave) – Microsoft’s animation and movie file format for Windows – Although AVI files are native to Windows, other programs and players will also recognize and play them. 23

Unit 6: Multimedia Element: Animation Introduction to Multimedia Reference • Part of this slide set is prepared or/and extracted from the following book: – Multimedia For The Web Revealed, Calleen Coorough & Jim Shuman, Thomson Learning, 2006, ISBN: 14188 -3953 -1 • This set of slides is for teaching purpose only. • Self-study slide(s) is / are within the scope of the final examination. 24