search

airbnb / lottie-web

Render After Effects animations natively on Web, Android and iOS, and React Native. http://airbnb.io/lottie/
MIT License
30.57k stars 2.87k forks source link

Gradient Flipping #2417

Open Code-Bear opened 3 years ago

Code-Bear commented 3 years ago

Windows 10 Pro Version 2004 OS Build 19041.685 Google Chrome Version 87.0.4280.88 After Effects Version 17.5.1 (Build 47)

Just a heads up, I am extremely new to AF and Bodymovin. I have an AF file with a few compositions I wanted to turn into Lottie files for a website. I opened the file and opened Bodymovin, kept all the settings as default, and attempted to render the file. It makes the JSON file and I can see it in the preview as well as on my site but it appears the shadows for the different objects are getting messed up. Again my knowledge of how to use AF is very limited but it looks like they are just shapes with a gradient fill that gives the appearance of a shadow.

When I go to export the file, the shadow (gradient filled shapes) seem to export but in some of them, the gradient seems to reverse. Nearly all of them but not all of them are reversed and I have no idea why.

Screenshot 2021-01-04 125204 2021-01-04_12-44-12

Isometric Concept 3a.zip

bodymovin commented 3 years ago

Hi, gradients are read from the .aep file itself and when layer names and property trees are too similar the exporter can't find the right values. Can you try renaming your layer called Cylinder 2 to something like SecondCylinder 2 and save the project before exporting? That should solve the issue.