CGMB 324: Multimedia System design

Slides:



Advertisements
Similar presentations
2.02A History of Animation 2.02 Develop Computer Animations.
Advertisements

Multimedia Production
Animation effects Adds motion to a piece Draws attention to what you want user to notice As simple as a transition effect, such as a fade, dissolve or.
Unit 6 – Multimedia Element: Animation
CMPD 434 MULTIMEDIA AUTHORING Chapter 04 Multimedia Authoring Process II.
ANIMATION Chapter 5. 'In his book "Web Site Usability," researcher Jared Spool found that his web site testers found animation uniformly irritating, and.
Chapter 7-Animation. Overview Introduction to animation. Computer-generated animation. File formats used in animation. Making successful animations.
Multimedia for the Web: Creating Digital Excitement Multimedia Element -- Graphics.
SCA Introduction to Multimedia
Chapter Seven Graphics, Multimedia, and Hypermedia.
FLASH Introduction to Animation. Review: Intro to Computer Operation Information Technology Vocabulary Computer Hardware Motherboard CPU and Memory Peripheral.
Computer-Based Animation. ● To animate something – to bring it to life ● Animation covers all changes that have visual effects – Positon (motion dynamic)
Animation Theory.
Animation. Where did animation start from? The original Steamboat Willie animation from Disney Each single frame was painted onto a cell – like a sheet.
BASIC CONCEPS OF ANIMATION The presentation source: Department of Educational Multimedia Faculty of Education, UTM MPT 1383: VIDEO AND ANIMATION TECHNOLOGY.
What is it? The use of computers to present text, sound, graphics, animation and video in an integrated way.
Animation Techniques Guilford County SciVis V
Chapter 11 ANIMATION  Group Name: Creative Web World  Jose T Barriga  Claudia L. Espinosa  Ranjana Agarwal.
Animation.
MIM 482 E SPRING TERM MIM 482 E SPRING TERM Prof. Dr. Orhan Hacıhasanoğlu Prof. Dr. Işıl Hacıhasanoğlu 13.
ANIMATION.
CGMB113/ CITB 123: MULTIMEDIA TECHNOLOGY
Business and Computing Deanery Multimedia Week 6 Animation.
Multimedia Building Block : Animation
Animated text created using What is it?
Digital Multimedia, 2nd edition Nigel Chapman & Jenny Chapman Chapter 8 This presentation © 2004, MacAvon Media Productions Animation.
1-1 OBJ Copyright 2003, Paradigm Publishing Inc. Dr. Joseph Otto Silvia Castaneda Christopher deCastro CSULA Macromedia Flash MX Introduction.
Digital Media Dr. Jim Rowan ITEC 2110 Animation. Two ways to create moving images Capture using a camera Create using animation techniques.
T.J.I SKANDAR A BD A ZIZ A DAPTED FROM N OTES P REPARED BY : N OOR F ARDELA Z AINAL A BIDIN R EVISED ON S EPT CHAPTER EIGHT MULTIMEDIA BUILDING.
© 2012 Adobe Systems Incorporated. All Rights Reserved. Copyright 2012 Adobe Systems Incorporated. All rights reserved. ® INTRODUCTION TO FLASH ANIMATION.
2D ANIMATION. Project Requirements Creation of basic bouncing ball Creation of an individual animation –Storyboard –Drawings/Digital frames –Export.
Addison Wesley is an imprint of © 2010 Pearson Addison-Wesley. All rights reserved. Chapter 5 Working with Images Starting Out with Games & Graphics in.
Chapter 7 Animation. The Power of Animation Animation grabs attention Transitions are simple forms of animation  Wipe  Zoom  Dissolve.
Flash Adobe Flash Introduction Kyungeun Park. Bitmap vs. Vector based  Bitmap –Bitmaps are made up of single pixels  Vector based –Vector graphics are.
 The creation of moving pictures one frame at a time Literally 'to bring to life' e.g. make a sequence of drawings on paper, in which a character's position.
