Page 1 :
Animations With, Adobe Animate CC, , 7, Learning Objectives, What is Adobe Animate?, , Creating Animations, , Advantages of Using Animate CC, , Understanding Symbols and Instances, , Elements of Animate Interface, , Frame-by-Frame Animation, , Creating a New Animate Document, , Tween Animation, , Shapes in Animate, , Motion Guide Tween, , Drawing Objects, , Tint Tween, , Editing Objects, , Shape Tween, , Introduction, One way to share information about your ideas or thought in an entertaining and, understandable way is to use animations. Animation gives life to your ideas and it connects, with a huge variety of people all across the globe. It impacts people of all ages, genders etc., You can do so much with it., , What is Adobe Animate?, Adobe Animate CC is a software package by Adobe that allows you to, use drawing tools for creating your imaginations and a movie editor to, make animations and games. It is a part of Adobe creative cloud series,, which was earlier popularly known as Adobe Animate Professional., , Info, The concept taught in this chapter can be tried in any version of Adobe Animate professional series., , Advantages of Using Animate CC, • It is a multimedia graphic program especially for use on the Web to create animated text,, graphics and games., • Animations created using this software are commonly used to display advertisements, and games on the webpages., Animations With Adobe Animate CC 93

Page 2 :
• It uses vector graphics which means that the graphics can be scaled to any size without, losing clarity and quality., • It does not require programming skills and is easy to learn., • Final output is small in size and can be published in familiar platforms like HTML5 Canvas,, Animate Player & Air, WebGL and even Snap SVG., , New Features of Adobe Animate CC, , Adobe Animate Camera: It introduces virtual camera functionality. With the help of this, feature, you can easily stimulate your camera’s movement giving your animation a more, realistic view., Export format: It has adapted the web standards for exporting your animation which makes, it easier for everyone to view it from desktop to mobile device., Vector Brushes: Another important functionality that Adobe Animate has brought is giving, the opportunity to create vector brushes. With this update in brushing tools, one can have, pressure and tilt functionalities on drawing of lines and strokes with the help of pen or stylus., Audio Syncing: The timeline feature of the tool will allow the users to sync audios in their, animations and this is yet another feature that Animate CC has added. Which means you can, do audio synchronization for your animation series., Font: Adobe Animate CC comes now with integration of Typekit where you get countless, premium web fonts., , Starting Adobe Animate CC, The way that you start Adobe Animate is dependent on the version of MS Windows you're, running on your computer. In Windows 7/10, type Animate in the Search box and then click, on the Adobe Animate CC 2015, option., The Animate CC welcome screen, appear as shown here:, Click on the Action Script 3.0, under Create New section to, open the Animate document., , 94 Brainy Gigabyte+ 7

Page 3 :
Elements of Animate Interface, Before you can begin to create interactive animations in Animate, you need to be familiar with, its working environment. The document window you will see contains five major elements:, Timeline, Stage, Work Area, Properties Panel and Tools Panel., Menu Bar, , Tools, Panel, Stage, , Panels, , Timeline, Properties, Panel, , Menu Bar, , The Menu bar provides control over common functions like opening, closing and saving of, an Animate document., , Stage, , The stage is displayed in the center of the screen. This is simply our visual workspace where, we can create our drawings or movies. The most important point we have to keep in mind, about the stage is its size. By default the stage size is a rectangle with dimensions of 550, pixels width by 400 pixels length or height. But we can change the width and height of our, movie through Movie Properties dialog box (Click Modify >Document or Ctrl+J)., , Properties Panel, , It provides options for changing the properties of the currently selected tool in the tools, panel or the selected object/graphics on the stage. This panel save times and efforts as we, do not have to open multiple menus or panels to change these properties. If it is not visible, then you can display it by selecting Window >Properties >Properties from the menu bar or, by typing Ctrl+F3., , Timeline, , The Timeline is what determines the order in which your frames and layers appear and how, long each frame will stay on stage. It controls and shows all the elements of your project, over time., Animations With Adobe Animate CC 95

