Lottie-web: exporting SVG images

Created on 9 May 2016  路  7Comments  路  Source: airbnb/lottie-web

I'm using it and it works great. Thanks for building this!

Only thing is that the export always export assets to PNG, is there anyway that it export the assets to actual SVG ? all of the assets are vectorial (Illustrator)

Most helpful comment

you should convert your layers of illustrator on .ae to shapes.
right click on them and select: Create shapes from Vector Layer.
there are some issues with merge paths but usually it works fine.

All 7 comments

you should convert your layers of illustrator on .ae to shapes.
right click on them and select: Create shapes from Vector Layer.
there are some issues with merge paths but usually it works fine.

That did it!
Thank you so much!

Hello,

I'm also having issues while exporting my animation. It exports everything as PNG instead of SVG, I tried to convert to Shape layers, but it breaks my animation, leaving some of them just outlined and not filled, the corners stays a bit transparent. If that wasn't enough, it's still exporting as PNGs.

I saved each layer as SVG on Illustrator and changed the data.json to use the new path img_0.svg, but it won't work, it still tries to load the png.

I'm having problems with Illustrator Layers as well. The vector shape is extremely simple, a white stroke with a solid red fill. I use "Create Shapes From Vector Layers", and everything looks fine in After Effects. When I render with bodymovin, the shape is exported but exerything is opposite- what was alpha is now solid and the solids are alpha.

i'm having problem same @flickitty
screen shot 2560-05-30 at 4 55 27 pm
screen shot 2560-05-30 at 4 56 27 pm

@flickitty @honeyhorny My issue was the same (seeming) as yours. My shape also had some compound and merge paths. I tried exporting my .ai files to older versions of Illustrator; as either Illustrator 8 or CC, and that worked.

Thank you @coryarmbrecht! I'm using Illustrator CC 2018 and After Effects CC 2017. The only way the BodyMovin export works for me is to save the .ai as Illustrator 8 format, import into AE, and then Create Shapes from Vector Layer.

Was this page helpful?
0 / 5 - 0 ratings

Related issues

hardy613 picture hardy613  路  4Comments

joelponce picture joelponce  路  4Comments

DannyK123456 picture DannyK123456  路  3Comments

phileastv picture phileastv  路  3Comments

deborabm picture deborabm  路  3Comments