Animation. History Photography around since the 19th century Realistic animation began in 1872 when Eadweard Muybridge settled a bet about a flying horse.
Multimedia Animation. Animation Principles Persistence of vision object seen by human eye remains mapped on retina for a brief time after viewing display.
What is Animation? 50 years ago Walt Disney created animated objects such as Mickey Mouse. Today the process used to create animated objects has had to.
Chapter 7 Animation Prepared by: Ms. Ma. Anna Corina G. Kagaoan College of Arts and Sciences.
Introduction to Flash Animation CS 318. Topics Introduction to Flash and animation The Flash development environment Creating Flash animations  Layers.
2.02B Methods and Uses of Animation
“ Animation Through the Ages” Camelia McCallion. Main tasks What is computer animation? Hand drawn (cel) Flick books Animated cartoon Animation process.
Animation Lecture 8 Razia Nisar Noorani. Animation The rapid display of a sequence of images of 2-D or 3-D artwork or model positions in order to create.
Multimedia element: Animation Week The power of animation Animation is achieved by adding motion to still image/object. May also be defined as the.
Animation.
CISC 110 Day 3 Introduction to Computer Graphics.
2.02B Methods and Uses of Animation 2.02 Develop Computer Animations.
Digital Media Dr. Jim Rowan ITEC 2110 Animation. Two ways to create moving images Capture using a camera –edit in a video editor like iMovie Create using.
Introduction to Animation In animation, a series of images are rapidly changed to create an illusion of movement.
Animation. Animation Defined Like video: illusion of motion using sequence images minimally differ from each other. Different from Video: each frame is.
© 2011 The McGraw-Hill Companies, Inc. All rights reserved Chapter 5: Animation.
Computer Engineering and Networks, College of Engineering, Majmaah University ANIMATION Mohammed Saleem Bhat CEN-318 Multimedia.
COM 205 Multimedia Applications
Unit 6 – Multimedia Element: Animation
Multimedia: making it Work
TOPIC 5 - ANIMATION.
Lesson 7-Animation.
MOHD SAIFULNIZAM ABU BAKAR
GIF or Not GIF? Use GIF for animation:
Chapter 4:- Animation Eyad Alshareef Eyad Alshareef.
“Animation Through the Ages”
Introduction to Animation
Objective % Explain concepts used to create digital animation.
Final Study Guide Arts & Communications.
Assist. Lecturer Safeen H. Rasool Faculty of SCIENCE IT Dept.
Computer Graphics Lecture 15.
Chapter 5 Animation.
2.02A History of Animation 2.02 Develop Computer Animations.
Objective Explain concepts used to create digital animation.
GIF or Not GIF? Use GIF for animation:
Presentation transcript:

CGMB 324: Multimedia System design Chapter 06: Multimedia Element IV - Animation

Objectives Upon completing this chapter, you should be able to: To identify the terms and concept related to animation To define animation and describe how it can be used in multimedia systems To understand some of the common animation techniques

Principles of Animation

Animation Animation = An illusion of movement created by sequentially playing still image frames with different movements at the general rate of 15 - 30 fps (frames per second) This animation moves at 10 frames per second. This animation moves at 2 frames per second. At this rate, the individual frames should be discernible

The animations shown before consist of these 6 frames. These frames may be generated by computers, or by photographing a drawn or painted image, or by repeatedly making small changes to a model unit (claymation and stop motion), and then photographing the result with a special animation camera. When the frames are strung together and the resulting film is viewed, there is an illusion of continuous movement due to the phenomenon known as persistence of vision. Generating such a film tends to be very labour intensive and tedious, though the development of computer animation has greatly sped up the process.

How Animation Works? It is believe that animation is possible because of a biological phenomenon known as persistence of vision An object seen by human eye remains chemically mapped on the eye’s retina for a brief time after viewing a psychological phenomenon called phi. Human’s mind need to conceptually complete the perceived action i.e. translating the action

How Animation Works? Combination of these two (persistence of vision + phi) make it possible for a series of images that are changed very slightly and very rapidly, one after another, to seemingly blend together into a visual illusion of movement. E.g. a few cells or frames of rotating logo, when continuously and rapidly changed, the arrow of the compass is perceived to be spinning. Still images are flashed in sequence to provide the illusion of animation

How Animation Works? The speed of the image changes is called the frame rate. Movie/Film is typically delivered at 24 – 30 frames per second (fps) Computer animations can be effective at 12 to 15 frames per second Morphing – process of transforming one image into another via a series of frames

How Animation Works? To animate can be thought of as, “to bring to life” Animation includes time varying positions (motion dynamics), shape, color, transparency, structure and texture of an object (update dynamics), and changes in lighting, camera position, orientation and focus.

Animation Techniques Traditional animation, sometimes also called cel animation or hand-drawn animation, is the oldest and historically the most popular form of animation. Traditional animation began with each frame being painted and then filmed. Cel animation, developed by Bray and Hurd in the 1910s, sped up the process by using transparent overlays so that characters could be moved without the need to repaint the background for every frame. Computer animation has advanced rapidly, and is now approaching the point where movies can be created with characters so lifelike as to be hard to distinguish from real actors.

Animation Techniques - Cel Animation This image shows how two transparent cells, each with a different character drawn on them, and an opaque background are photographed together to form the composite image. http://en.wikipedia.org/wiki/Traditional_animation

Animation Techniques – Claymation And Computer Animation Example of a claymation Example of a computer animation http://www.dbprescott.com/girlanim.gif http://en.wikipedia.org/wiki/Image:Pyramid_of_35_spheres_animation.gif

Animation  Layout Transition The simplest form of animation is transition Transitions specify how the display changes (such as fading to black) as a user moves from one item (such as slide or Web page) to another) Examples : Spiral Stretch Zoom Checkerboard

Process / Information Transition Animation can be used to describe complex information / process in an easier way Perform visual cues (e.g. how things work)

