How do I loop an animation in adobe Animate

[sabermaster28]

How do I loop an animation in the time line.

[ClayUUID · Accepted solution]

Put it in a graphic or movieclip symbol.

[RandomlyFish]

You can play your animation by pressing Ctrl + Enter on Windows or Command + Enter on Mac. That will loop through all the frames on the main timeline, unless you have scripted it to stop.

[just.emma]

In Publish Settings, just make sure the "Loop Timeline" box is checked.

[mark@headTrix · Accepted solution]

To loop an animation, copy and paste the animation into a Movieclip symbol. Or create a new movieclip symbol and then create the animation in there. Movieclips loop independtly over and over.

Check out this short video I made to learn "How to Create Movieclips in Adobe Animate"

hoep this helps,
mark

[jennyr24223292]

How do I repeat my loop in Animate so that it will be longer than 1 second for when I export it to a movie for editing in Premiere?

[mark@headTrix]

Hi Jenny,

their are a few ways to make your animation loop.

you can select the current tweens and hold down the Option key (alt key on PC) and click and drag to copy or duplicate the tween so it can play again further down the timeline. Or you can select the entire tween or tweens in your animation and paste it into a moviecliip symbol which loops over and over again. You can see my video on creating Movieclips here: https://youtu.be/KaRZtkDcCpw

Hope this helps!

thanks,

mark

[jennyr24223292]

Thank you for you helpful movie Mark. I think I understand it but learning very slowly watching your movie over and over. I understand how to highlight my clip and option click and move the clip over to repeat the animation but the movie clip seems less cluttered. I am animating a still of a figure that I used pins to make it look like it walks very simply back and forth. It isn't a graphic. That is where I am lost as it starts out as a png file. Do I highlight the two clips  of 20 frames to convert this to a movieclip? Sorry to ask obvious questions. I am trying to later export this figure walking into premiere but want it to be longer, like 20-30 seconds long. Thanks

[mark@headTrix]

Hi Jenny,

Yes movie clips are a solid foundation of Animate. In Premiere you might call that a squence, or possibly a nest. Or a composite in After Effects, sort of works the same way. If you have a walking character all you need is one step with the left foot and one step with the right foot on a loop (inside of a movie clip).

And then you can just animate thet movieclip of the character walking in a loop, and animate the movieclip across the stage. So inside the MovieClip would be the walking animation, and on the main stage that Movie Clip (MC) will be animted across the stage so it looks like he is walking across the scene.

If you are able to select eerything... you can right-click to COPY FRAMES and then create a New Symbol (Insert>New Symbol), make sure its a MC, and then right-click on the first frame and Paste Frames.

Then you can drag the new MC from the library and extend the timeline so it loops as many times as you need it to. Hope this helps!

