This is the big challenge with Synfig/Lottie conversion…
It is a very different concept, you can’t map directly from one format to another, as well as SVG import is failing for a lot of years…
Unless we develop a Lottie dedicated version of Synfig with specific layers and the full set of parameters
1 Like
@BobSynfig, Thanks for answering!
For now, I will make a list of parameters which do not match and try to match as many as possible. But what about the remaining ones, any idea? Should I just ignore them(don’t think that’s a good idea in a long run)? Or I can ignore them for now and raise an issue for addition/alternative of those parameters?
TIA
1 Like
For me, export to Lottie is simply… a bad idea!
Lottie has specific targets, looped animations mostly for apps and web.
Also it is a format to display animations generated through a plugin from Adobe AfterEffect https://airbnb.io/lottie/after-effects/getting-started.html
It is like to expect transmutation from lead to gold.
As I mentionned it before, SVG which is a long-date standard is still not properly supported in Synfig.
I don’t think adding a “sketchy” support for a format generated from a paid closed-source software (AAE) would bring any interest to Synfig but instead a feeling of “I was expecting it to work but it doesn’t”
Unless we modify Synfig to work specificaly for Lottie, while it is not even partly done for SVG.
Disclaimer: This is only my personal opinion, I am not implied in decision taking for the directions to take in Synfig’s development
1 Like
Now I am getting really sketchy about this project. Should I even pursue this any more?
@KonstantinDmitriev, you are the mentor for this project. Could you give me your side of view regarding this.
Thanks
Since I’m became Synfig user the topic I’ve read the most is about import/export SVG files and SVG animated support, the only open source editor that I know can work with this is aniGen editor, but is not the most intuitive editor to use and I’m a Synfig user. I don’t even know what Lottie was until I read it here.
Yes, you can ignore parameters that are not supported in Lottie.
I am do not share opinion of @BobSynfig regarding perspectives of Lottie format.
My key point: we are not aiming on adding 1:1 conversion.
So, we do not expect to convert everything what Synfig can do, we do not expect output to look 100% the same. In the same way, Lottie doesn’t supports all features of AE - http://airbnb.io/lottie/supported-features.html
What we should aim to achieve is a proper conversion of vector graphics (outlines, regions, geometric primitives) and images. Those are enough to create simple but impressive vector-only animations using Synfig, like these:
So, if user will use vector-only tools of Synfig, then he will be able to produce animations in Lottie format.
Here is another example of animation created with vector only tools (with an exception of blurred background at the end, which also could be replaced by vectors):
I think it is ok to have exporter, which doesn’t supports all features of Synfig (which, in fact, is a frequent case for any app when converting from one format to another). Also, the exporter can analyze of contents of suif file before exporting and give a warning with a list of layers that cannot be converted (if any).
With this I believe this make Synfig a tool for creating web animations (vector, motion-graphics, cutout, etc.).
2 Likes
@KonstantinDmitriev, Thank you for your side of view. So I decided to continue with this project only 
.
I have made some progress regarding the mapping from .sif to lottie.
I have picked up all the parameters from Star_Layer and mapped them to lottie format.
To whom and where do I share my progress, so that I can start working on the python plugin as soon as possible.
1 Like
I think it is fine to share it here. I will be happy to provide my feedback.
Okay,
Here is file as of now Mapping link.
Also would it be okay, if I share my pre-proposal with you and could you comment/suggest on it?
1 Like
@AnishG Looks great! Yes, please share your pre-proposal, I will be happy to provide my feedback.
1 Like
@KonstantinDmitriev, So I was getting familiar with the keyframes and the waypoints.
I came accross the interpolation part and got confused with the interpolation used in synfig.
So I read this wiki page.
Are the interpolations mentioned in this page somehow related to Bezier curve interpolation? Because lottie format currently uses this(bezier) interpolation method.
Any help would be appreciated.
Thanks in advance!
1 Like
Synfig has following types of interpolation:
- TCB Smooth: If you imagine a graph of the parameter’s value against time, using the TCB interpolation type will fit a smooth curve between adjacent waypoints, much like the Spline Tool fits smooth curves between adjacent spline vertices.
- Clamped: Acts like TCB interpolation, but never “overshoots” (or “undershoots”) the values you set in the Parameters Panel.
- Ease In/Out: The graph is horizontal as it leaves the Waypoint.
- Linear: The graph of parameter value against time is a straight line.
- Constant: Stops the animation.
The main type is TCB. It is a Bezier-like type. See descriptions here - https://wiki.synfig.org/TCB
Clamped is a type of TCB interpolation, with a tweaked values of Tension/Continuity/Bias/TemporalTension. You can se relevant commits in Git history, to see how Clamped type was introduced:
- https://github.com/synfig/synfig/commit/908b4e6ff9ab587342019031887aa1c9e180ab20
- https://github.com/synfig/synfig/commit/f5c3f7ee0f468cf0d8d8ef7fa50a636acbae734b
I highly recommend to check Synfig’s code, which describes how interpolation is calculated - https://github.com/synfig/synfig/blob/master/synfig-core/src/synfig/valuenodes/valuenode_animatedinterface.cpp
1 Like
Any tips or sources that will help me understand lottie better?
Thank you
Thank you
@KonstantinDmitriev
Is it okay If I start documenting the mappings done till now at synfig-docs-dev?
1 Like
Great idea! I have created a page at https://synfig-docs-dev.readthedocs.io/en/latest/projects/lottie-export-for-web.html
Please feel free to edit it as you like.
1 Like