S curve in spriter

[bwwd]

Why it works so weird, speeds up then slowdowns noticeably in the middle between keyframes, its not how its supposed to be, in spine it works perfectly but here in spriter its strange, also im using in to smoothout last keyframe with first one because it doesnt work too well in the middle of animation, there is something wrong with implementation of curves in spriter, do you guys actually tested it in the middle of animation, it looks bad, kinda useless i would say, only useful if you have 2 keyframes for entire animation, then it works fine , but if you have more than 2 and youre using S curve for all keyframes then its very strange motion, even worse than linear , in spine its all perfect when you use S curve for all keyframes.Why is that ?

When im using S curve in spriter for multiple keyframes (3 or more) then It looks like its still linear but it speeds up/ slowdowns in a weird manner.

Also can you guys do something like blender has , so its using S curve by default ? Some sort of switch , so i wouldnt have to select curves on all keyframes , just tick box and it would use S curves automatically.

Linear curve is quite bad for animation.Do you guys have any spriter example of walkcycle using S curves on entire animation ? I do and it looks very bad straight from spriter.

 

----

 

So after a couple of irritating results here is my test with S curve in spriter, there are 3 keyframes all with S curve there, this one :

http://i.imgur.com/YCYfFBG.jpg

 

 

Keyframes are on 0,300 and 600, timeline has lenght of 900, animation starts with head on bottom, look how speedup is last one (from top to bottom) , its not how it should be ! Obviously S curve doesnt work properly on more than 2 frames and id say its a

serious problem.

 

 

 

---------

I made some more experiments and i found out what is wrong, its the main keyframes on very top !!

IF you change them to use S curve then they wont change S curve for all bones on this particular point on timeline, when you take a look at keyframes for particular bones - theyre still linear ! This is very strange,  so what's the use of changing that curve on main keyframe on top ? The one that moves all other keyframes if you move it .

This is created by adjusting S curve on keyfram of this particular bone instead of keyframe on very top and it works fine !

I would prefere to change keyframes curve by using the main keyframes on top, i dont want to change curves on my entire rig so many times , there should be some better way to do it, i thought that main keyframe will change curve for all bones below it but its not how it works, so why it even has curve to adjust ? Can you guys do something about it , changing curves like that on all bones in animation multiple times is insane !

Anyway there still should not be that speedup after 3rd keyframe in first animation, so there is something wrong there definitely, becuse on first example S curve works fine from 0 to 1st keyframe and 1st to 2nd but from 2nd to end it doesnt work too well.

How to change curve on multiple bones, or all of them? i select all of them then second mouse button and menu pops up to pick curve, linear instant or custom S, so i do it but when i check them after this then they keyframes curves arent changed at all , just single one !

I would even pay extra $$ for spriter version that doesnt use linear curves at all, only S shaped one, cubic with 2 points (top,bottom)or bezier S by default.Linear is fine for robotic movement, tricky to use it for decent animation of living creatures.

IF i cant change curves in all keys in spriuter then can i open spriter project as TXT file and replace some lines to get S curves on all keyframes ?

Also if you guys ever fix this issue with curves then please add preset for S curve, i dont want to create it myself everytime i choose other curve than linear, it will save A LOT of time, when i click 2nd mouse button on keyframe then in small popup menu  should be linear, S curve and instant curve, and then on very bottom "edit curve" or something.now its only linear ,instant and edit your curve, and then even more stuff to click and click and click and click and wow i changed it to S curve finally !

--

yeah i figured out, i can replace curve in spriter file on keyframe with curve_type="bezier" c1="0.2879" c2="0" c3="0.7189" c4="0.995261" spin="0"> but its still painful, i think even more than changing it in spriter itself oh why  :-|

Also i noticed if you will save main keyframe on top with bezier curve then all other keyframes below it will still use default linear curve, its a bug or something else ?

+++