Page 4 :
Playhead, Frame View, Layer Controls, , Status Bar, , • The Playhead tells you which frame is currently displayed on the Stage., • Status Bar gives you information about the current frame, the number of frames per, second (fps) and the elapsed time of your movie, • The Frame View is a drop down menu that lets you control the appearance of the Timeline., , Tools Panel, , Like any other drawing and animation software, Animate has its own set of tools. If you have, used other graphic applications like Photoshop, GIMP, some of the tools may look familiar., In the toolbox we have all the tools for drawing, painting and modifying objects. It is dockable and default location is locked to the right side of the Animate window., Explore the tools panel labeled below and observe it is divided into four sections., Tools Area: This area contains tools for drawing, painting and selecting regions., View Area: This area contains tools for zooming and moving the view of the, objects on the stage., Color Area: This area contains modifiers for selecting the stroke (line) color and, the fill color of the object., Option Area: This area displays modifiers for the tools that have been currently, selected in the tools panel. Modifiers allow us to change the painting and editing, operations of the tools., Before you start using drawing and coloring tools of Animate, let's take a quick, look at all the tools present on the tools panel. Click on the desired tool in the, toolbox to activate it., The selection tool lets you select elements (shapes, strokes, fills, symbols) in the, work area by clicking on it. If you wish to select several objects together hold, down the SHIFT key and make a selection of other objects., • The lasso tool allows you to select an object or a part of an object by drawing selection, outline around it., • The line tool creates straight lines. Hold down the Shift key and you'll get lines that are, at an angle of 45 degree. Color of the lines can be modified with the Ink Bottle., 96 Brainy Gigabyte+ 7

Page 5 :
• The pen tool creates a straight or a curved line., • The text tool allows you to add text fields to your movie., • The oval tool creates circles and ovals. Hold down the Shift key and you can create a, perfect circle., • The rectangle tool creates squares and rectangles. Hold down the Shift key and you can, create a perfect square., • The pencil tool draws lines in three, different modes: straighten; smooth, ink., Hold down the Shift key to create perfect, straight lines., , Free, Transform, , • The brush tool creates shapes with the, fills only., • The free transform tool allows you to, modify objects. You can scale, rotate, flip, or skew., • The fill transform tool allows you to, change the size, direction or center of a, gradient or bitmap fill., , Selection, , Pen, , Pencil, Bone, , Lasso, Line, , Brush, Eraser, , Zoom, Stroke Color, Fill Color, , Subselect, 3-D Rotation, , Text, , Rectangle, , Deco, Paint Bucket, Eye Dropper, Hand, , Tool Modifier, , • The paint bucket tool adds a fill inside a shape or changes the color of the fill., • The eraser tool is used to remove unwanted areas on the stage., • Stroke color changes the color of the stroke, or the border of a graphic object., • Fill Color changes the color of the fill. This tool covers the shape with color., , Creating A New Animate Document, Besides directly from the Animate welcome screen, we can also create new Animate document, using menu bar Click File>New option. This will display the New Document dialog box, and allow us to change the following, document properties., • Width and Height: It is used to set, the size of the stage. The maximum is, 2880×2880 pixels and the minimum, is 18×18 pixels., • Ruler Units: It is used to specify the, unit of measurement of the rulers that, can be displayed along the left and, the top side of the stage., Animations With Adobe Animate CC 97

