After Effects text layers rendered as single caracters

Hello,

When rendered into lottie files, text layers from After Effects are split up in single characters (every character becomes an SVG-element). There are no animators on the text and the issue happens with the lottiefiles and the bodymovin plugin. It also happens both to point text and paragraph text.

This adds to file size and the text cannot be modified by code dynamically.

Here is an example:
https://lottie.host/embed/3bc092af-6085-435b-85f2-1bfbd3aab97d/TsudIAoFSb.json

Thanks a lot for your help!

Hello, @Joh.

Did you try to uncheck in the bodymovin render settings option of converting fonts to shapes?

image

In my case, it’s a project with quite a lot of text. Converting it into shapes would make the file too big.

It seems to be a bug in the Lottie player (after lottie-web v5.8.1) for which someone proposed even a fix:

But I don’t know if it will be included in the next update. It doesn’t seem so…

It’s a pity! Better text handling would put Lottie to a whole new level!

Just let us know please did you try to UNCHECK the pointed option to avoid converting fonts to shapes or not. By default, it is set to a checked state.

Hello,

Yes, I unchecked the converting to shape option to create the example above.

And the text is rendered as SVG-Text. The problem is, though, that the text is not in a single tspan-tag, but every single character is in a text-tag. Here is the character “P”:

text stroke-linecap=“butt” stroke-linejoin=“round” stroke-miterlimit=“4” style=“display: inherit;” xml:space=“preserve” transform=“matrix(1,0,0,1,-433,-268.0003967285156)” opacity=“1”>P</text

This causes spacing issues between the characters, and it isn’t possible to modify text dynamically, as it was possible in the past.

Sam (SVGenius) who works at Lottiefiles now made a video tutorial “Dynamic Text And Font With Lottie Animations” in 2021

He shows how he creates text in AE, exports it with bodymovin and gets a Lottie file with text in a tspan tag that can be modified dynamically.
His Lottie file and the code is on codepen (link under the video)

I tried to reproduce the exact same file, but always got text split up in single characters.

Could anyone reproduce Sam’s example with current After Effects, Bodymovin and Lottie Player versions (January 2023)? That would be very interesting.

Thanks a lot!

same issue here
cannot get to export text from AE as a single element no matter the settings. it always comes out as separate letters