Tried again, this time i changed all main keyframes to use S curve and.... it did used curve on all main keyframes ( including last ones, dont ask me why ! i dont know why it worked, but "worked" and result is not what i would expect form s curve:

see how its very robotic ? its worse than linear !

This is linear for example :

Its much better but it shouldnt be !

I dont know why is that, how custom curves are used in spriter but this is not how outcome should look like  :-|  weird staccato movement, now "stops" that i want to avoid from linear are even more pronounced and its very bad !!

--LOL i disovered that using bezier /S curve gets identical results to using this curve:

So maybe spriter displays graphs and curves but doesnt really use them properly, because how is it possible that S curve and this curve "peak" gets the same staccato results ?! Try it yourself guys.

It simply speeds up in the middle of keyframes then slowdown close to keyframes, which is wrong.

This is how curves are handled in blender :

http://wiki.blender.org/index.php/User:Jaredr122/Doc:2.6/Manual/Animation/Editors/Graph/FCurves

[bwwd]

------

another experiment/ comparison, first is S curve in spriter, second is linear interpolation in spriter:

any differences? first looks bit worse because of sudden"stops" especially on hand with sword! S curve creates that stop and it should do exactly opposite , right ?

This is the curve i used:

 

Here is test in spine 1st is linear and second one is S curve, look at the head how it rotates smoothly on second one, this is how s curve should work in spriter:

 

Spine s curve looks like this:

I tried to do similar curve in spriter but i dont think its possible , its quite subtle and close to beginning /end and in spriter when you bend curve then you have quite large peaks, i really dont know why spriter's easing curve doesnt really improve animation, most of the time it makes it worse and i tried very subtle curves and its still the same , its not easing movement enough IMO its too drastic and too visible nomatter how subtle you want it to be.

Ahh im tired, if you guys really think that theres nothing wrong with spriter's curves then please show me project example, walkcycle when curves are improvement over linear because i cant make them improve animations like in spine, which is odd.

This is my last example, look how fantastic it looks like, its from stickman software that i used for my first animations, its interpolation is really amazing, like ragdoll physics, i would LOVE to get that result in spriter ! 4 keyframes to create rectangle but look how it moves with curves, this is how i would love spriter to do to all my animations by default !!

 And This is spriter result with S curves  :-| : 

Second one still looks very linear even tho i used S curves on all keyframes in spriter, first example looks great and rectangle path becomes more like circle which is fantastic for all kind of animations, i would pay for spriter again if it would have this kind of keyframes interpolation by default ! IF you guys think it is possible to create in spriter something like this first bear animation on rectangle path and bezier S curves  then please show us, i feel dumb when trying to figure out how curves work in spriter.

Look how there isnt even noticeable stop at any corner of rectangle on first bear animation ! If i could get something like this in spriter it would be amazing ! IT doesnt even hit its corners perfectly because its easing X and Y axis so good to get rid of any pause on corners, this is how easing should look like and my animations from spriter would improve a lot, im trying hard to get rid of linear motion in spriter but with interpolation like first bear i would be very happy.

[Mike at BrashMonkey]

Hi bwwd,

 

Thanks for all this feedback. ?But this is a lot to digest and respond too... so please bear with me as we tackle this in baby steps:

1) There seems to be confusion caused by effect of altering the speed curve of the main timeline keys VS altering the speed curves of specific objects key-frames.

    a) There are many times where its very useful to have each object move or animate with its own curve (timing)..for example with UI or menu options coming onto the screen etc.. you might want each item to appear at a different time, and ease in or out etc at separate times or eve different easing styles from one another.  In this circumstance you should leave all main line key frames in the standard linear mode, and specifically make custom curves as needed on the key frames for those specific objects. This will produce the desired results for this sort of need.

    

    B) There are times when you've made an entire animation sequence, but you want to tweak the overall easing in and out of the entire cohesive animation..this is when you'd leave the specific objects keyframe's curve types to the default linear, but would alter the main timeline's keys as needed to create the necessary easing.

   c) If you've created an animation with custom easing curves for specific objects, you can then edit the overall animations curves by editing the curve types of the main time-line's keys.

So far as I  can tell, this all works exactly as expected so far, BUT with the qualifier that (like you said) There are only two key-frames for the entire curve...a start and a finish... my next point is I think whats causing the confusion and un-desired results.