Page 6 :
• Frame Rate: It is used to specify the speed of the movie. The speed of the movie is, measured by frame per second (fps). 24 fps is the default frame rate., • Background Color: It is used to change the background color of the stage, the default, color is white., , Shapes in Animate, In Animate, images are referred as shapes. Before you begin to explore the drawing tools, it, is important to understand the fundamental logics behind shapes in Animate. Each image, consists of a stroke (an outline) and/or a fill., Any closed shape is made up of both the stroke and a fill. e.g. circle, square, polygon etc., , As shown here, the stroke and the fill of the shape are separated. Now there are two parts of, the same object., , Drawing Objects, Example: With the help of drawing and coloring tools draw a colorful tree., Step 1: Choose View ® Grid, from the menu., Step 2: Select the Pencil tool., Step 3: Click the Stroke color box and select brown as the stroke color., Step 4: Click the fill color box and select brown as, the fill color., Step 5: S,  elect the smooth option from the modifier, panel to round the corners of the drawing., Step 6: Draw the tree trunk., Step 7: Select the Paint bucket tool and Click inside, the trunk to fill the trunk with brown color., Step 8: Select the Pencil tool., Step 9: Click the Stroke color box and select green, as the stroke color., Step 10: Click the Fill color box and select green as, the fill color., Step 11: Draw a treetop as shown here:, 98 Brainy Gigabyte+ 7

Page 7 :
Step 12: Select the Paint Bucket tool and Click inside the treetop to fill it with green color., Step 13: Click the Selection (Arrow) tool., Step 14: Double Click on the tree top., Step 15: Drag the treetop over the tree trunk., Step 16: Use the text tool to type TREE., Step 17: From the Properties panel, select the font, font color and its size., Step 18: Click on the stage at the desired location and start typing. The textbox expands in, the vertical direction as you type., , Grouping Outline With Fill :Ctrl+G, , When we draw a tree top, Animate actually creates two objects: the fill and the outline. This, may cause problems if we want to move our object. A good idea is to 'group' the outline with, the fill, this will lock them together as a single object., Step 1: Click the Selection tool and drag a rectangle outside the tree, to select the entire, tree., Step 2: Click Modify ® Group or Press Ctrl+G to group it., , Animations With Adobe Animate CC 99

Page 8 :
Saving Animate Document, , You can save an Animate document, file using file name and location. This, is the source Animate document that, we save while working. This file has an, extension .fla. It means any file with, .fla extension can be opened and, edited., , Choose a location, , Type a file name, , Step 1: Click File ® Save, Step 2: Type ‘Tree’ in the File name, box and Click Save., , Click Save when done, , Info, • The Animate document file has an extension .fla which can be opened and edited., • The Animate player file has an extension .swf which can only be viewed but you can't edit it., , Importing Graphics, , In Animate, it is not always required to draw an object, on the stage and then create animation. You can use the, external images to create animation., Step 1: Select File ® Import ® Import to Stage, The import dialog box appears., Step 2: Browse and select the image file that you want, to import., Step 3: , Click OK and the, picture will be placed, on the stage., , 100 Brainy Gigabyte+ 7

Page 9 :
Editing Objects, Now that you have learnt how to draw and import objects on the screen. In this session you, will learn to edit objects, but before editing the image should be selected first. Let us learn, how to use selection tools., , Selecting Objects, Step 1: Select the Selection(Arrow) tool., Step 2: Move the mouse pointer over the, object you want to select OR you, can select a fill and its surrounding, line border by double-clicking, the fill., Step 3: Selected object appears, highlighted with a pattern., , Selecting Irregular Objects, Step 1: Select the Lasso tool., Step 2: Move the pointer over the stage, area, it changes to lasso., Step 3: Click and drag lasso around the, object until you reach the point, where you started., Step 4: Release the mouse button., , Moving the Object, Step 1: Select the Selection tool., Step 2: Select the object you want to, move., Step 3: A Plus(+) sign appears next to, the Arrow., Step 4: Click and Drag the object to a, new position., Step 5: Release the mouse button and, the object is moved to a new, location., Animations With Adobe Animate CC 101

