Friday, March 18, 2022

Adobe Illustrator paths as center paths, not outlines, in After Effects

 Illustrator offers the following for stroking a path:



After effects offers the following:


As you can see, these are completely different implementations of the concept of "stroke". AI offers a "variable width profile" but the closest AE comes is "pucker and bloat".

When you do "create shapes from vector layer", since AE doesn't have the same concepts of "variable width profile" or "brush definition", the only way to make an AE shape which matches the appearance of the stroked AI path is by outlining the stroked AI path and giving it a fill.

But an outline with a fill and a linear path with a stroke behave very differently. For instance, "trim path" on a wiggly line which is actually a long skinny outline with fill is a disaster, with negative spaces filling depending on where the path is truncated.



If you want to create paths in AI which import as the same paths in AE:

  • Don't do any Illustrator operation such as "outline shape" which replaces your center path+stroke with a closed loop outline+fill. Once you do this you can't get back to the original path in AI or AE. Make sure your path in AI is a linear path.
  • Use the "path" tool to input as bezier points, or the "brush" tool to draw with mouse or pen tablet, or shape tools such as "ellipse". Make sure "variable width profile" is "uniform" and "brush definition" is "basic". Don't use any fancy stroke or fill features in AI... if you do, AE doesn't have a matching feature and you'll end up with outline+fill shapes in AE.
    • "blob brush" and some other tools are inherently outline+fill even in AI and can't be brought into AE as path+stroke.
  • You can copy the path in AI and use fancy stroke settings on the copy. Label them clearly. If you are going to bring your AI file into AE, then you should probably always keep a copy of all the simple raw paths you create, simply because it is a PITA to try and recreate one later. Once in AE you can use the original raw stroke in parallel with the perfect complex stroke, e.g.
    • Use the original path in AE to animate something along
    • Have different layers of strokes, etc, on top of the complicated AI stroke
    • Make a rough trimmed stroke that you use as a matte to simulate trimming the complicated stroke 

No comments: