Skip to main content
daved21859012
daved21859012
Participating Frequently
March 15, 2020
Question

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

  • March 15, 2020
  • 2 replies
  • 1096 views

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!

This topic has been closed for replies.

2 replies

n. tilcheff
n. tilcheff
Legend
March 15, 2020

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!

 

Nick - Character Designer and Animator, Flash user since 1998 | Member of the Flanimate Power Tools team - extensions for character animation
daved21859012
daved21859012Author
Participating Frequently
March 16, 2020

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
n. tilcheff
Legend
March 17, 2020

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!

Nick - Character Designer and Animator, Flash user since 1998 | Member of the Flanimate Power Tools team - extensions for character animation
daved21859012
daved21859012Author
Participating Frequently
March 15, 2020

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

daved21859012
daved21859012Author
Participating Frequently
March 15, 2020

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

n. tilcheff
n. tilcheff
Legend
March 15, 2020

Hi mate,

 

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

 

Nick - Character Designer and Animator, Flash user since 1998 | Member of the Flanimate Power Tools team - extensions for character animation
Terms & ConditionsAccessibility statement
Using the community Terms of use Privacy Cookie preferences Do not sell or share my personal information ad choicesAdChoices