Page 10 :
Resizing the Object, , Step 1: Select the Selection tool., , Step 2: Double Click the object to select, it., Step 3: Click the Free Transform tool., , Step 4: Click and drag the object's resizing, handles in or out to increase or, decrease the object size., Step 5: Release the mouse button., Step 6: The fill will be resized., , Rotating an Object, , Step 1: Select the Selection tool., Step 2: Click the object to select it., Step 3: Click Free Transform tool., Step 4: Move the pointer to any of the, corner resizing handles, the, pointer will change to rotation, handle., Step 5: Click and drag a rotation handle, to rotate the object., An outline of the object appears as you rotate., Step 6: Release the mouse button and see the object has rotated or changed direction., , Flipping an Object, Step 1: Select the Selection tool., Step 2: Double-Click the object to select it., Step 3: Click Modify menu., Step 4: Click Transform., Step 5: Click Flip Vertical or Flip Horizontal., , Creating Animations, Animation is made from individual images. It is a collection of still images, but these images, appear in motion in an animation. Using Animate we create animations by changing the, contents of successive frames. We can make an object move across the stage, increase or, decrease its size, rotate, change color, fade in or out or change shape while animating., 102 Brainy Gigabyte+ 7

Page 11 :
Components of Animation in Animate, Let's understand general animation terms, their meaning and how these terms are applied, in Animate., Timeline, The timeline is one of the most important and essential part of the Animate interface. It, organizes and controls a movie's content over a time period in layers and frames., Keyframes, , Frames, , Layers, Frame Rate, , Frames, It is already explained that animation is a series of still images. Each image is represented by, a dot in a frame. In Animate, frames are the little rectangular cells in the Timeline., Keyframe, A keyframe is a frame in which we define a change or modification in an animation or include, frame actions to modify a movie., Layers, Layers are like transparent sheets that are arranged one over the other like stacks of sheets., When we create a new Animate movie, it contains one layer. We can add more layers to, organize the artwork, animation and other elements in our movie., Frame Rate, Frame rate is the speed at which frames are played by the user and is measured in frames, per second (fps). We can change the frame rate through Properties panel or from Movie, Properties dialog box (Modify > Movie)., , Animations in Animate, There are two methods for creating an animation sequence in Animate:, •  Frame-by-frame Animation      •  Tweened Animation, Something really amazing about Animate is that it allows you to create a graphic once and, use it over and over again. This allows your Animate animation to download or work quickly., Before creating animations in Animate, first let's understand the concept of symbols and, instances., Animations With Adobe Animate CC 103

Page 12 :
Understanding Symbols, One of the most efficient ways to use Animate is to use symbols whenever you need more, than one occurrence of a graphic or animation or sound. Symbols are reusable elements, stored in the Animate library that you create once and then reuse in your movie or other, movies as many times you want. In order to apply animation to the object or graphic in, Animate it must first be changed into a Symbol., , What are Instances?, When we place a symbol on the stage from the library it is called an instance of that symbol., , Info, How Symbols helps us?, • It is a good idea to use symbols, when a particular element appears more than once in a movie., • We can edit the master symbol to change all instances in a single go., • Using symbols and putting them in the library helps us to reduce the file size., , Convert the Graphics to a Symbol, , Step 1: Open the new Animate document., Step 2: Draw any object or import it i.e. car., Step 3: With the help of selection tool, select the car, object., , Step 4: Choose Insert ® Convert to Symbol or, just press F8. The Symbol properties dialog box will open., Step 5: Type Car in the Name field., Step 6: Select Graphics as the behavior., Step 7: Click OK., Step 8: Press Ctrl+L to open the library, window and notice one symbol, 'Car' in the library., Step 9: Delete the Car from the stage and, drag it from the library for use., , Frame-by-Frame Animation, In frame-by-frame animation we create the image in every frame. This is the most time, consuming method, but sometimes it's the only way to get the effect we desire., Before you start creating Animate animation you need to set the size of the movie, the speed, at which it should play and the color of the background., 104 Brainy Gigabyte+ 7

