Uppercase to Lowercase text animation using expressions

[HarveyB_Yardi]

I have some text in a comp that I would like to morph from uppercase to lowercase per character/word over time using a slider control. I have managed to achieve the result in part, however all of the words are changing together rather than per character/word and I was wondering if there's a way to do this. Attached is a screen recording of the project

I have added the following expressions to the layer Source Text:
txtCase = effect("FontCase")("Slider").value;

txtColour = effect("Colour")("Color").value;

text.sourceText.style .setAllCaps(txtCase)

.setFillColor(txtColour)

Thanks very much for any tips

Harvey

[Mylenium]

Use two layers and text animators. You are making this way too complicated and it won't work, anyway. Text style expressions always affect the whole text. It's a limitation of the process.

Mylenium

[HarveyB_Yardi]

Hi Mylenium,

Thanks for your reply. I'm new to working with expressions so not familiar with their capabalities or limitations.

I did wonder if I was overcomplicating the solution, however I know there are no animation properties for in the text character panel and thought it would save time if there was one expression rather than adding lots of extra text layers to my comp.

Thanks again,

Harvey

[Airweb_AE · Accepted solution]

 

You can use source text expression and fill color text animator and 1 slider control to control the speed

Source text expression:

u = value.toUpperCase();
l = value.toLowerCase();
speed = effect("speed")(1);
l.substr(0, time * speed) + u.substr(time * speed, u.length)

Fill color text animator -> End:

speed = effect("speed")(1);
time * speed
//try one of these:
time * speed
Math.floor(time * speed)

Advanced -> Units -> set to Index

[HarveyB_Yardi]

Hi Airweb_AE,

Awesome thank you for the tip. That looks exactly like what I am trying to achieve. I will give this a try.

Harvey

[Dan Ebberts]

That's a nice solution. I would advise, in general, though, against using a local variable named "speed" because most properties (including End) already have a speed attribute. This conflict can lead to hard-to-debug, unexpected results.

[HarveyB_Yardi]

Hi Dan,

Thanks very much for your advice. That's good to know. I will try naming the variable something else.

Harvey

[HarveyB_Yardi]

Hi Airweb_AE,

Just added the expressions to my project and it works great. Thank you very much for the help. Alongside changing the  I wanted to keep the first letter of each sentence as Uppercase so altered the expression slightly. Here's what it looks like in case anyone else is trying to do the same.

Source text expression:

u = value.toUpperCase();
l = text.sourceText.split(" ")[0].charAt().toUpperCase() + substring(1, text.sourceText.split()[0].length).toLowerCase();

spd = effect("Velocity")(1);
l.substr(0, time * spd) + u.substr(time * spd, u.length)

Fill color text animator -> End:

spd = effect("Velocity")(1);
time * velocity
//try one of these:
time * spd
Math.floor(time * spd)

Advanced -> Units -> set to Index

[Airweb_AE]

Each sentence:

l = value.toLowerCase().charAt(0).toUpperCase() + value.toLowerCase().slice(1);

Each line:

l = value.split('\r').map(str => str.toLowerCase().charAt(0).toUpperCase() + str.toLowerCase().slice(1)).join('\r');

[HarveyB_Yardi]

Hi Airweb_AE,

Really sorry I missed this part of the conversation. Thank you very much for the additional advice. I will be sure to come back to this method in future.