search

airbnb / lottie-web

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

JSON Drop Shadows #2432

Open motions96 opened 3 years ago

motions96 commented 3 years ago

Hi guys,

Loving Lottie but having trouble with drop shadows. I'm unsure if they are supported or not? When I upload my json to preview, the drop shadow is like a grey box - https://lottiefiles.com/share/62oek9mg

However, in the preview and on Webflow, drop shadows seem to be working.

Just wondering why this would be? Is the drop shadow going to work when I hand my JSON over to a dev or not?

Here's my setup: m06u707rvbb61

bodymovin commented 3 years ago

Hi, lottie-files doesn't expose all supported properties, that's probably why it doesn't work there. But if you see it correctly in the preview, you should be fine. If it doesn't, you might need to adjust these properties. https://github.com/airbnb/lottie-web/wiki/Renderer-Settings#filtersize-svg-renderer

henriqrossatto commented 3 years ago

Hi @motions96

I had worked with drop shadow using them as an image. So I add it in a new comp, mark "only shadow" and export one frame as png sequence. After it I import the shadow png and place in the animation. Just take care with the size of the final comp because you can have problems when scale it.

When I make the lottieweb exportation I mark to have the image inside the json instead in a folder

ision-industries commented 3 years ago

@motions96 I thought Lottie doesn't support effects/plugins. I'm trying to find a workaround for rendering Drop shadows with a new project