Page 13 :
Step 1: To set the dimension of the movie. In the Properties Panel, type 400 px in the Width, field and type 400 px in the Height, field., Step 2: Click the Background color box and, choose blue as the background, color., Step 3: N,  otice that the default frame rate is, 24, change it to 12. This means the, number of frames per second (fps), that your animation will play is 12 fps., Step 4: Select the Text Tool, click on, the stage and type the alphabet, H. Format your text (font, color,, and size), highlight it and change, settings from the Properties Panel., Step 5: Click on the second frame in the, timeline., Step 6: Insert a keyframe i.e. select Insert ® Timeline ® Keyframe or just Press F6., Step 7: Click the second keyframe to select it., , Step 8: Type E next to H. Be sure your text tool, is selected while entering text and if, you want you can change the color of, the text., Step 9: Click on the third frame and press F6., , Info, What is Library?, Each Animate file has its own library where, you store and organize symbols created in, Animate or drawings from other sources., , Step 10: Type L next to HE., , Step 11: Click the fourth frame and, press F6., Step 12: Type L again next to HEL., , Step 13: Click the fifth frame and, press F6., Step 14: Type O next to HELL., , Finally your Animate windows should, be as shown here., , Step 15: Select File ® Save to store, your work., Animations With Adobe Animate CC 105

Page 14 :
Reviewing Animation, There are three ways to watch the entire animation., Scrubbing: It means scrubbing the red marker from start to end., Playing: Select Control, , Play, , Testing: Select Control, , Test, , Test option will export .swf file into the folder. Goto the folder, and double-click the .swf file. This will launch the Animate Player, program to view the result., , Tween Animation, Creating an animation by using frame-by-frame technique requires a lot of work and attention, because we have to draw every frame by ourselves. The term 'Tweening' is derived from 'in, between'. Sometimes you want to add an effect that is graduated over several frames. For, example, moving a car from the left side of the movie to the right side., Instead of moving the car a little bit in each frame, you can simply position the car on the, first frame, and then insert a keyframe where the car should stop and finally tell Animate to, tween between the first and the last keyframes., AIM: Moving Car movie by using Tween., Step 1: Draw a car or import it to the stage., Step 2: Select the car and convert it to a, symbol by pressing F8 and delete it, from the stage., Step 3: Open the Library panel (Ctrl+ L) and, drag a copy of the car to the stage., At the frame 1, place the car on the, left side of the stage., Step 4: To enter a keyframe in frame 30, first, click frame 30 in the timeline and, then press F6., Step 5: Click frame 30 and place the car on, the right corner of the stage., Step 6: , Just place your mouse pointer at, Frame 1 and Right-Click it, a menu, will appear., Step 7: , Select the option ‘Create Classic, Tween’., 106 Brainy Gigabyte+ 7

Page 15 :
Step 8: Save the movie., Step 9: Choose Control Test Movie from the menu to play the movie. Your Car moves, across the Stage., , Motion Guide Tween, Motion Guide is actually moving your symbol in a predefined path such as curves or circles., Further we learn how to move Animate objects in circular, zigzag or curved paths using, Animate motion guide., AIM: Flying a butterfly using motion guide., Step 1: Draw a butterfly or import it., Step 2: Convert it to a symbol and delete it from the stage., Step 3: , Move to the library Panel and drag a copy of butterfly to the stage., Step 4: To enter a keyframe in frame 30, first click frame 30 in layer one on the timeline and then, press F6., , Animations With Adobe Animate CC 107

