February 24, 2023, 6:34am
Yesterday I reported an issue to github. Not sure that it’s the right place, so I create a topic in this forum.
In summary, whenever a group rotates, when exporting to lottie, firefox rendering does not support it and will create some pixelization, the image will be blurry when the group starts to rotate. This in principle can be solved not using
clip-path. Anyway, more information in the following link.
03:42PM - 23 Feb 23 UTC
**Describe the bug**
Group rotation pixelates when being exported in Lottie.
Steps to reproduce the behavior:
1. Create an image and put it in a group layer
2. Create some rotation animation on the group layer
3. Export to Lottie
4. Open the exported file with Firefox (Chromium seems to handle the rotation).
The animation should not be pixelated.
The first frame in which the group is not rotated, the image is flawless. However, when it starts rotating it breaks (it becomes ugly and pixelated).
![Peek 2023-02-23 16-30](https://user-images.githubusercontent.com/901061/220953485-1848c1bd-ebdb-4df7-99ab-415c87be3927.gif)
- OS version: Xubuntu 22.04
- Synfig version: 1.4.2 (installed with snap)
As you can see in the generated DOM, the group tab `g` is using `clip-path`. If one avoids using `clip-path` and puts the `path` directly in the group, the problem disappears (I did it by several trial and errors).
I also used other versions of `moving.js`, and it's the same.
I went also a little more down the rabbit hole, you are using `LAYER_SOLID_TYPE` where this might be solved with `LAYER_SHAPE_TYPE` type of layer. This affects the `ty` in the `json` lottie file, solid type has value 1 and shape type has value 4.