Hi everyone. Arawa media brings you another video tutorial. In this, we will see some of the thoroughly explained simple and advanced style image animations in Flash using different filters, properties, and much more. So, let's start with a new flash document. It has to be an image animation file. So the first thing we would need are the images.

To import those images on stage. Go to File, Import import to stage. Here, open the path where you have kept your images ready. You can pick any of your favorite images to work on. We have here a total of 19 images with the same sequence numbers. Out of all these select the first image underscore 001 file and say open flash will pop up a panel here Asking if we need all those images to be imported in sequence along with the first selected image, you can select no option if you want to import just a single image file.

But here we go for Yes, as we want all 19 images to be imported onstage. In timeline, you will notice a number of key frames inserted automatically. Those are the 19 key frames for the 19 image files imported in a sequence. Press Ctrl plus minus sign to zoom out the stage area. Put the layer on outline mode. The imported images are larger than the stage size.

The white patch is the stage size and green wireframe is the image outline. So let's lower down these image sizes. We can scale them in Flash, but the image size will remain the same It might also affect the flash output because of the heavy file size, so it's better to resize them permanently. open Adobe Photoshop, go to File Menu open and you get a folder path. Go to the images path and grab all the images together to open. One after one, all 19 images will open in Photoshop.

When all images are displayed, go to Image image size. Alt plus control plus i is the shortcut key for this you get an image size panel in front of you. Here we put a particular size of 384 by 288 pixels. Press OK, the image changes to a very small size. But on the top, you will notice that it's 25% of new size. zoom into hundred percent and check if it's getting pixelated.

No it's not. So save it again as JPEG image and close. Similarly, do the same for every open image in Photoshop. Keep the image size the same for every image that is 384 by 288 pixels. Even the resolution for every image is 72 pixels. Once the Photoshop work is done, we can see the size change details in the image folder path for all images coming back to the flash document get an Flash file and import the new sized images here.

Go to File, Import import to stage, and click on the first image to open. Now, click Yes to import all the 19 images in the sequence. Each image is placed on a new key frame. Those imported images are as per the state size and center aligned by default. So close the previous Flash file and save this new Flash file, where we'll start the animation part. we name it image animation.

Press Ctrl plus L to open the Documents Library. To organize these properly, create two new folders here. One for images and another for symbol. Grab all the image files and drop them in an image folder. Always keep this habit of a well organized library for every Flash file. Now, in the library, double click on the first image, or you can even right click on image file in the library and select the properties option to open this bitmap Properties panel.

Check the box in front of allow smoothing the rest keep the same and click OK. Similarly, open bitmap properties for every image and allow smoothing for all. Allow smoothing is generally done when the image is resized or rotated. Flash drastically reduces the image distortion during the animation Close the library when all is done here, in this drop down menu, select the fitting window option to view the exact state size available. Now, we have to convert each image into a symbol. Let's start with the first image on the first key.

Select the image and go to modify, convert to symbol, or press f8 as the shortcut key to get convert to Symbol dialog box here, we will go for the movie clip type name it image underscore 001, which is also its original image file name. Keep the registration point default at the center and click OK. Go to the next keyframe. Repeat the same process for the second image. Now onwards, press f8 a shortcut and speed up our work. convert all 19 images to movie clip symbols the same way. Also keep their symbols naming same as the original image name, like we had done in the last tutorial.

Once all the images are converted to symbols, again open the document library, press Ctrl plus L to get it. We see a list of all 19 symbols here. Grab them all together and drag them inside the symbol folder. Now, select all the keyframes on layer one, and press Shift plus f6 to remove them all. The reason behind this is that we need to drag each image symbol one by one on stage in different layers for the animation. From the library, symbol folder, hold and drag the very first image symbol that is image underscore zeros row one on stage four very first frame, also named the layer as image underscore 001.

We need this image to be center aligned to stage. So, go to Windows align or press Ctrl plus k a shortcut to get the Align panel. Always keep on the two stage option in this panel. Click to both horizontal and vertical center options to get the image center aligned to the stage. Now, we will start with the animation part for this image, extend the frames up to 50 and press f6 on 15th frame to get new key frame. On the first key, shift the image totally to the left side of the screen, as seen in the video.