Page 16 :
Step 5: Right Click on frame 1 and choose Create Classic Tween., Step 6: Click Frame 30 and select the, butterfly to place it to the, right side of the stage., Step 7: Right click on Layer 1. A popup menu appears. Select the, option 'Add Classic Motion, Guide'., Animate now inserts a new layer on top, of layer 1, with the Motion Guide icon, to the left of the layer's name., Step 8: , Click on the Motion Guide, Layer to make sure it is the, active layer. (Click on the layer, name, where it says 'Guide:, Layer 1')., Step 9: , Choose Pencil tool in the, toolbox. Make sure Pencil, mode is set to 'Smooth'., With the pencil tool draw the path you, want the butterfly to fly along as shown, in the example here., Step 10: Now adjust the frame pointer so that it points, to frame 1., Step 11: , Using mouse, position the butterfly so that, its center is at the beginning of your motion, guide. (The center is indicated by a small +, sign when selected). A black circle appears, when the butterfly is attached to the motion, guide., Try zooming in or out if you can't get the butterfly to, attach it to the guide path., Release the mouse button when the butterfly is, attached to the guide path., Step 12: G,  o to frame 30 and repeat the process, of placing the butterfly at the end of the, motion guide., 108 Brainy Gigabyte+ 7

Page 17 :
Step 13: Save the movie and click Control >Test Movie to, play the movie., Congrats! You have created a Motion Guide Tweening!, The butterfly will now follow the motion guide path but notice,, when you play the movie the path will be not visible., , Info, ·, , Motion guide layers are used to draw paths that you want an animated symbol to follow., , · The .swf file is the compressed and final Animate media that you use in PowerPoint presentations or, would embed in an HTML page to play in a browser with the Animate Player. Animate displays the, SWF file in a new window with the exact stage dimensions and plays your animation., , Tint Tween, A Tint Tween uses Motion Tween to change the symbol's tint or shade over the time. You, could start with a green object, set the second keyframe to grey and the last keyframe to, blue and your object would fade from green to blue. Apart from this you can rotate, scale or, move this object and even make any other changes that you want., Step 1: Create a new Animate document, change the stage background color and fps, settings to 12., Step 2: Select Text tool from the tools panel. Enter your first name using bigger font size, and bold it. It is important that the font is not too thin., Step 3: Convert it into a symbol. Make sure the 'Graphic' option is selected., Step 4: , Delete the text from the, stage., Step 5: , Open the Library panel, and drag the text onto the, stage of the movie., Step 6: , Select frame 30 in the, timeline and click F6., Step 7: Enter keyframe in frame 15, by positioning the frame, pointer at frame 15 and, then press F6., Step 8: Select frame 1 and click the instance of text to select it., Animations With Adobe Animate CC 109

Page 18 :
Step 9: From, the, Properties, Panel, in the section 'Color, Effect', click the Style, drop-down box choose, 'Tint'. Position the 'Tint, Amount' bar at 100%. (If, it is set to zero, no tinting, will appear). Enter these, values Red : 255, Green :, 0 and Blue : 0., Step 10: Add tint tweening to, keyframe 15 with the, settings. Red:0, Green:255 and Blue:0., Step 11: Select frame 30 and add, tint tweening with the, settings. Red:0, Green:0, and Blue:255., Step 12: Add the motion guide, between the frames 1 to, 15 and 16 to 30., Step 13: Press Ctrl+Enter to, observe the output., , Shape Tween, By tweening shapes, you can create an effect similar to morphing means that making one, shape appear to change into another shape as it moves. In shape tween, Animate can also, tween the location, size and color of shapes., Step 1: Select the first frame. Now go to your working area and type the text. From the, Properties panel, change the color,, font and its size., Step 2: Select the text and Press Ctrl+B to, break apart the text block, because, shape tween only works with break, apart(ungrouped) objects., Step 3: Select frame 30 and press F6 to, insert a new keyframe., 110 Brainy Gigabyte+ 7

