what app do you use for animations in canvas?

[Mike018]

Coming from only using JS with SVG, I'm now looking at options for creating more interesting animations in canvas. What do you guys use and why? I've been heavily using Illustrator the past year, so naturally I'm looking at Animate CC, but I want to give other apps a fair shake as well. I'm not interested in doing complex animations like walk cycles, just moving shapes and subtle animations & effects for more complex graphics.

[mattstyles]

Not that I do much of it but I tend to use PyxelEdit when I do. Super lightweight compared to Illustrator, totally different experience. That's targeted at pixel art.

[alwayzambitious]

how is your experience with animate cc going Mike, I am about to start using it with Pixi

[Mike018]

13 hours ago, alwayzambitious said:

how is your experience with animate cc going Mike, I am about to start using it with Pixi

Never used it. Since my first post, I've gotten pretty good at using greensock, velocityJS, and the phaser tween library. If you are just tweening simple elements, I'd recommend just getting good at a tweening library rather than using animation software. So much more fun, cleaner, and easier to modularize.

[blackmoondev]

I use Animate CC (previously know as Flash;) for pretty much all my adult life. As the drawing/animating tool - it's super awesome. Recently I experiment with Spine and Spriter - they are both good (I feel Spine is a bit more sophisticated) but for simple Html5 games I use Animate, cause it's easier and faster for me to do the animations. 

[alwayzambitious]

I agree Mike! My only frustration is doing the math to place the responsive elements on screen, as opposed to laying them out in animate... but its probably worth the practice @Mike018 how do you place or "design" the objects on screen. using code right?

[Mike018]

On 1/6/2017 at 10:59 PM, alwayzambitious said:

I agree Mike! My only frustration is doing the math to place the responsive elements on screen, as opposed to laying them out in animate... but its probably worth the practice @Mike018 how do you place or "design" the objects on screen. using code right?

Yep, just with code. First make a mockup of everything in affinity designer or a similar application, then place every element relative to the screen.

[scheffgames]

I'm using Moho (formerly knows as Anime Studio). It's a complex piece of software but the final results are quite awesome. You can do both frame by frame and skeletal animation and you can also create your vector art in it. I gave Animate CC a try but I just couldn't live without keyframe animation - there's no interpolation between keys and you have to tweak your character each frame by hand.

[blackmoondev]

On 1/19/2017 at 8:34 PM, scheffgames said:

I gave Animate CC a try but I just couldn't live without keyframe animation - there's no interpolation between keys and you have to tweak your character each frame by hand.

Just right-click on the timeline between two keys and select the tween method (I recommend "classic tween"). You could than also tweak the tween ease. 
(for it to work you need to have single movie-clip on a layer btw.). 

Also - I recommend Spriter and/or Spine for skeletal animation. 

[scheffgames]

11 hours ago, blackmoondev said:

Just right-click on the timeline between two keys and select the tween method (I recommend "classic tween"). You could than also tweak the tween ease. 

Oh, nice, didn't know that. 

 

11 hours ago, blackmoondev said:

Also - I recommend Spriter and/or Spine for skeletal animation. 

Gave them a spin but I'm still a Moho fanboy. It truly is the ultimate 2d skeletal animation software as far as  I know - awesome animation workflow, complex (in a good way) bone system. I admit that I was interested in Animate CC for on the fly particle creation which you can attach to your animation but as it turns out Moho can do that as well.  

[blackmoondev]

Moho looks cool. I guess I'll download the trial and check it out:)