2) The curves are ALWAYS effective exactly for the duration of one keyframe to the next key frame... There's currently no way to have one custom curve control the entire duration of an animation instead of just controlling from the point in time of the key until he next key.  I'm going to double check this point with Edgar once he's online. But I can see how this is very limiting compared to being able to designate specific duration for the curve to control, instead of the seeming current limit of it simply being from one key-frame to the next in that specific time-line.

I'll check with Edgar and report back here about it as soon as I can.

 

cheers.

[bwwd]

Well i think if easing will be fixed so animation would look like this 

instead of this :

Then  all other uses of curves should work just fine, even the one that you mentioned about different menus speeds etc. 

I just want S curve to smooth out my entire animations ,  not just slowdown from one key to another, because that still looks very linear.

Global curve setting for entire animation would be great if outcome would be like that first bear picture.

Simply put , using S curve in spriter gives totally different result than using S curve in blender or spine, this is unusual for me, i thought i will be able to smooth out linear motion , especially where character moves left and suddenly moves right on next keyframe, S curve in spriter should smooth that out but it doesnt, it slowsdown right before character moves right making that pause even worse , that doesnt look good.Look at that second bear, stops are still very pronounced on corners and should not be.

In spine i select S curve for all main keyframes one by one - not globally and results are great, i do this in spriter and results are weird.

Or its some kind of misunderstanding and spriter curves simply cant make walkcycles or any other semi realistic animations to appear more smooth and non linear.Thats why im curious to see example with properly smoothed out walkcycle with curves in spriter because i just cant find right settings to smooth out its linear motion.

[bwwd]

Here i made video like i promised, first curves in spine ( because they are more similar to spriter) i applied them to all keyframes, just selected them all and changed their curve.

When i switch between linear and bezier S curve then you can see when liunear is applied then head and eeyes suddenly stop on left and start moving right, then when i apply S curve then this sudden stop is smoothed out, so it looks more natural, this is fine i like how default spine S curve works, its how its supposed to be with S curve:

https://drive.google.com/file/d/0B8RnYSep1u_YenVwekNDVVUzOFU/view?usp=sharing

 

Now this is blender, this is what i would like to be able to do , take a look at cube when it travels on top from left  to right, there is very smooth circle-like motion that i could do with curves,on bottom is simple linear , its possible because curves can go beyond boundaries and i can shape circle ( this moving curve over boundary was kinda possible in spriter as well but was removed ? why ?)

Then take a look when i change curves back, motion becomes more linear and similar to spriter, you can see how it stops on corners on top.

https://drive.google.com/file/d/0B8RnYSep1u_YTFdkWXltSXZ5VGc/view?usp=sharing

 

Im no coding expert but im sure there is some techical info on web how to design curves so they would give more oval type of movement instead of pure linear lines.

I would like to have this kind of interpolation that would create more circular-like motion when i need it and i need it very very often with walkcycles and basically every type of living creature movement - the problem is i cant get desired results in spriter no matter how much im bending curves.Linear is fine for other stuff, some kind of setting to switch even globally between this kind of circular interpolation and linear one would be perfect.

 

--- Something i realized might help is taking value from last position of curve on keyframe 0 and apply it to first position of curve on keyuframe 1 so its more smooth, this could create this seamless curve over entire timeline like blender, but that would require some new type of bezier curve that would remember end setting from previous keyframe and apply it to its own beginning so you know between two curves there would be very smooth path, it wouldnt jump suddenly because curve 0 ender higher than curve 1 starts.

Overall i dont reall ywant sophisticated advanced bezier curves like in blender but something that would give oval shaped interpolation instead of going straight line with same values over x an y , it would try to give it more interpolated oval like path/line.And it doesnt matter if its done with curves or not :)

 

---

I think im onto something, i did this test with S curves in spriter and 2 keyframes and then i added 2 more for second animation , see the outcome :

That one looks great i love the slowdown S Curve works great and there is no stop pronounced, thats fantastic and works with 2 keyframes( on 0 and on 500) , here i keyed both torsos !

Now check this one :

This looks very bad ! Its still the same animation but I added 2 keyframes between key 0 and 1 ( at about 250) and between key 1 and end of the timeline (on 750) , so from my experiment it looks like you cant smooth out between more than 2 frames , somehow it just works wrong in spriter, if i ad keyframes with s curves inbetween then animation looks bad and stops suddenly.