Now, create a new key frame at five and apply motion tween between the fifth and the 15th frame. So the first first image is getting animated and entering the screen from the left direction. add another layer and name it image underscore 002. On this, we will start with second image animation. On the 30th frame, insert one blank keyframe and at the same 30th frame of the first layer, press f7 to stop the first animation till the 29th frame. Thus, two different image animations won't crash at any frame.

Press Ctrl plus L to open the library. And out of that, drag the second image underscore 00 to symbol on stage. Take care that it's dragged on the 30th frame of the second layer. Press Ctrl plus k for the Align panel. align this image to the center of the stage as we did for the first image. remember some of these shortcut keys very well as We will need them for the next 17 image symbols to shortcut keys help us work faster.

Coming back, extend this frame up to frame 70 and insert another key at the 45th frame. Now on the first key of the second layer, shift the image vertically down of the screen as seen in the video, create a new key on frame 35 and create motion tween between the 35th and the 45th frame. The image is coming to its default position from below the screen as seen in the video. So if you view the animation from the first frame, the first image enters from left and second from below. Similarly, you can simply make the image enter the screen from any direction. Let's move ahead with a new image symbolic animation.

Add a New Layer Image underscore 003. Insert blank keyframes on frame 64 both the second and third layers on the 68 frame of the third layer, drug image underscore 003 the image symbol from the library. Open the Align panel and get the image center aligned to the stage. Extend the frames and press f6 to insert a keyframe on 75. Now, on the previous frame, shift the image towards extreme right insert another keyframe on frame 65 and apply motion tween between the second and third keys. This time the image is entering into the screen from the right side of the stage.

Add another layer in the timeline with the name image under Score 004 Same as earlier, we insert the blank frame at frame 90 for both the new and the previous layer. As per the layer name, drag and drop the image underscore 00 for symbol from the library center align this image to the stage. Extend the frames as per your need, and insert a keyframe on frame 106. Now, shift this image in up direction, taking it off the screen. Insert the third key on frame 96 and right click to create motion tween here. Thus, if we go through all the image animation still Now, each image enters the screen, anticlockwise first enters from left, second from below, the third from the right side and the fourth from above.

You might have noticed that after each animation ends and before another Animation starts, we have kept a pause of approximately five frames. Let's move towards some different styles of image animations. add another layer named image underscore 005. insert a blank frame on the one 20th frame for the fourth layer to stop its animation till 119 and at the same position that is on the one 20th frame, insert a blank keyframe for a new layer as well. Here, drag the image underscore 005 symbol on stage and get it center aligned using the Align panel. Extend the frames for more and press f6 select the image on the layers first frame and apply alpha from the color drop down menu in the Properties panel give the alpha value of zero so that The image will hide completely. Now, get another keyframe on frame 126 and create motion tween between these keys.

You will notice the image appearing on the screen slowly without any movement. Get another layer and name it image underscore 006. Insert blank keyframes for both previous and new layers and the 158 frame and for the new layer, drag and drop the image underscore 006 symbol on stage. Get it center aligned to the stage using the Align panel. Extend the frames and insert a new keyframe at frame 171. On the first key, shift the image slightly up as seen in the video.

Again, insert a new key and frame 160 for both the first and the 168 frames Apply zero alpha value from the Properties panel. As always, apply motion tween here between frames 160 and 170 by using the right click, now you can view that the images appearing on the screen with some movement towards the center. Let's add some more in the same layer. Copy the last key and paste it on the 165 frame. Create motion tween between frames 165 and 170. add one more key at frame 169 and add some duration of four to five frames between the frames 169 and 170. View the animation we see a bounce effect to the image and just the frame duration as per your choice.

So if we preview all together, we started With the simple image animations, and moving ahead towards advanced effects, different techniques are used to get different outputs. Let's start with another effect. Add a new layer and name it image underscore 007. On the 190 second frame, create blank frames for both the sixth and seventh layers. Get the image underscore 007 image symbol dragged on the seventh layer. Also make it center aligned to the stage.

Extend the layer frames and insert a keyframe on frame 221. This time we will start using the filters options available for effect. So select the image on the first frame and open the Filters panel besides Properties panel, if Not you can get it from Windows properties, filters. Here you can see plus sign, click on it and select the blur option out of all, you get some more blurred control parameters. Keep quality too high out of three of the best blur results. And for blur x&y, put 50 as value.

