Can't export motion tween and js rotation to png sequence at the same time?

[daved21859012]

I want to recreate a loose stop-motion style wiggle every frame eg. a little to the left, next frame a little to the right. I plan to use this on individual letters spelling a word and each letter will wiggle animate in along the tween path.

I'm trying to move a movieclip using motion tween and some JS code to get the object rotating a random amount on each frame. I'm using "this.rotation+=Math.random()*10;" and the browser version (Test Video) works exactly how I want it to.

However I want to export this animation to compile with others in Premiere. When I export through File >> Export >> Export Video/Media as soon as my animation hits a frame with javascript on it the symbol stops moving along it's motion tween path and performs the (code based) rotation on the spot. It then stays there. With no code the exported png seq follows along it's motion tween. If the code is in the frame halfway through the motion tween path it will move along up to that point and then stop moving.

How can I get the movie clip to continue along it's motion tween and perform the rotation code at the same time and this to appear in the png sequence I'm exporting. I've tried many variations...I'm not sure if this is a bug, something I'm doing wrong or it can't be done!

I've attached my file which shows as intended in Test Movie via browser but not when exporting to png sequence.

Many thanks!

[daved21859012]

I get a "The file's contents do not match it's file type" error when trying to upload the file.

[daved21859012]

Even a fresh blank file immediately saved gives me the above upload error.

[n. tilcheff]

Hi mate,

Just upload the file to a file sharing service such as google drive and paste the link here.

[daved21859012]

Thanks Nick, 

https://drive.google.com/open?id=1tj-twBbH8gudy7FajeHZdsELGntPknNr

[n. tilcheff]

Hi mate,

I am not competent to say whether it is at all possible to achieve the desired outcome with your current approach.

I think not, but I may be wrong. As far as I know AS3 animation could be recorded and exported to video (since it goes through the Flash Player), but I doubt that Canvas animation could be exported to video from within Animate. Maybe it can with some browser tool, becasuse it is all happening there, right?

Since your goal is a rendered sequence, I would advise you to take a completely different approach:

Use nested Graphic Symbols.

You have a Graphic that contains the letter(s). It wobbles on spot. You nest that inside another Graphic that is set to Loop and you tween that along a motion guide from point A to point B. (Better use Classic Tweens and a motion guide.)

The result is the two movements combining. The wobble will not be random, but this really won't be much of a problem.

You will be able to see the animation when you scrub the playback head and it will export well as a PNG sequence (32-bit with alpha channel) to composit in Premiere.

Hope this helps!

[daved21859012]

Hi Nick,

that's a great help actually. The nested looping graphic thing definitely works for my purposes so thank you for your suggestion. 

Say I have 20 letters on screen, is there a way to apply an action or something like that inside the nested graphic to make it wiggle? Failing that what would be the fastest way to rotate say 5 frames of the nesteed graphic inside each graphic symbol? At the moment I'm doing Modify > Transform > Scale and Rotate.

Regarding the code idea: if it's possible in action script I will explore now. What's strange is that the coded wiggle DOES show up in the png sequence and of course the motion tween will too...it's just that the coded frames seem to stop the motion tween. I'm wondering if a line of code is needed to restart the tween again? I've also tried converting the motion tween into keyframes but that didn't work either.

[n. tilcheff]

Hi Dave,

Here I made a little example for you how to nest.

I did not aim for any elegance, just something similar to your file and to illustrate the concept.

The FLA is here: https://drive.google.com/file/d/1Bv9VI14expHDHaP3hKF4QQJYo7jGLj6O/view?usp=sharing

More nesting can make things even more flexible, but did not want to make it too complex as I have the feeling that you're not very experienced with this.

Good luck!

[daved21859012]

Hi Nick,

sorry I missed this! Thank you so much. Great to know that I'm on the right
track with this approach.

Do you ever copy motion from one symbol and apply it to another? I've been
looking for the fastest way to create the wobble motion and apply it to all
other letters. My attempts have failed to get this to work so far.

[n. tilcheff]

Hi Dave,

I don't use Motion Tweens as they are unusable.

The way I would do this with Classic Tweens is create symbol duplicates of the first one and then swap the internals or have the motion refer to a different frame to display a different set of frames (animation) within symbol, the way I showed you with the letter container.

The difficulty here is only that you need to be comfortable with nesting and the various functions in Animate to be able to set it up well from first attempt.

[daved21859012]

Thanks Nick!

Why are motion tweens unusable? How do you have motion refer to a different frame (symbol?). I've tried copy motion and paste motion special with little success so far.

[n. tilcheff]

Hi again, Dave,

Motion Tweens may be partly usable, but really unpleasant to deal with. So unpleasant in fact, that it renders them unusable in practice.

Let's see if someone else would have any other suggestions for you.

Best of luck!