Page 19 :
Step 4: Still keeping playhead on frame, 30, delete the text present in, your working area. Now type, another text and press Ctrl+B to, break it apart., Step 5: , Select Frame 1 and choose, Insert ® Shape Tween., You can see an arrow and a green shaded, area that appears between the starting and, ending keyframes, indicating that you've, successfully created a, shape tween., Step 6: Press Ctrl+Enter, to observe the, output., , Info, When you use shape tween, don't convert your objects into symbols because it will not work with, symbols., , Now You Know, • Adobe Animate CC is a multimedia program used to create animations and interactive, movies for the web., • Animate interface window contains five major elements, namely Timeline, Stage, Work, Area, Properties Panel and Tools Panel., • The stage is a workspace where graphics, text and other elements are placed to create an, animation., • The Timeline controls and shows all the elements of the animation/movie., • The properties panel displays the characteristics of the selected object., • Animation in Animate is created by changing the content of successive frames., • The speed of the animation is measured in frames per second (fps)., • In frame-by-frame animation we create the image in every frame., • Symbols are the reusable elements stored in the Animate library., • In Tween animation, we just create the starting and ending frames., Animations With Adobe Animate CC 111

Page 20 :
•, •, •, •, , Motion guide is used to move any object in a pre-defined path drawn by the user., Shape tween changes the shape of the object at different frame position or shape., Tint Tween is used to change the symbol's tint(color)., Control > Test command exports the .swf file i.e. flash player file., , Computer Lab Activity, ACTIVITY 1: Animating Text., Step 1: Create a plain text using text tool in Flash., Step 2: Choose the Selection tool and click a text, block., Step 3: Select Modify>Break Apart (Ctrl+B). Each, character in the selected text is placed in a, separate text block. The text remains at the, same position on the Stage., Step 4: Select the text block one by one and change, their colors., Step 5: Make the changes in the positions of the, alphabets., Step 6: Click the Second keyframe and press F6 to, insert keyframe. Make a change in the color, and the position of the alphabets to produce, an animation sequence., Step 7: , Repeat the step 6 to create the desired, animation., Step 8: Save the work and test the movie. by (Ctrl, +Enter)., ACTIVITY 2: Give a circular motion to the Fish., Step 1: Draw or import a Fish and convert it into a, symbol. Delete it from the stage., Step 2: Drag the Fish graphic symbol from library, to the stage., Step 3: Go to 'Frame 40' of Layer 1 and press F6 to, insert a new keyframe., Step 4: Select any frame from 1 to 40 of layer1., Right click and select 'Create Motion, Tween' from the pop-up menu., 112 Brainy Gigabyte+ 7

Page 21 :
Step 5: Right click on the Layer 1 and select 'Add Motion Guide' from the pop-up window., A new layer will appear on top of the Layer 1, with the label 'Guide:Layer1' along with the, guide icon can be seen., Step 6: Make the Guide Layer active and on, the stage draw the path for your Fish, using pencil with smooth option. For, example: draw a circle for Fish., Step 7: Now go to 'Frame 1' of 'Layer 1' and, drag your butterfly to one end of your, path. While dragging, you will see a, bubble on the symbol. This bubble, should go right below the path. Just, like the one shown here., Step 8: In frame 40 of layer 1, drag your, butterfly to the other end of the path., Again, the bubble should go right, below the path., Step 9: Select the Frame 1 of layer 1 and in, the Properties panel select the option, 'Orient to path'., Step 10: Select the option 'CW'(Clock-Wise), in the Rotate section and enter the, rotation number to 4 times and, observe what happens., , Step 11: Press Ctrl+Enter to watch the movie., Animations With Adobe Animate CC 113