Now, open Properties panel and also apply zero alpha on 200 frame, insert new keyframe and apply motion tween between 202 21. So, we used two techniques here, alpha, and blur. So the original images up here on the stage out of alpha and blood values, you can adjust the frame duration as per your choice. Let's move to the next step. Now. Let's move ahead adding one more layer, name it image underscore 008.

Once again, we are placing blank keyframes for both the previous and new layers. Press f7 to create those blank keys. Let's start this new animation from 240 first frame, get the image underscore 008 image symbol from the library to stage and at the same time, get it centered aligned using the Align panel. extend those to be animated frames for this image. Now, from filters, select the new drop shadow option. We see many more parameter controls here.

Out of them. Keep distance value eight and blur x y values to 20 here also change the quality level too high, you see a blur effect of the image above. Now, in the timeline, insert new keyframes on frames 271 and 260. On the 268 frame, add one more blur filter to the image, keep it on high quality and modify the blur x y values to 80. This gives a bit too much of the blur effect, but we want it so here. Now, on the first frames, add zero alpha value to the image and insert a new key at frame 246.

Every time either we make the image enter or appear on stage, create motion tween between the second, third keys and the third, fourth keys. You can also vary the frame durations. So now the image gives the effect of alpha to blood and blood To original image with drop shadow. You can play more with the blur and drop shadow values if you want to experiment. For the last key, let's create some changes. Open filters again.

In the drop shadow option, change the blur x y values to 10. The rest we keep the same except some frames to get a hold for the output image. And it's done. Get another layer number nine and also name it image underscore 009. Press f7 to insert a blank frame on the 298 frame of the eighth layer at the same position. also create a blank keyframe on the ninth layer.

On this blank keyframe, drag and drop the image underscore 009 symbol on stage Also get it centered aligned to the stage. These are some common steps and we have seen these in earlier tutorials we would be repeating in start off each image animation. extend those frames till frame 341 and insert a keyframe on 320. Now, we will modify the image on the first key. For that, open the Filters panel from Windows properties filters, click on the plus sign here and select the blur option to apply. Firstly, change the quality option too high and give the blur x y 20 value.

You can see a blurred image here. Moreover, also apply zero alpha value to it on the first key. Now, create another key on frame 300 and apply motion tween between 303 20 It's not done yet. Pick any in between frame of the motion to in an open Properties panel. Here, you will notice a rotate option, check out its option, and out of them select c w, that is clockwise rotation. Then, besides that, it asks for the number of times we need to rotate the object.

So let's type to. Overall this means the image will complete two rotations in the clockwise direction before it settles down to its original look. Now, press the Edit option available in front of the ease value. This opens up the custom is in a result value panel. We can modify it using node handles. Once done with this, preview the animation.

As said before, the images appearing one rotating clockwise on this stage. This looks fine, but let's add more. Grab the image on the last key, and again open up the Filters panel. Click on plus sign and add another filter option of drop shadow for the last key image. We won't play with the parameters, just have a look at the result. Let's add one more rotation to the second key image.

This applies the fast movements in the image animation. You will notice that we are using the same techniques but in a different manner for every animation. Next, add layer number 10 and name this layer image underscore 010. Let's repeat that. The Common Procedure part here. Add blank keyframes for both previous and new layer on the same location.

Here, it's free number 341. Open the library and drag the image underscore 010 symbol onstage. Press Ctrl plus k for align panel and center align the image to the stage area. extend those frames to the normal duration. insert a new key on the three at first position. Again, open the Filters panel to modify the image on the first key frames.

Now let's add a new filter to this one. Select adjust color from the drop down menu. Here you get a new and different parameter option available. So let's start with the last view option as you slide and value He value you can also see the variations in the image. We reduce this huge amount as needed. Then comes saturation, reduce this amount to the lowest.

Similarly, you can play with the rest, brightness and contrast options. For now we have selected these values for the first key image. Coming back to the timeline, insert a new keyframe on frame 355 every time we make the image appear on screen so select the image on the first key and the Zero alpha value do it. Now, insert one more keyframe on frame 346 and create motion tween between second and third key first. This makes the image appear from zero to the filter applied image. For further action also create motion tween between third and fourth keyframes.