So i have an idea, if new keyframes ruin interpolation between old ones then how about "no curve" keyframe which would use existing S interpolation from previous keyframe instead of its own curve which resets and ruins smoothness ? I think linear should do that but it doesnt, if you have frames on 0 and 500 with S curve and add keyframe on 250 with linear curve then this linear curve also ruins that smooth S curves move between 0 and 500 , this should not happen.There should be some way to prevent that.

Whats interesting is that both torsos changed their interpolation and i keyed just bottom one !! This is wrong and that torso on top is using 2 keyframes yet it  was forced to use interpolation from that bottom torso even if higher torso did not have keyframe on 250, this is not how it should work.Higher torso should still look like on first picture , because i did not created keyframes for it.

Its because i changed S curve on very top keyframes instead of on partiucular bones lower on timeline.IF you add curve to top keyframes then they will be used for entire timeline unless changed again by top curve, but i think its a bad idea because when you have S curve on top on first frame and you want to preserve it through entire timeline then you cant have any additional keyfeames because theyu will ruing that S curve for you , with each new keyfame there is also new main keyframe on top with its linear curve and that linear curve is ruining previous S curve :(

Here is video explaining what i did:

https://drive.google.com/file/d/0B8RnYSep1u_YLXVoajlIWllCTUk/view?usp=sharing

I think this might be one of the reasons why curves interpolation looks bad in spriter, because main curve applies itself to every movement of every bone/sprite on that particular point on timeline , doesnt matter if it has actual keyframe .That's a mistake, and its creating this staccato , stops suddenly where you put s curve and ruins effort which looks great with only 2 keyframes.

But even if this will be fixed then it still wont get me circular interpolation using curves that i desire so much for very fluid movements.

Using main keyframe on top to adjust curve is wrong and its better to use curves for particular bones and its painful to change a lot of them later when animation is finished :( There is no way to do it like in spine , select all keyframes and change just one curve for all of them.But im wondering if this would give me nice results in spriter like spine does.

 

HEre is simple diagram of how it is in spriter and what i would like to have when using S curves , i hope its clear and understandable explanation , because i feel spriter is still linear even with S curve, which just changing speed , not actual X and Y path of keyframed bones/sprites:

BAsically i need to change the look of path, not timing itself which can be changed with moving keyfrmes closer or farther, i would like to get that oval shaped path that i dont get with linear path from point to point.Its possible to do in blender and in that stickman software tht i was using - stickman had it by default and it makes a lot of animation much more realisdtic and fluid, because linear motion is not in nature no living creature moves like that, path xy - stop - path xy - stop , many animals move in circles/ oval shaped paths.

[bwwd]

Well, now i have good news, i think ifound a way to achieve that smooth motion in spriter with curves but there is a limitation, it could only be achieved between 2 keyframes! its very tricky to work like that especially if there is no option to apply S curve to currently selected multiple keyframes and because there is this bug where moving parent object/bone will create also keyframe for its child bones - and i dont want that, i want to have only 2 keyframes for one bone on entire timeline and i have to delete many of them that spriter atomatically creates for child bones/objects.

All top/main keyframes curves are not changed from linear because they work weird, not really useable for a lof of things.

I changed curves on particular keyframes for particular bones below main keyframe on top.

This is my result using S curves, mostly between 2 frames , to my surprise you dont even need to have keyframe on the beginning of timeline, i didnt know that and i thought my bone will be deleted completely !

 And this is linear curve, look how it stops before goind up/down : 

So this will be my workflow for now but this bug that creates keyframes for child bones when you move parent is making this workflow VERY time consuming because i have to delete a lot of keys, i hope this and change of curve for multiple keyframes with one click will solve the problems, i still would love to get that circle shaped interpolation but what im getting with what we have is also really nice, i do think that this kind of curve should be used as default one from beginning for all keyframes that you will create and you dont even have to change them from linear to S curve, so you can choose from menu if you want to use linear or S curves, Im also not sure if this kind of problem limitation to use S curve only for 2 keyframes  will stay in spriter for long, i mean i can work around it right now but i would like to ultimately set S curve for all selected keyframes and be done with it and get result like first alien here.