Might also help to watch my entire Getting Started Series (8 videos now, and adobe should be uploading the last 4 soon, one of which has a very simple bird with the same technique as I described above. 

ADOBE ANIMATE GETTING STARTED SERIES

Hope this helps!
mark

[n. tilcheff]

Mark,

It's really not a good idea to keep teaching new starters to use Movie Clips for non-interactive projects.

This is what Graphic Symbols are for.

It creates confusion and the next thing they run into is: "My animation does not export to GIF."

"My animation does not export to video." "My animation does not play on Main Timeline."

Movie Clips should only be used for interactive projects where they are controlled by code or by people who have a very good idea why they chose a Movie Clip over a Graphic Symbol.

[mark@headTrix]

Sorry Nick... I totally disagree with you. I have been teaching Flash since about 1998... and Movieclips as the predominant symbol in Animate. Movieclips are NOT only for Interactivitiy. Its perfect for making a bug flap its wings, or a character walk, or making a simple sail flap in the wind with only 3 frames. 

The video I shared above is the 5th video in my Getting Started Series that I created for the Adobe Animate Team. It was one of the most watched videos in the series. Movieclips help make Animate a lot more robust!

Graphic Symbols I used mostly for static art. Movieclips are also great to stack inside of each other, to make one ladybug crawling on the screen into 50 ladybugs crawling on the screen. To each its own... you teach your way I guess. I have always had amazing reviews... and I have taught a lot of students. For me it has worked great!

[n. tilcheff]

Hi Mark,

I wrote to you directly, because I was hoping that you could just stop, think and reconsider.

I know very well that Adobe / Macromedia presenters never really understood how Flash is used in professional animation.

At the time while Flash Player was predominant, the use of Movie Clips in non-interactive projects could somehow be justified as many kids would just publish and share SWFs. Now kids need to export MP4s and GIFs and they face all kinds of difficulties with these Movie Clip methods.

The fact that something wrong is regurgitated for many years does not make it right. Perpetuating bad practices only undermines the reputation of Animate. People can't get the results they want and the official tutorial materials do not offer them any insights into how to get these results while leading them in dead end streets.

Here's a link to an interview I gave to Ajay a few months ago if you need some background into who I am and look for credibility in this way:  https://theblog.adobe.com/nickolay-tilcheff-enhancing-animate-for-animators/

I'm not expecting old course materials to be re-recorded, but it's in the best interest of this community and the future of Animate if some of these sub-optimal practices are not actively promoted any more.

Best regards

[mark@headTrix]

you didnt write to me directly... you wrote right here in this chat.

What makes you assume everyone is creating movies? And everyone is creating character animation and cartoons? Looks like you are a great artist and animator.... but not everyone is doing that. To be honest, not everyone can. But, Animate does a lot more then that. And maybe they just want to export to HTML5, maybe they are creating a bnner for their website. And a Movieclip's behavior can very easily be changed to a Graphic Symbol. And Jenny uses Premiere, so she is familiar with nesting.  

[n. tilcheff]

Mark, 

Distinctions need to be made what is used where. They have to be made early on to avoid confusion.

I said what I wanted to say. Sadly, you took is as an attack on you which it is not.

Good luck

[mark@headTrix]

hey, I'm just trying to help to the best of my ability. And I had a video on Movieclips to help her process it further. I do have another video I am waiting for Adobe to post about Graphics vs MC... which I would send to her as well if it were posted. But I will admit, my video would miss speaking about exporting a MC to a video. It is a good point... and at the same time Adobe wants these videos around 5 minutes.... and I can never seem to do it.

Your words are noted. 

thanks,

mark

[jennyr24223292]

Thank you Mark. This is helpful. I think I understand better what you mean when you refer to nesting. I am going to try what you suggested. I have watched your video but need to keep rewatching bc the concepts are different than other software I use. Just need to get used to what the process is... THanks

[mark@headTrix]

You are very welcome Jenny! Yes it just like nesting.... but MovieClips loop over and over as long as it is on the timeline. But its like a nest in that its a package of your animation in ONE symbol.... so easy to move, scale, rotate the ENTIRE animation. And in your case... the added benefit is you just create one walk cycle of each leg.... and it will loop over and over again, so it simplifies how much animation you have to do.

Good luck!

mark

[jennyr24223292]

WHile I have you. I made a change to a still that is a document that I converted into the symbol 'graphic'. In other programs you can pretty easily replace the original file with the newly fixed that has been saved with the same name. I was able to replace the new file with the original document in the library, but it did not change the same document that was converted into the graphic symbol where my animation is...Hard to explain sorry. But basically wanted to replace the image in my graphic wo having to redo the animation over again...

[mark@headTrix]

that is how symbols work. You can create an entire animation with a symbol, and then just update the symbol in the library and BOOM... you have a totally new animation. But you hve to learn about symbols first... its the basis of Animate.

Again... check out my Getting Started Series here: At least look at the one on symbols, they are all pretty short

https://www.youtube.com/playlist?list=PLYeXZOOCIwCuzJTgzS1ODTe-T8FrmPty9

IN animate you don't replace the file... you either update the art in the library(in the symbol)... or you can SWAP a symbol with a different symbol.

Hope that helps!
mark

[Edu Couchez]

Well... as usual, five years later hasn't been solved in the app... but thankfully, we have a good alternative. Already named in earlier answers, Keyshapeapp doit it all, easy, intuitive UI, export stright to SVG + CSS style animation, onli 27€ (suppose similar in $) IMPORTANT: ONLY FOR MAC... sadly, I haven't found any alternative for PC. Although welcome if anyone can share another

https://www.keyshapeapp.com/ 

I've been for months trying to animate a basic loop animation without luck, just because I'm not a programmer... tried with pure HTML/SVG/CSS coding... almost succeeded, but always stuck in small details uncapable to solve, because I'm artist and can't visualize num,bers and code. With this simple app, I've done it in 3 minutes... that's all... exported right in a simple SVG, CSS styles clear and understandable, ready to customize if you want to fine tune right in code.

https://www.keyshapeapp.com/

[Edu Couchez]

Forgot to mention... of course, you can open any SVG image, even exported right from Illustrator, so you can design comfortabilly with AI, and let this simple app do the rest.

[mark@headTrix]

Trying to advertise your product in the Adobe forum? Seems like the wrong place.

And if you want to Animate something in a loop..... all you have to do is do the Animation in a MovieClip and it will loop forever! NO PROGRAMMING NEEDED

[AliceAnderson2000]

Hi guys, I have a similar question.

I'm still new to Adobe Animate and don't really know how it works so forgive me if I don't use any correct terminology.

I have a bunch of graphic symbols which I've then converted into move clips in order to get a looping animation.  I'm trying to get some mountains to move from left to right, and then seamlessly loop again. I've added the classic tween, and they're moving within the move clip/graphic symbol layer, but when I hit ctrl + enter it does not play.

I've somehow managed to get two layers to loop correctly, but the rest just are not moving when I click ctrl + enter.

Any ideas?

[mark@headTrix]

Hello

So I use gtaphic symbols for static pieces of art or objects (like your mountains) then I would place the graphic symbols INSIDE a NEW MOVIE CLIP. Inside the movie clip I can animate (tween) the mountains from one side to the other. And when you test the movie, the animations inside of the movieclip will loop.

Check out my beginner video series or short videos to help get you up and running!

Check out this one on MovieClips which should help you create yours!

https://youtu.be/KaRZtkDcCpw

Hope it helps!
mark