Also decrease the duration it's time to watch the animation. This effect gives a totally different look and feel to the image animation. The effect part seems very complex, but it was done using just filters. Add another new layer image underscore 011 Let's stop the earlier animation on frame number 391 and press f7 on the new Add the same frame number 391. To start with the new image animation, open up the library and drag the image underscore 011 symbol on stage, then align it to the center of the stage. Now, pick the image and go to modify, convert to symbol, or simply press f8.

To convert this image again into a movie clip symbol. Name this symbol, image underscore 011 underscore 01 step inside this new symbol and name its lair image. In here, add another layer with the name of mask. You must have understood till now that for this we are using a different technique of masking. Put this mask layer on outline mode. Now on this mask Drawing image size rectangle exactly about the image.

Extend both delayer frames till 50 we will be only manipulating the mask layer here. So, on the mask layer, insert keyframes on frame 30 on its first keyframes use free transform tool and scale down the mask rectangle scale down to its lowest. Now, we need another key on the 10th frame and also right click between the second and third key is to apply shaped when this mask rectangle is getting animated. To make the mask layer work with actual mask properties, right click on it and put it on mask. Automatically, both the layers get locked and the image file goes under the mask layer. Let's go through the animation at this time.

The image appears on the screen as per the mask animation. Exit to scene and extend the 11th layer to the exact duration as the inside. Press Ctrl plus S to save your file, and the control Press Enter to view all of them together in real time. Let's start with the next. So get a new layer image underscore 012. As always, add a blank keyframe at the end of the previous animated layer and add a new keyframe at the same location on the new layer.

Extend the frames and on a new layer. Drag the image underscore 01 to symbol also centered lining to the stage without fail. Same as earlier, press f8 to convert this image symbol in new movie clip symbol. Name this new symbol as image underscore 01 to underscore 01. Now we have to enter this new symbol, and again, let's add a new layer for mask. So we are going to see a different mask effect here.

Put the mask layer to outline mode and draw a similar rectangle occupying the entire area of this image. Extend both the layer frame still 50 and insert a keyframe at frame 30 on the mask layer. Now, on the first key squeezed the rectangle vertically to the lowest as shown in the previous animation, it was squeezed at one of the corners of the rectangle and now you squeezed vertically up, add another key on frame number 10 and create shaped when between the second and third key. You can see the mask rectangle animating in outline mode. Now, right click on the full mask layer and put it on mask. Now let's view the actual animation happening.

The image appears step by step vertically as per the mask movement. Exit the scene and extend those frames to total 50 frames duration as the inside. We are done with the 12 image animation using masking effect. add another layer for the 13th image animation named layer image underscore 013 without fail, add a blank frame at the previous layer in frame. Also add a new keyframe at the same location of the new layer that is on frame 491. On this new key frame, add the image underscore 013 symbol on the stage area from the library and get it centered aligned to the stage.

Always check that the two stage option is on in the Align panel. Extend the frames as much as you need. Again here, grab the image and convert it into a new movie clip symbol in the name of image underscore 013 underscore 01. Step inside to start the animation part here. named the default layer as image and add another layer of mask above. On this layer, draw a similar rectangle covering the full image on stage.

Put this layer on outline mode now. Extended frames for both delays till Here too, we will only manipulate the mask layer for the animation. insert a new key at frame 30. Now, from the toolbar, pick the sub selection tool for the first key. You can see four nodes at the four corners of the rectangle out of them, pick the bottom right node and move it towards the left top corner. As seen in the video, you can shift it using the arrow keys on the keyboard or using the cursor.

Observe how the nodes are moved. Create another keyframe on the 10th frame and right click to apply shaped when you will notice the mask shape getting animated in a different style. Right click on this mask layer and put it on mask option available. So finally the image gets Animated in the masks way. These are some of the ways to treat the mask layer. You can create your own ideas to treat them in the best way you want.

Let's see some more of them. So, add another layer as image underscore 014. Press f7 at the end frame of the previous layer and on the same location, add a new frame for a new layer. Get the image 01 for symbol dragged on the stage. Also open the Align panel and center align this image to the stage. Again grab the image and press f8 to convert it into a new movie clip symbol.

