Alpha Channel Line Drawing Reveal Not Animating

I am trying to reveal a hand drawn line drawing with Lottie in Webflow. In After Effects, I used the paint effect with an alpha channel over an eps exported from Illustrator to reveal the line drawing.

I have tried just about every export setting in Bodymovin and can’t seem to get the drawing to animate in Webflow, even though the illustration appears.

What I would do, is break down each brush/shape into an individual layer then place a mask over each drawing/shape and then animate the position of the mask to reveal the underline drawing. You could have it follow the same path as the brush effect/drawing effect.

Thanks for the quick reply!

Let me make sure I get this right, because I tried what I thought you were suggesting and it didn’t work.

Just to clarify on my end, I have one layer (the eps of the illustration), then I created a paint effect with 6 brush strokes, I selected the option to turn paint on transparent on, I went into stroke options, and then animated the end from 100% to 0%. After that, I changed the channels to alpha

Are you suggesting I:

  1. Create a new shape layer, and then copy and paste each brush (selecting the brush # line for each brush, 1-6, from the dropdown when copying) into each shape layer (making a total of 6 layers)?

  2. Then, I go into each new shape layer, and add a mask to each?

  3. Do I leave the eps layer alone?

  4. How do I animate the position of each mask with the path from each brush? Do I simply copy the path from each brush and paste it into the path for each mask? Is there anything additionally I need to do with keyframes?

  5. Do I delete the paint effect from the eps layer?