Jump to content
GreenSock

Search In
  • More options...
Find results that contain...
Find results in...
2020AdobeAnimate

Adobe Animate 2020 help

Recommended Posts

Hi everyone (Beginner level), 

I use adobe animate + gsap to create html5 banners. So far I can make images, colors, and text fade in and move the objects around. I was wanting to elevate my animation ads. 

So! I love the gsap DrawSVG. My ideas was to have a lines come in left to right. Anyway of doing this in adobe animate? please help. 

Example attached. 

source.gif

  • Like 1
Link to post
Share on other sites

This would be doable in many ways. I don't see why you would need DrawSVG for the example you posted. It could be a simple linear tween in Animate, or with GSAP, or with GSAP in Animate. 

One possible issue to consider, if you do want to use DrawSVG in a banner, is that unlike the core GSAP library, this plugin won't already be hosted on the ad server's CDN. You would have to include it and the file size would count against you. 

  • Like 6
Link to post
Share on other sites

I love using GSAP but Adobe Animate is also a very powerful tool for the banner production. To be honest i never saw the need to combine the two techs. The line animation above can easily be accomplished with Animate CC without having to add GSAP to it. 

lines.fla.zip

Link to post
Share on other sites

This feels like the right thread to post this in.

 

Does anyone have any tips or tricks to improve animation performance in an Adobe Animate file?

It's been years since I've used the program, and I'm totally unsure of whats available to me.

Link to post
Share on other sites
1 hour ago, joe_midi said:

Does anyone have any tips or tricks to improve animation performance in an Adobe Animate file?

It's been years since I've used the program, and I'm totally unsure of whats available to me.

I haven't opened it in ages either, so I'm not sure but perhaps @Carl has some ideas. He has some great courses in his Creative Coding Club and I think he deals with Adobe Animate a fair amount (correct me if I'm wrong, Carl). 

Link to post
Share on other sites

HI Joe,

 

I'm assuming you are using the HTML5 output for ads or something.

 

I have found the animate canvas performance is often worse than what I would get when moving DOM elements around. If I create loops of a hundred or so things moving around I often hit some jank which you would never see with pixi.js or other canvas libs.

 

filters like dropshadow will kill performance.

 

also animate really suffers if you have a large stage / canvas

 

i also found nested symbols to be problematic.

 

I'm no expert on it though, there are probably a dozen more probable causes. 

 

Adobe's performance suggestions usually revolve around using spritesheet textures on export.

 

 

  • Like 2
Link to post
Share on other sites

Thanks @GreenSock, thanks @Carl

 

On 8/28/2020 at 12:03 PM, Carl said:

I have found the animate canvas performance is often worse than what I would get when moving DOM elements around.

 

This is what gets me. I'm experiencing performance drags on something I know full well that would be fine if I wrote it as DOM elements + GSAP.

 

On 8/28/2020 at 12:03 PM, Carl said:

i also found nested symbols to be problematic.

 

 

I found that having a small symbol graphic that was duplicated as a tile was causing performance issues, it didn't seem to handle multiple instances of the same symbol that well. Considering I vaguely remember Flash doing so well with that.

Instead I've had to render as a bitmap, which I feel is so odd, but I imagine thats a limitation of the canvas rendering cycle?

 

 

 

Link to post
Share on other sites
On 6/4/2020 at 6:56 AM, 2020AdobeAnimate said:

Hi everyone (Beginner level), 

I use adobe animate + gsap to create html5 banners. So far I can make images, colors, and text fade in and move the objects around. I was wanting to elevate my animation ads. 

So! I love the gsap DrawSVG. My ideas was to have a lines come in left to right. Anyway of doing this in adobe animate? please help. 

Example attached. 

source.gif

Yup I Got the same issue. I have already asked somewhere, but no useful idea> :(

Link to post
Share on other sites

Create an account or sign in to comment

You need to be a member in order to leave a comment

Create an account

Sign up for a new account in our community. It's easy!

Register a new account

Sign in

Already have an account? Sign in here.

Sign In Now

  • Recently Browsing   0 members

    No registered users viewing this page.

×