Name this symbol image underscore 014 underscore 01 step inside the new symbol to start with the animation part. Named is Default layer as image and add another layer for mask. Put this mask layer on outline mode. Now hold down the shift key on the keyboard and start drawing and overlapping perfect small square starting from the top left corner. Press f8 again to convert this square box into a movie clip symbol. Name this one image underscore 01 for underscore 01 underscore mask enter inside this square symbol name this very first layer 01 and extend this layer up to 20 get another layer zero to copy the same previous square and paste it on this layer please the square exactly below the previous square.

Similarly, add some more layers and place each layer one below the other Take a note to leave even a single pixel gap between the squares. vertically five layer squares arranged properly put them all on outline mode, hold them together and set them to the proper positions. Now, about the first layer, insert one more layer as 06. Here, paste the same square from the first layer and place it exactly besides the same horizontally. Now, you can shift this layer to the top. In such a pattern, we will add some more layers and squares to cover up the complete image area.

All the squares are in vector form. Later, these squares will be applied shaped when individually So, while copying and pasting, we have to take care that each and every square should remain on a different layer. This will help us in animating and handling each square individually in a better way. Even the layers and their naming should be well organized. We covered up the full image with 30 small squares. them all on outline mode to align them properly over the image.

Now, on each layer, insert new keyframes at the 10th frame. We will modify the squares on the first keyframes. Select the first key square of the first layer and press Control plus r plus s. Make the scale value 22 scale down the square by 80%. Similarly, do the same for the next 29 squares on the first keyframe squares. Don't try to scale down all the squares altogether. We have to do it one after one for all of them.

When all are done right click and create shape tween between the first and the 10th frame. Now, you get to see that small squares are smoothly converting into big squares. exit to the previous symbol and right click on the mask layer to put it on mask option. Both the layers got locked. Extend the layers up to 50 frames. Now unlock and step inside the mask symbol to extend all the frames till 50 here as well.

The shape tweening part is done. Now, we will set the timing for the animation except the first layer, hold all the shape to encase for all layers and drag them to two frames ahead. Similarly, one by one, shift the shape tween keyframes of each layer ahead by two frames, so that each grid animation will start one after one with the gap of two frames. Once shifting the keys, you will notice the changes on the stage area. These are some of the variations you can create with the animation. Extend the overall frames as needed.

For the last layers, we left the gap of only one frame for variations. Let's directly view the animation. Press Ctrl plus enter. You can observe that according to the square animations, the image appearing on the stage. This has a very different look. We are now coming up with a new advanced look and feel effects asset.

You can even modify these ideas as per your choice. Thus, we are done with the 14th image animation. Add a new layer for the 15th image animation now, named the layer image underscore 015. Repeat the same process. Add a new blank keyframe at 590 to start the animation from drag the image underscore 015 symbol on that frame from the library and also get it centered aligned to the stage using the Align panel. Control plus k is the shortcut key to open the Align panel.

Extend this frame as much as we need. Select the image And again converted into a new movie clip symbol. Name this symbol, image underscore 015 underscore 01. Double click to enter the new image symbol. Name the present layer as image. add another layer above the image named mask.

Yes, we are going to see another new masking effect. extend those frames till 50. Open the library again and find the previous mask animation symbol used for the 14th animation. That image underscore 01 for underscore 01 underscore mask, drag this symbol on this new mask layer. Now, open the Align panel and click on the two stage option to switch it off as we want to align this mask symbol to the image and not to this stage. So great Both the image and the mask and align this mask at any location you want.

We replace it at the top left corner of the image. At this time, right click on the mask and duplicate this symbol as image underscore 015 underscore 01 underscore mask. duplicating the symbol will not affect the previous mask symbol animation. Enter inside the symbol to create the modifications. We removed all the gaps created between two squares, animation timings, reusing the same 30 squares and its animation, we will come up with a new effective output Arrange the shape to end keyframes with the distance of one frame for each layer. Even you can place them randomly and give a different look to the animation.

You can also think of some other shapes than squares. Having each box on a different layer helps us control or modify the movements very easily. For now, we have kept the uniform gap of a single frame in all the 30 layers in a particular pattern, exit and right click on the mask layer to put it on mask option. Save your file and directly press Ctrl plus Enter to view the output. This is the previous mask effect and this one is the latest but different mask effect you can understand than that even if we reuse the material, we can create variations using our own ideas. Let's see one more attractive image animation.