Basic Concepts Of Animation Input process Digitize the drawings – to capture key frames containing the characteristic positions. Post-processing may be required to filter glitches. Composition Foreground and background figures combined Pan = take a portion of an image (e.g. just a person’s face) Zoom = fill the entire screen with an image In between process Movement from one position to another needs a composition of frames with intermediate positions (intermediate frames) in between the key frames. ‘Inbetweening’ can be done using interpolation

Basic Concepts of Tweening Consider the following sequence of key frames (key 13) of a bouncing ball: 2 Keyframe 2 1 3 Keyframe 1 Keyframe 3

Basic Concepts of Tweening Using linear interpolation to yield the in-betweening 2 1 3

Basic Concepts of Tweening This is not realistic! Looks like being deflected by some unknown source; it doesn’t match the rest; angle may be too sharp

Basic Concepts of Tweening Better to use a spline (curved lines) formula 2 1 3

Basic Concepts of Tweening http://www.cadtutor.net/dd/bryce/anim/anim.html

Basic Concepts Changing Colors Computer animation uses color lookup tables (CLUT) in a frame buffer and the process of double buffering. Animation is done by manipulating the table. E.g. cycle the LUT; this saves time and bandwidth. Also called Palette Animation Palette Animations change only the color palettes, while the images themselves remain the same. The effect is very different. http://images.beggerlybend.com/animpal/ap_flare2.gif

Other Animations Other Animations Toggling on and off – For a “yes/no” situation Rotating through several image frames – just like still TV ads. Delta frame (frame created from preceding keyframe based on those pixels that have changed) – very computationally intensive, requires storing of initial frame as bitmap. Encoding of the changed pixel into RLE format.

Controlling Animation Full Explicit Control Simplest of all. Just specify explicitly the change or directly manipulate; e.g. for a linear presentation. Procedural Control Based on communication between various objects to determine their properties. In physically-based system, the position of one object may influence motion of another In action-based systems, the individual actors may pass their positions to other actors to affect the other actor’s behavior.

Controlling Animation Constraint-based Systems Some objects move in straight lines, others don’t! Easier to specify with constraints than explicit control. Tracking Live Action Rotoscoping = specify the acting parts of the character and draw over it. (cartoon characters in real environments)

Controlling Animation Use indicator to key points and use data glove to move the parts. Kinematics and Dynamics (physics) Kinematics - relates to position and velocity of points Dynamics – also follows the laws of physics

Animations File Formats Some file formats are designed specifically to contain animations : Macromedia Director (.dir and .dcr) Macromedia Flash (.fla and .swf) AnimatorPro (.fli and .flc) 3D Studio max (.max) SuperCard (.pics) CompuServe GIF89a (.gif)

Applying Animation In Multimedia Systems

Applying Animation In MM Systems When do we need to use animation in a multimedia system? Once we’ve established that, why not just use video? These are some of the questions a multimedia developer is typically faced with. Firstly, animation and video are very much alike. Both are comprised of moving images and both support sound and can depict motion or action.

Applying Animation In MM Systems One of the places where animation and video do differ is the nature of the content itself. Most of the time, animation uses vector graphics and flat colors for its content. Video, on the other hand, often uses the equivalent of 24-bit color images to depict real people and real places. Think of animation to be like a cartoon and video like a real movie with real actors and people. Nevertheless, the line separating the two are becoming thinner with time.

Applying Animation In MM Systems Animation (like the famous stick man above), is often recognizable by its very nature to portray things and objects that are often not possible in the real world. Video, is more likely to show real world events and people. We can usually tell the difference between video and animation right away.

Applying Animation In MM Systems These days, however, animation and video sometimes merge into a motion picture that is different from both pure animation and video, as we know it. This allows the interaction between real people and cartoon characters. It is actually quite an achievement in film-making.

Applying Animation In MM Systems So, where would it be suitable to use animation over video? Consider a system which is trying to explain how a CD-ROM is read by the computer. You have the option of either using text, images, audio (narration), animation or video to explain it. All would work, but only one is best.

Applying Animation In MM Systems Text would be too long and confusing. Images would be better, but needs to be complemented with a significant amount of text to be understood. Audio can only explain what can also be read in words. Plus, if you missed something, it would be inconvenient to review. Video is interesting, but how do we capture on video this particular process (CD-ROM being read) in reality and in a way that is easy to understand?

Applying Animation In MM Systems Finally, we are left with animation. Because of its nature to depict strange and impossible things, we can illustrate how a CD-ROM works quite nicely. The individual components can be taken apart and shown, in motion, how they all interact with one another. Unfortunately, animation has its limitations. Often, we are unable to find something specific in the form of a ready-made animation (which someone else has done) and have to create the thing ourselves.

Applying Animation In MM Systems It requires effort and work, but the results are worth it. Plus, we need not worry about copyright infringement, since we created it ourselves. Nevertheless, the long arm of the law can still prosecute us if the content within the animation itself is owned by someone else. So, if you create an animation you plan to use commercially (especially), make sure it is all yours from the ground up.

References http://en.wikipedia.org/wiki/Animation http://www.cadtutor.net/dd/bryce/anim/anim.html