Multimedia Systems
Multimedia Systems Week 8
Exploring Animation as a
Multimedia Element
* Property of STI
Page 1 of 74
Multimedia Systems
Animation
All about making things move
Process of bringing still objects to life
* Property of STI
Page 2 of 74
Multimedia Systems
1800s
Scientists realized that a series of still
images can be used to create the
effect of a moving image
Optical toys are used to test out the
effects of early animation
* Property of STI
Page 3 of 74
Multimedia Systems
Optical Toys
Stereoscope
Sir Charles Wheatstone, 1838
Can view a 3D picture
* Property of STI
Page 4 of 74
Multimedia Systems
Optical Toys
Conway Stereo Viewer
* Property of STI
Page 5 of 74
Multimedia Systems
Optical Toys
1920s-30s Stereo Viewer
* Property of STI
Page 6 of 74
Multimedia Systems
Drawing in Time
The idea of animation is way older
than movies or television.
People have tried capturing a sense
of motion in their ART
Painting animals on wall
Paleolithic caves
Cave of Lascaux
* Property of STI
Page 7 of 74
Multimedia Systems
Drawing in Time:
Way back
People have tried capturing a sense of
motion in their ART like painting animals on
wall.
Cave of
Lascaux
Eight-legged
boar in the
Altamira caves of
Northern Spain
4 pairs of
legs to
show
motion
* Property of STI
Page 8 of 74
Multimedia Systems
Drawing in Time: 1600
In 1600 BC, the
Egyptian
Pharaoh
Rameses II built
a temple for the
Goddess Isis
with 110
columns
Each column
had a painted
figure of the
goddess in a
progressively
changed
position.
* Property of STI
Page 9 of 74
Multimedia Systems
Drawing in Time: 1600
1640: Magic
Lantern
Athonasius Kircher
First attempt to
project drawings
on the wall
Early Slide
Projector
* Property of STI
Page 10 of 74
Multimedia Systems
Drawing in Time: 1600
Magic Lantern adapted for
kids
Different slides:
historical events
geographic locations
famous people
vocabulary words
* Property of STI
Page 11 of 74
Multimedia Systems
Drawing in Time: 1800
Most early attempts like creating an
illusion of movement were made
using drawings
1824: Peter Mark Roget
Persistence of Vision phenomenon
Ability of the eyes to temporarily retain
the image of anything just seen
Makes animation and movies possible
* Property of STI
Page 12 of 74
Multimedia Systems
Drawing in Time: 1800
Early animation devices
Thaumatrope
Phenakistoscope
Zeotrope
Flipper Book
Praxinoscope
Kinetoscope
* Property of STI
Page 13 of 74
Multimedia Systems
Thaumatrope
1825: John Ayerton Paris
Turning Marvel" or Wonder
Turner
A disc with a string or peg attached to
both sides
* Property of STI
Page 14 of 74
Multimedia Systems
Phenakistoscope
1832: Belgian physicist Joseph
Plateau Simon Stampfer in Austria
Patterns or performers such as
jugglers or acrobats
[Link]
gallery/collections/toys/a
nimations
* Property of STI
Page 15 of 74
Multimedia Systems
Zeotrope
1867 in USA: William George
Horner
Wheel of Life
More than one person can view
Slits
* Property of STI
Page 16 of 74
Multimedia Systems
Flipper Book
1868: John Barnes Linnet
Linear Animation
Pages are turned rapidly to simulate
motion
Still a primitive Form of animation
* Property of STI
Page 17 of 74
Multimedia Systems
Praxinoscope
1877: Emile Reynaud
12 picture sequence of
dramatic action
30 feet of transparent
Crystaloid
Mirrors
* Property of STI
Page 18 of 74
Multimedia Systems
Thomas Edison
Experimenting with moving pictures
Invented a mechanized form of flip
book
Mutoscope - mounted the pages on a
central rotating cylinder rather than
binding them in a book
1893: Kinetoscope -- motion picture
camera
First real practical means of making
animation
* Property of STI
Page 19 of 74
Multimedia Systems
Thomas Edison
Demonstrating the
kinetograph (motion
picture camera)
with the assistance
of George Eastman,
who helped develop
the film used in the
early motion picture
machines.
* Property of STI
Page 20 of 74
Multimedia Systems
Pioneers of Animation
J. Stuart Blackton (1875-1941)
Winsor McCay (1867-1934)
John Bray (1874-1978)
Dave and Max Fleischer
(1883-1972, 1884-1979)
Otto Messmer (1892-1983)
Walt Disney (1901-1966)
* Property of STI
Page 21 of 74
Multimedia Systems
J. Stuart Blackton
Fore-Father of Animation
1896: Rapid-drawing Cartoonist" for
a series of Edison shorts.
Photographed drawings
The Enchanted
Drawing
(1900)
* Property of STI
Page 22 of 74
Multimedia Systems
J. Stuart Blackton
"Humorous Phases of Funny Faces"
(1906)
Stop-Motion technique
Animation drawn on a blackboard
3000 drawings
* Property of STI
Page 23 of 74
Multimedia Systems
Winsor McCay
Father of character animation
Well-known for his newspaper comics
"Little Nemo in Slumberland" (1905-
1914)
* Property of STI
Page 24 of 74
Multimedia Systems
Winsor McCay
McCay appeared on stage with his
animated dinosaur, Gertie. (1914)
* Property of STI
Page 25 of 74
Multimedia Systems
Winsor McCay
"The Sinking of the Lusitania" (1918)
was the first propaganda animation.
2 years to create
25,000 drawings
* Property of STI
Page 26 of 74
Multimedia Systems
John Bray
Founder of the first animation studio
Use of grayscale (as opposed to B&W)
"Colonel Heeza Liar's" (1913)
* Property of STI
Page 27 of 74
Multimedia Systems
Fleischer brothers
Max Fleischer invented the rotoscope
technique.
* Property of STI
Page 28 of 74
Multimedia Systems
Fleischer brothers
Fleischer Studios
Betty Boop, Popeye, and Superman
* Property of STI
Page 29 of 74
Multimedia Systems
Otto Messmer
Felix the Cat - First animated
character with personality
* Property of STI
Page 30 of 74
Multimedia Systems
Walt Disney
Producer, director,
screenwriter, voice-
actor, and animator
"Steamboat Willie" -
1928
Not the first Mickey
cartoon made or
released but
considered as Mickey
Mouse's true debut
First cartoon with
sound!
* Property of STI
Page 31 of 74
Multimedia Systems
Disney: Animation as an
Art Form
Innovations
Story board to review story
Pencil sketch to review motion
Colored
Sound
* Property of STI
Page 32 of 74
Multimedia Systems
Walt Disney
Silly Symphonies (1929)
Skeleton Dance
Musical Score
Ub Iwerks - chief animator
* Property of STI
Page 33 of 74
Multimedia Systems
Walt Disney
Three Little Pigs
Fully developed personality animation
Separate personalities
* Property of STI
Page 34 of 74
Multimedia Systems
Walt Disney
Snow white and the seven dwarfs
First fully animated feature-length film
83 minutes
Gave birth to the
golden age of animation
* Property of STI
Page 35 of 74
Multimedia Systems
Other Satellite Studios
Multimedia Systems
1940-1950s
Reactions against the Disney style.
Bill Hanna and Joe Barbera
Jetsons, Flinstones, Yogi Bear, Scooby
Doo
Tex Avery
Droopy Dog
Paul Terry
Mighty Mouse and Heckle & Jeckle
Chuck Jones
Road Runner, Pepe LePew, Bugs Bunny
and friends
* Property of STI
Page 37 of 74
Multimedia Systems
Principles of Animation
Squash and Stretch
Anticipation
Arcs
Ease in and Out
* Property of STI
Page 38 of 74
Multimedia Systems
Squash and Stretch
A traditional animation technique that
animators commonly use to give
animated objects more realism and
weight.
When an object moves, its movement
indicates the rigidity of the object.
When a moving object comes into
contact with another object, it
deforms upon impact unless it is
completely rigid.
No matter how much an object
squashes or stretches, it should
always maintain the same volume.
* Property of STI
Page 39 of 74
Multimedia Systems
Anticipation
Cues or prepares the audience for a
major action the character is about to
perform.
Examples: Starting to run
About to jump
* Property of STI
Page 40 of 74
Multimedia Systems
Arcs
In the real world, almost all action
moves in an arc.
Joints and Gravity
Grace and clarity of movement
Example: Arm movements
* Property of STI
Page 41 of 74
Multimedia Systems
Arcs
Head Turns
Movement of Objects
Arm Movements
* Property of STI
Page 42 of 74
Multimedia Systems
Ease In and Out
Objects do not move in constant
speed.
Moving objects end gradually not
abruptly
Acceleration
Ease In
Deceleration
Ease Out
* Property of STI
Page 43 of 74
Multimedia Systems
Conceptualizing an
Animated Movie
Concept
Storyline
Characters
Storyboard
Voice Over
Animation
* Property of STI
Page 44 of 74
Multimedia Systems
Concept
Original idea about any of these three
elements that will make the
animation memorable
Message
Character
Animation
Plot
MESSAGE new learning for the audience
CHARACTER new character that has never
been seen before
PLOT new setting and build up events
* Property of STI
Page 45 of 74
Multimedia Systems
Conceptualizing an
Animated Movie
Concept
Storyline
Characters
Storyboard
Voice Over
Animation
* Property of STI
Page 46 of 74
Multimedia Systems
What is a Story?
Any sequence of events with a
beginning, middle, and an end makes
up a story
Story is the most important part of
any animation
Makes up the flow of the animation
sequence
Stories fall into two main categories:
Fact: What actually happened (real
events)
Fiction: Events that are imagined to have
happened
* Property of STI
Page 47 of 74
Multimedia Systems
Storyline
4 ways of writing stories
Something that happened to you (fact)
Something that happened to someone
you know (fact)
Something imaginary based on a factual
situations (fiction/reality)
Something totally imaginary
(fiction/fantasy)
Dramatic twist
Unexpected turn
The reader is not sure what is going to
happen next.
[Link]
* Property of STI
Page 48 of 74
Multimedia Systems
Conceptualizing an
Animated Movie
Concept
Storyline
Characters
Storyboard
Voice Over
Animation
* Property of STI
Page 49 of 74
Multimedia Systems
Characters
In designing a character, we
look at two aspects:
Face
Multimedia Systems
Characters
Form Basic Silhouette
Shapes
* Property of STI
Page 51 of 74
Multimedia Systems
Characters
Our minds remember the form rather
than the details
* Property of STI
Page 52 of 74
Multimedia Systems
Characters
If form is altered, the character is no
longer the same
* Property of STI
Page 53 of 74
Multimedia Systems
Proportion
* Property of STI
Page 54 of 74
Multimedia Systems
Views
Front Side Back
* Property of STI
Page 55 of 74
Multimedia Systems
Face
Multimedia Systems
Form + Face
* Property of STI
Page 57 of 74
Multimedia Systems
Conceptualizing an
Animated Movie
Concept
Storyline
Characters
Storyboard
Voice Over
Animation
* Property of STI
Page 58 of 74
Multimedia Systems
A Storyboard
Visual script for your project
Panel-like drawings of key
scenes and events
A visualization of how your
animation will look and how the
animation is sequenced
A step by step guide to creating
the actual animation
* Property of STI
Page 59 of 74
Multimedia Systems
* Property of STI
Page 60 of 74
Multimedia Systems
* Property of STI
Page 61 of 74
Multimedia Systems
Parts of a Storyboard
1.
2.
3.
4.
5.
Scene Number
Frame Number
Duration
Scene Title
Storyline
6. Camera Angles / Views
7. Dialogue / Narration
8. Sounds
* Property of STI
Page 62 of 74
Multimedia Systems
Sample Storyboard
(single)
* Property of STI
Page 63 of 74
Multimedia Systems
Conceptualizing an
Animated Movie
Concept
Storyline
Characters
Storyboard
Voice Over
Animation
* Property of STI
Page 64 of 74
Multimedia Systems
Voice Acting
The art of providing voices for
animated characters (including those
in feature films, television series,
animated shorts, and video games)
and radio and audio dramas and
comedy, doing voice-overs in radio
and television commercials, audio
dramas, dubbed foreign language
films, video games, puppet shows,
and amusement rides.
Performers are called voice actors,
voice actresses, or voice artists
* Property of STI
Page 65 of 74
Multimedia Systems
Voice Recording
A script is written by a scriptwriter for
the character dialogues
Voices for an animation is recorded
before the actual animation is
created
The voices recorded will be
synchronized with the animation later
in post-production
* Property of STI
Page 66 of 74
Multimedia Systems
Conceptualizing an
Animated Movie
Concept
Storyline
Characters
Storyboard
Voice Over
Animation
* Property of STI
Page 67 of 74
Multimedia Systems
Creating Animation
In the traditional animation process,
animators will begin by drawing
sequences of animation on sheets of
paper, one picture or "frame" at a
time.
A key animator or lead animator will
draw the key drawings in a scene,
using the character layouts as a
guide.
* Property of STI
Page 68 of 74
Multimedia Systems
Creating Animation
Every second of finished film consists
of 24 frames, requiring 12 to 24
drawings, depending upon the speed
of movement
Faster movements need more
drawings per second
Slower moves can be animated with
less drawings
14 frames per second already gives
the Persistence of Vision effect
The more frames in the animation,
the smoother the output
* Property of STI
Page 69 of 74
Multimedia Systems
Frames per Second (fps)
* Property of STI
Page 70 of 74
Multimedia Systems
Digital Animation
Today, animation can be created
digitally with software like Adobe
Flash, Toon Boom, Toufee,
KoolMoves, Express Animator, and
Anime Studio, all of which export the
animated movie in a .swf format.
SWF format is a very light file that can
be easily distributed over the Internet.
SWF files are in vector file format.
They can be used to transfer
animation to 35 mm film (for video)
without any compromise in image
quality.
* Property of STI
Page 71 of 74
Multimedia Systems
Digital Animation
Animators take advantage of the
software's ability to organize a large
number of assets (such as
characters, scenes, movements, and
props) for later re-use.
Digital Timeline
* Property of STI
Page 72 of 74
Multimedia Systems
Adobe Flash Interface
* Property of STI
Page 73 of 74
Multimedia Systems
Animation Uses
Animation traditionally comes in the
form of cartoons or movies. It is
primarily used for entertainment.
In multimedia projects, these
cartoons or movies have to be
created separately, then imported
into an interactive application for
viewing.
Animation in multimedia projects are
used for introductions, splash pages,
simulations, product demos, and
presentations.
Screen transitions (dissolve, fade out,
zooms, etc) are not considered real
animation. These are merely visual
effects.
* Property of STI
Page 74 of 74