Add a new 16th layer in the scene and name it image underscore 016. Before we start with the 16th animation, insert a blank keyframe at the end of the previous animation layer. And now, at the same frame location, add a new keyframe in a new layer. Here, that frame number is 643. Extend the frames and open the library using Ctrl plus L. From there, get the image underscore 016 image symbol and drag it on the stage for this new layer. Press Ctrl plus K to align this image centrally of this stage.

We have to align it to the stage so to stage Options should be on for this from the Align panel. Select this image and press f8 to again converted into a new movie clip symbol. Name this symbol, image underscore 016 underscore 01. Now all the animation part will be done inside this new symbol. So, step inside ID and Name this first layer as image. Also add the second layer as mask.

Masks can be created in many ways. So this is the third style we are going through. Put this layer on outline mode and take a rectangle tool from the tool panel. Draw a rectangle slightly bigger than the image area. Also make it center aligned to keep it proportionately distributed around the image big this mask rectangle and convert these two into a movie clip symbol. Name it.

Image underscore 016 underscore 01 underscore mask. Now, double click to enter this mask symbolic. Name the first layer as 01. Put this layer on outline mode and from the Tools panel, select the sub selection tool you can see the nodes that the rectangle corners out of this four nodes, we will edit the bottom two nodes. So select them together and using the arrow key on the keyboard, shift them upwards as shown. add another layer zero to copy the first layer rectangle and paste in on new layer.

On stage, please this exactly below the first rectangle without leaving a single pixel gap. add one more layer 03 and plays a new rectangle on this layer, which will be exactly below the second rectangle position. With the same process, keep adding new layers and such rectangles till it covers up the full image area. Use the keyboard arrow key to move it properly vertically. Thus, we did it using six similar rectangles, hold them together, and again align them vertically as seen in the video. Keep pressing f5 till frames are extended till 25 insert new keyframes at the 10th frame.

Again, keep on the sub selection tool to edit all the rectangles on their first frames. For every rectangle, grab the bottom two nodes and decrease its height to a single line. Even here, you can move the nodes upwards using the arrow keys. Take care when you're editing the rectangle nodes on the first frame. Now, all the single lines are visible for the first frames of all the layers. Pick all the in between frames and right click to apply shape to in.

You can see the shape tween animation happening to the rectangle part. Let's work on the time duration a little bit On the second layer, shift the shaped when key frames were the first layer shaped when key aims. Similarly, shift the third layer shaped when keys were the second layers shaped when key AIDS. So every next rectangles animation starts after its previous layers animation ends. Now, if you observe the shape to an animation, it looks like it's rolling down on stage step by step. We can play with the frame duration till we are satisfied Exit the symbol when you're done.

Excellent all the frames here as per the animation duration inside the mask symbol. Now, put this above the mask layer on the mask option by using the right click Exit to the main scene and preview the current masking effect for image animation. Catch the difference created by just using the rectangular mask instead of squared mask without affecting the image. We are simply playing with the mask different shapes to create differently beautiful results. It's time to start with another new image animation effect. Add a new layer on top called image underscore 017.

Add a new keyframe on this new layer with the previous set. Animation ends on this keyframe. Open the library and find the image underscore 017 image symbol to drag it on the stage. At the same time, open the Align panel and get it centered aligned to the stage. To view the complete stage area, select the option of fit to window from the right top corner drop down menu. Coming back to the timeline, extend the new frame till 760.

Now, grab this image and press f8 to convert it into a new movie clip symbol as image underscore 017 underscore 01 step inside it and name the first visible layer image. add another layer above and name it mask now is going to be more different than the earlier ones. Get the oval tool from the Tools panel and draw a perfect circle on this mask layer. This circle is drawn off a normal size, not too small and not too big. Now, center align the circle to the image and then convert this circle two into a movie clip symbol. name as image underscore 017 underscore 01 underscore mask.

Again, the animation will take place inside this new symbol. So step inside this symbol and name the first layer as 01. It doesn't matter what color the mask object is. Hold the circle and shift it to top left corner of the image. add another layer and place the same circle copy on this new layer frame. Name this layer 02 add another layer and paste the same circle copy on this, place this at some other location within the image area.

