7-8 TLE Animation Week 3
7-8 TLE Animation Week 3
Mensuration is the process of measuring things. The procedure for the measurement
is different from one object to another. This is due to the fact that we have different phases
of matter. We have solid, liquid, and gas. Do not fret. We are going to focus only on
measuring attributes of our Animation graphics.
Let’s delve into the main lesson but before that, let us review first about LESSON 4:
MAINTAIN HAND TOOLS, EQUIPMENT, AND PARAPHERNALIA (MT).
After you are through with this module, you are expected to be able to:
1
1. Read the introduction of the module and answer right away the pre-test.
2. Fast read the entire module, then, read it again from the beginning with average speed.
3. Follow all the directions. Use a dictionary if necessary.
4. Do the activity. Do not skip. It is designed to apply what you have learned in each
lesson.
5. Answer the Check your understanding exercises as patiently as you can.
6. Some lessons need an internet connection for interactivity. If you have one, you are
requested to do so. Otherwise, all the activities can be done offline without interactivity.
Fill in the blanks with the correct word/s to complete the sentences.
1. In a dimension such as 720 x 540 pixels, the first number refers to the __________.
2. On the other hand, in a dimension such as 4500 x 3000 pixels, the second number refers
to the __________.
3. The printed image becomes clearer when the __________ is increased.
4. __________. The ppi or pixels per inch, on the other hand, refers to the number of
pixels in a __________ inch.
5. The __________ refers to the number of tiny squares that form your photo.
6. The 2-bit image can store only black, white, and two shades of __________.
7. The default fps number for Adobe Animate CC is __________.
8. The Fps in Adobe Animate CC stands for ___________.
9. The “Mega” in 10 Megapixels camera would mean a __________ pixels.
10. The ppi stands for __________.
Score Interpretation
9-10 Excellent
5-6 Good
____________________________________________________________________________
TLE 7/8-ANIMATION AUTHOR /
Quarter 1-Week 3 TEAM LEADER: ROMEO N. PARAS
2
0-4 Needs Improvement
To check the answers in the PRETEST and all the other Self-Checks eventually, please go
to the last page.
Lesson 1
Mensuration in Animation
As an Animator, you will be working most of the time with vector objects. However,
this doesn’t mean that you will not encounter other kinds of graphics. Animate CC - the
software you will be using to create animations, is indeed a vector software just like Adobe
Illustrator. Internet graphics and its measurements are your great concerns. So how do we
measure such graphics and what is it there to measure? Can you come up with a good
guess? Well, worry no more as I’m about to spill the beans.
3
the more tones of colors can be accommodated. The 8-bit image can
accommodate 256 colors.
Being an Animator, there are some conventions that you need to follow in order to
perform your job correctly. The platform you will use will dictate primarily the specifications.
If you are going to make Animations for the web, then, you should use files that are
compatible with most browsers. On the other hand, if you will be working with Animations
on movies, then, things would be different. For the majority part of our course, we will focus
on Adobe Animate CC. We will be working more on web-based graphics and some
standalone Animations. The following are the different job requirement specifications in
Animation:
1. Image Requirements. Some of the files that work on the internet include .swf, .jpg,
.gif, and png. Do not upload your native files such as .fla. Aside from it won’t work on
the internet, people will have access to your original creation and claim it for
themselves.
2. File Name. In naming your Animation files particularly the .swf, use only letters,
numbers, underscores, and hyphens. Other symbols such as percentage and
question marks may cause some problems when you upload your files on the
internet.
3. Resolution. The larger the picture, the longer it will load on the internet. Images with
more than 60 Megapixels just won’t be uploaded as it is the restriction.
4. Color Mode. Use the RGB Color Mode. The CMYK won’t render in most browsers.
5. Color Profile. Use the sRGB Color Profile. It is the world’s default color space.
6. File Size. For best results, control the file size of your image to 500k or below,
although you can upload images of 20 MB file size.
7. Image Width. The recommended width for the image is between 1500 to 2500 pixels.
8. Image Cropping. Cropping an image would downsize the file size. When reviewing
pictures to be integrated into your Animation, crop those pictures that need some
correction or focus.
9. Image Text. Use the overlay text as much as you can. They are more adaptable to
mobile devices.
10. Image Name. Name your image properly so when it doesn’t load, your viewer still
has an idea what it is all about.
11. Aspect Ratio. This is also known as the dimension of the graphic, which is a topic I
have already discussed. This is the width and height of the graphics. There is a
recommended Aspect Ratio for different graphics. The standard Aspect Ratio for
web banners is 468 x 60 pixels. Adobe Animate CC has predefined templates that
you can use so you don’t have to worry much.
12. Orientation. The usual orientation of Animation is landscape but you can have it
your way or whatever the customer wants you to do.
13. Page Size. Every element on your page adds to the page’s size. The
recommended page size is 5 MB or under.
____________________________________________________________________________
TLE 7/8-ANIMATION AUTHOR /
Quarter 1-Week 3 TEAM LEADER: ROMEO N. PARAS
4
Activity 1
Play the Crossword Puzzle below. Use the clues provided right after the grid. For the
sake of the computer program, we will omit space between words. For example, the word
“The Space” would be “TheSpace” when you want to look for it on our puzzle.
1. Some of the files that work on the internet include .swf, .jpg, .gif, and png. Do not upload your native files such as .fla. Aside
from it won’t work on the internet, people will have access to your original creation and claim it for themselves.
2. In naming your Animation files particularly the .swf, use only letters, numbers, underscores, and hyphens. Other symbols such
as percentage and question marks may cause some problems when you upload your files on the internet.
3. The larger the picture, the longer it will load on the internet. Images with more than 60 Megapixels just won’t be uploaded as it is
the restriction.
4. Use the RGB Color Mode. The CMYK won’t render in most browsers.
5. Use the sRGB Color Profile. It is the world’s default color space.
6. File Size. For best results, control the file size of your image to 500k or below, although you can upload images of 20 MB file
size.
7. The recommended width for the image is between 1500 to 2500 pixels.
8. Cropping an image would downsize the file size. When reviewing pictures to be integrated to your Animation, crop those
pictures that need some correction or focus.
9. Use the overlay text as much as you can. They are more adaptable to mobile devices.
10. Name your image properly so when it doesn’t load, your viewer still has an idea what it is all about.
11. This is also known as the dimension of the graphic, which is a topic I have already discussed. This is the width and height of the
graphics. There is a recommended Aspect Ratio for different graphics. The standard Aspect Ratio for web banners is 468 x 60
pixels. Adobe Animate CC has predefined templates that you can use so you don’t have to worry much.
12. The usual orientation of Animation is landscape but you can have it your way or whatever the customer wants you to do.
13. Every element on your page adds to the page’s size. The recommended page size is 5 MB or under.
5
Name the different good practices in maintaining tools and equipment.
1. What are the objects to be measured in Animation? List each one and explain.
2. What are the job requirements in Animation? List each one and explain.
specifications in Animation? List each one and explain.
Note: If you score 50% or more of the Self-check, then, you’re learning just right.
Otherwise, you might want to spend some time reading the text and re-taking the quiz until
you gain the mastery of the lesson.
Lesson 2
Calculations needed in Animation
There are certain things you need to calculate as an Animator especially when you
want to execute your Animation on stage the way you want it. Some of them are related to
your computer hardware while others are related to the usage of your computer software.
We use different kinds of graphic objects to be inculcated to our Animation and because of
this, we need to compute and adjust for their file size and frames per second that affects the
performance of our output. These are some calculations needed in Animation.
1. Frames per second. The default frames per second for Adobe Animate CC is 24
frames per second or fps. Let us say you want to animate the word “YOU” on stage
and each letter has to animate for a second. Then, you need 72 of the total frames.
You can adjust, however, the number of frames per second. If you want to
accommodate more frames per second, then, you should increase the number of
frames, let’s say 36. If we set our fps to this setting, then, the “YOU” example we had
previously would have a total of 108 fps. It can be illustrated by the following
mathematical expression:
Defined fps x Defined number of animation objects per fps = Total number of
frames.
So using the example above with the defined fps of 36, we will have…
36 x 3 = 108. The first number is the defined fps while the second is the defined
number of animation objects per fps. The last number is the answer.
2. The Pixel Count. You have dreamt of buying your digital camera and you want it to
be at least 10 Megapixels. What could be the largest print you could have?
Remember about the dimension of the picture I have talked about earlier? The
Megapixel is the largest possible pixel dimension of a picture you could take using
that camera. For that 10 Megapixel camera, that would be 3872 x 2592 pixels
approximately. In fact, the exact dimension would be 10036224 pixels. For the
____________________________________________________________________________
TLE 7/8-ANIMATION AUTHOR /
Quarter 1-Week 3 TEAM LEADER: ROMEO N. PARAS
6
Manufacturers’ convenience, they would just divide it to a million and round it off to
the nearest million, so we simply get 10 Megapixels.
The formula therefore for getting how many Megapixels your camera could
generate would be:
Pixel Dimension / One Million = Megapixels (of your Digital Camera). The
example above is just right. Let me show you its mathematical expression.
Simply round off the answer to the nearest million and voila, you have your answer in
Megapixels.
3. The Printing Resolution. The Pixel Count is not the total determinant of the quality of
your picture. Do you want to know why? Your digital camera only produces the
softcopy. When you print it, you can still adjust your printer how many dpi you would
want to apply to the printed picture. Let us say you set your printer to 300 dpi and the
softcopy of the picture that your digital camera produced has a dimension of 4,500 x
3,000 pixels. How large could be the printout of the picture? To answer this, we
would use the formula:
Width of the pixel / Defined dpi x Height of the pixel / Defined dpi = The Size of
the Picture Printout
4,5000 / 300 x 3,000 / 300 = 15 x 10 inches. This is the size of our printed
photo or the Pixel Density.
Activity 2
Use a separate sheet of paper and answer the following. Show your solution:
1. If you set the fps to 20 and you want to animate the word “NICE” with the letter N has
to animate for 2 seconds; I for 3 seconds; C for 4 seconds and E for 5 seconds.
What would be your Total Number of Frames?
2. Using the problem no. 1, the NICE would change its value to 6, 7, 8, 9 respectively.
What would be your Total Number of Frames now?
3. If your digital camera can print a picture of 4290 x 2800 pixels, how many Megapixels
does your camera have?
4. If on the other hand, your digital camera can print a picture of 4920 x 3264 pixels,
how many Megapixels does your camera have?
____________________________________________________________________________
TLE 7/8-ANIMATION AUTHOR /
Quarter 1-Week 3 TEAM LEADER: ROMEO N. PARAS
7
5. How big would be your picture printout if you set your printer to 72 dpi and you took a
photo on your digital camera with a pixel dimension of 4,500 x 3000 pixels.
Write the word “True” if the statement is true and “False” if the statement is false. Use the
space provided.
1. __________. The default frames per second for Adobe Animate CC is 24 frames per
second or fpsSystem
2. __________. You can adjust the number of frames per second on Animate CC.
3. __________. Megapixel is the largest possible pixel dimension of a picture you could
take using that camera.
4. __________. The Pixel Count is not the total determinant of the quality of your picture.
5. __________. You can still adjust your printer how many dpi you would want to apply to
the printed picture
● As an Animator, you will be working most of the time with vector objects. However, this
doesn’t mean that you will not encounter other kinds of graphics
● There are certain things you need to calculate as an Animator especially when you want
to execute your Animation on stage the way you want it. Some of them are related to
your computer hardware while others are related to the usage of your computer software.
Matching Type. Match Column A with Column B. Write on the blanks only the letters of the
correct answers.
____________________________________________________________________________
TLE 7/8-ANIMATION AUTHOR /
Quarter 1-Week 3 TEAM LEADER: ROMEO N. PARAS
8
Column A Column B
___3. frames per second c The other color you can produce in a 2-bit
video card aside from black and white.
What does your score try to say? What does it mean to you? After comparing your
answer with the ones below, can you actually say that you have learned? What have you
learned? Explain your answer in a separate sheet of paper.
____________________________________________________________________________
TLE 7/8-ANIMATION AUTHOR /
Quarter 1-Week 3 TEAM LEADER: ROMEO N. PARAS