Text/glyph animation overlapping upon export

I painstakingly created a decryption animation layer by layer, since the AE “decryption” expression route means having to export images frame by frame, reimport into AE, and then convert to JSON, which garners a pretty large lottie file at over 3MB.

Within AE the animation looks great, but upon export the HTML demo files shows overlapping text. What would cause this?

The text part of this animation is 58 layers of text. Frames 1-51 have four layer (for four colors), where layers 52-58 have 1-2 layers (for one to two colors). I selected Bodymovin for the export and made sure to select “Glyph.”

exported_html

Hello, @erin1

Unfortunately, very often text causes problems with animation (from my experience) and there can be dozens of reasons. It’s perfect that you tried Gliphs on/off, this excludes one of them. Is it possible for you to share the project?

Hi, I had tried Glyphs on and then off, and some other things, but ultimately what worked was laboriously creating outlines for each text layer. Thanks for reaching out to help

1 Like