GSOC-2019::Export Animation for Web

lottie
export

#1

Hello. I am Anish. I want to contribute to Synfig in GSOC 2019. I would like to work on export for web through lottie export format. Please suggest me where do I start this.


#2

Hi @AnishG! My name is Konstantin Dmitriev, I am maintainer of Synfig.

Please let me know some additional information about you - what are you studying (and where), what programming languages you use, and what projects you have implemented/participated (if any).

For getting started recommendations please check my comment here - https://github.com/synfig/synfig/issues/704#issuecomment-469037539 :slight_smile:


#3

Hey @KonstantinDmitriev,
I am a 3rd year undergraduate student pursuing my B.Tech in Computer Science and M.S. by research in IIIT Hyderabad, India. My research domain is around compilers in Computer System Groups(CSG) lab, IIIT Hyderabad.

What programming laguages you use?
I have fairly good understanding of Python/C,C++/Java,openmp,cuda languages.

What projects you have implemented/participated?

  • Implemented a 2D game using openGL and c++ openGL_PacmanKiller.
  • Implemented a 2D game in python.
  • Implemented a web app similar to bookmyshow.com (The forum is not allowing to post more than two links :frowning: )
  • Written code generator and AST passes for Decaff-compiler. (Can be found on my github profile)

Please let me know where should I ask the doubts(if any), on this forum or on the issue?


#4

LINKS for the previous post


#5

@AnishG Thank you for the links! Your portfolio looks impressive! I am happy to see you got experience in C++ and also OpenGL. :slight_smile:

Please let me know where should I ask the doubts(if any), on this forum or on the issue?

All doubts/progress related with Export for Web project should go to https://github.com/synfig/synfig/issues/704

On forums we can discuss general development-related problems, ideas, proposals.


#6

@KonstantinDmitriev Could you suggest me some layer to work on? Should I select any layer from ‘synfig/synfig-core/src/synfig/layers’ ? Also where can I read about the .sif (Synfig format) ? I tried creating a simple polygon layer and saved it in .sifz format, but it seems to be a binary file.


#7

Hello @AnishG I can help you with sifz. When you save it, manually change it to .sif by default it is .sifz


#8

@Reshabh,
Thank you for helping me out. But how does changing the file format manually help?( I tried but didn’t help :()
How do access the .sif file similar to .xml format?


#9

Okay, It worked. While saving I changed it to .sif format.
For others, this also might be helpful https://wiki.synfig.org/Sif_Format


#10

Could you suggest me some layer to work on? Should I select any layer from ‘synfig/synfig-core/src/synfig/layers’ ?

I suggest to take an Image Layer or Star Layer (https://wiki.synfig.org/Star_Layer). Polygon Layer is good too, it is just more complicated (which doesn’t mean bad).

Also where can I read about the .sif (Synfig format) ?

Unfortunately, SIF format is not documented anywhere. It is just a XML document and it is quite easy to read.


#11

@KonstantinDmitriev
So I was trying to get familiar with both the .sif and lottie format. I am facing one problem as how will we map the parameters across these formats.
For example, there is a parameter “z_depth” in a layer, but I could not find any such parameter in the lottie format.
Where as some parameters such as “transformation” are available in both and can be transformed into lottie format.
Any help would be appreciated. TIA


#12

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


#13

@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


#14

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


#15

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


#16

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.


#17

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.).


#18

@KonstantinDmitriev, Thank you for your side of view. So I decided to continue with this project only :slight_smile: .
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.


#19

I think it is fine to share it here. I will be happy to provide my feedback. :slight_smile:


#20

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?