Page 22 :
Assessment Sheet, A., , Tick () the correct option for the following statements., 1. The company that has the copyrights of Animate software., , a), , b), , Apple, , c), , Microsoft, , Adobe, , 2. The visual workspace displayed at the center where we create our drawing and movies., a), , b), , Frame, , c), , Timeline, , Stage, , 3. The area on the animate interface which shows all the elements of our project., a), , b), , Timeline, , Properties Panel, , c), , Stage, , c), , 550 × 400 pixels, , 4. The default stage size of the animate document., a), , b), , 500 × 450 pixels, , 400 × 550 pixels, , 5. The tools used to draw lines on the stage., a), , Pencil, , b), , c), , Line, , d), , Brush, , All of them, , 6. The panel which is used to modify the color and thickness of a line., a), , Color, , b), , Properties, , c), , Tool, , c), , Frames, , c), , fss, , 7. The reusable elements that can be saved in the library., a), , Symbols, , b), , Layers, , 8. The term that is used to measure the playing speed of the frames., a), , fps, , b), , lps, , 9. The type of animation in which we create the motion by making changes in every frame., a), , Tween, , b), , Frame-by-Frame, , c), , Shape, , 10. The type of animation in which we just create the starting and ending frames., a), , Frame-by-Frame, , b), , Tween Motion, , c), , Shape Tween, , 11. The animation in which one shape appears to change into another shape., a), , Motion guide, , b), , Tween, , c), , Shape Tween, , 12. The technique that is used to move any object in a user defined path., a), , Tween guide, , b), , Path guide, , c), , Motion guide, , c), , 24 fps, , 13. The default speed (fps) of the animate movie., a), , 12 fps, , 114 Brainy Gigabyte+ 7, , b), , 10 fps

Page 23 :
B., , Give one word answer for the following statements., Help Box, , C., , Library, .fla, Symbols, White, Frames, .swf, , 1. The default background color of the stage., , _________________, , 2. The reusable elements that can be saved in the library., , _________________, , 3. The file extension name for the animate document file., , _________________, , 4. The file extension name for the animate player file., , _________________, , 5. They are the little rectangular cells on the timeline., , _________________, , 6. The panel in which animate stores all the symbols created by the user., , _________________, , Define the following terms., 1. Timeline:, , ______________________________________________________________________, , 2. Frames:, , ______________________________________________________________________, , 3. Frame rate: ______________________________________________________________________, 4. Symbols:, D., , ______________________________________________________________________, , Select the correct key/key combination for the following options., 1. To insert a keyframe with a copy of previous keyframe., , a), , F9, , b), , F6, , c), , Copy>Paste, , b), , Shift + Enter, , c), , Alt + Enter, , b), , Shift + L, , c), , Ctrl + L, , b), , Shift + G, , c), , Ctrl + G, , b), , Ctrl + B, , c), , Ctrl + O, , 2. To view your animation., a), , Ctrl + Enter, , 3. To open the library panel., a), , Ctrl + O, , 4. To group the object., a), , Ctrl + O, , 5. To break apart the grouped object., a), , Ctrl + A, , E. Answer the following questions., 1. What is Adobe Animate? Explain its utility., _______________________________________________________________________________, _______________________________________________________________________________, Animations With Adobe Animate CC 115

Page 24 :
2. Explain the methods used for creating an animation in Animate., _______________________________________________________________________________, _______________________________________________________________________________, 3. Why frame-by-frame technique is tiring and time consuming for creating animations?, _______________________________________________________________________________, _______________________________________________________________________________, 4. When should one use the 'Tween' to animate an object?, _______________________________________________________________________________, _______________________________________________________________________________, 5. What is Shape Tween and why do we use it?, _______________________________________________________________________________, _______________________________________________________________________________, , Application Based Questions, 1, ,  unal wants to create an animation movie for inter-school competition. Read the following and, K, help Kunal to answer them., a), , Suggest him the software to be used for this purpose., , ______________, , b), , The technique he should use to display the zig-zag movement of an object., , ______________, , c) A text field is selected on stage and he needs to separate each letter of his, own text field., , ______________, , d), , The action that allows to save the object in the library panel for future use., , ______________, , e), , The technique he should use to take a word and animate each letter separately. ______________, , f), , Name the command he should used to create animate player file(.swf)., , ______________, , 2. Somya is creating an animated text banner for web page. Help her to recognize the following tools, with their respective functions., a) , , _________________, , c), , _________________, , b) , , _________________, , d), , _________________, , 116 Brainy Gigabyte+ 7