Press Ctrl plus r plus s to get the scale and rotation control panel. scale up this new circle by 120. Give the proper naming to the layers. Similarly, add one more layer and paste the same circle on it. Also scale it up by 140 value and arrange it randomly on the image. As seen in the video.

We are adding up the layers to place the number of circles over the image area. All those circles can be modified with a different scale value. You can scale up as well as scale down the values. Keep adding the layers till we completely cover Have the image we will animate those circles for a new mask effect. That is why every single circle is copied and pasted on a different layer. All the circles are placed randomly over the image Finally, using 28 layers that is 28 circles, we covered the complete image area on this stage.

Put all the layers on outline mode. no gaps are visible here. So, let's start with the next step. Extend the frames for all 28 layers together, press f6 and insert new key frames at the 10th frames. On first frame, scale down each circle with different values Ctrl plus alt plus S is the shortcut key to get this scaling control panel. All 28 circles should be scaled down only on the first frame.

When all are done, right click between the first and 10th frames and apply shaped when you can view the circle scaling up smoothly from the first frame volume to the 10th frame volume. Let's add some more. insert new key frames on the sixth frames of all layers. On these new keyframes, increase all circle sizes by 120 percent. Wherever required, we are scaling them up with different values as seen in the video. One by one scale up every single circle on the stage After this, arrange the shape to end keyframes randomly on the timeline.

Each circle will appear on different timings on the stage. Such tricks create a different pleasant look to the animation exit from the mask simple animation. Extend the frames here for both delays and put the mask layer on mask option. Even in the main scene, extend the frames to the full animation duration. Now, let's preview the newly mask image animation. You get to see a totally impressive and satisfying result.

Without much effort, we are playing with different styles of masking. Let's move ahead and add another new layer at the top name it image underscore 018. Repeat the first few steps here as well. Add a blank keyframe at the end of the previous layer and another new keyframe on the new layer. Press f7 to create these blank key frames on this new key frame, get the Image underscore 018 symbol from the library, drag it on the stage and get it center aligned. Now, on the same layer, drag the previously created image underscore 017 underscore 01 underscored mask symbol over the image.

We are supposed to reuse this mask effect for this new image as well. Of course, there will be some modifications within the mask effect. Hold the image and mask symbol together and press f8 to convert them into a single movie clip symbol. Name this new symbol image underscore 018 underscore 01 double click and step inside this symbol. Right now both the image and the mask are on the same layer out of them. Press Control plus x and cardi mask add a new layer In the timeline, and press Ctrl plus shift plus V to paste it on the same place on the new layer.

Name this new layer as mask, also named the first layer as image. Before creating any modifications in this mask animation, right click on the mask symbol and duplicate symbol, so it won't affect the originally created mask animation for the 17th animation. Name this new duplicated symbol as image underscore 018 underscore 01 underscore mask. Step inside this new mask animation. Remove the randomly placed frames and organize them in a proper manner as seen in the video. Grab all the middle keyframes in shaped when and press Shift plus f6 to remove them all.

Bring all the end keyframes The 10th frame position and also remove the applied shaped wing between the keys. Now, it's going to be two different on the first frames, shift one by one, all the circles at bottom left corner. Let them overlap each other All the circles are now shifted at this bottom left corner. Now, again apply shape to in between these two keyframes, you will see a lot of variation in the circle movements. Out of all the 28 layers hide some selective layers and now displays the shape to in keyframes at random duration. We creating more and more variations with different techniques.

Unhooked unhide all the layers and view the animation circles give the bubble effect while entering the image area. Exit that symbol and here extend the frames to the exact animation duration right On the mask layer and put it on mask, exit to main scene, and here to extend the frames for 18th layers as per the animated duration. Let's view the current animation. According to the mask animation, the image opens up with bubble effect. Save your file first, and then go for the preview of all image animations done. We started with simple effects, and then moved ahead with the advanced effects for the image animation.

We also viewed how to create the variations, reusing the same techniques. The more you play with the techniques, the more you get different and effective results for your animation. These are some of the ideas for you to show how to treat the techniques for image animations. You can Apply your own tricks to the animation. So, go ahead out of the media hope that you found this tutorial useful. Thank you for watching.