I made my character in Photoshop and exported it as .SVG, then I opened it via Illustrator to make an .ai file, after that I opened the .ai into After Effects to make a shape from this but I went wrong as below: again i draw a character in illustrator with pen again the result is the same. youtube link that work as same as me https://www.youtube.com/watch?v=E3pHatQbZqk

(i wanna to make animation as this link http://airbnb.io/lottie/after-effects/artwork-to-lottie-walkthrough.html)

SVG exported by photoshop and opened in illustrator:

SVG exported by photoshop and opened in illustrator

Saved as .ai:

enter image description here

Opened in After Effects and made it into a shape layer:

enter image description here

The result: enter image description here the the result

  • I don't know too much about this feature and I haven't used it much, but I wouldn't be surprised if it had something to do with the source image containing raster images or perhaps there are some other features that are not supported by the "Create shapes from vector layer" method. As a test you could try to create another simpler vector object and see how that turns out when you try to convert it.
    – Joonas
    Apr 27, 2018 at 12:55
  • thanks for commnet, i also test a sample with pen in illustrator again the result is the same
    – omid k
    Apr 27, 2018 at 12:58
  • 3
    That seems like an awfully convoluted way to go about it... why are you going through all those formats? If you need vector shapes then there's no reason not to make your art in AI in the first place
    – Cai
    Apr 27, 2018 at 13:03
  • i wanna use it to android studio as this link airbnb.io/lottie/after-effects/…)
    – omid k
    Apr 27, 2018 at 13:40
  • @omidk that's not going to work; you've got a raster image, you need vectors
    – Cai
    Apr 27, 2018 at 13:44

1 Answer 1


A quick note on your workflow... Saving an SVG from Photoshop doesn't turn your Photoshop artwork in to vector data. Likewise, opening an image in Illustrator and saving it as an AI file doesn't. Most vector file formats can hold raster images too so the format itself is often meaningless; if you need vector images then they need to be created as such.


If your goal is to use the artwork here: http://airbnb.io/lottie/after-effects/artwork-to-lottie-walkthrough.html then you can't really use any artwork from Photoshop (which will be raster), you need vectors. It looks like that works exclusively on shape layers and for After Effects to be able to create vector shapes you need a vector image.

The dark grey shapes you get when converting to shapes in After Effects is a result of converting objects which After Effects doesn't understand/support as vectors. This can be a raster image, but it can also be raster effects on a vector object, or any number of appearance attributes (brush strokes in Illustrator will give you the same result for example). In your recreated vector example I suspect the gradient fills may be causing issues (which I assume is because they're being converted to raster images; remove the gradients and I suspect it will work as expected)....

For more on creating shapes from vector images see:
Adobe Help – Create and customize shapes and masks in After Effects

Which says...

  • Not all features of Illustrator files are currently preserved. Examples include: opacity, images, and gradients.

  • Gradients and unsupported types may show as 50% gray shapes.

Long story short, avoid problems when converting to shapes in After Effects by using vector shapes (actual vector shapes created in Illustrator, not exported from Photoshop) with no appearance attributes (other than basic fills and strokes).

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service and acknowledge you have read our privacy policy.

Not the answer you're looking for? Browse other questions tagged or ask your own question.