toUpperCase & toLowerCase Method in After Effects

In this post, I will go over the toUpperCase & toLowerCase Methods in After Effects. So without any further ado, let’s dive right in!

Alright, so we are in After Effects and for this example, I have a text layer in my composition called Main Text.

Main Text layer in After Effects Composition

The Main Text layer grabs the text from the name of my composition.

Grabs the name of my composition text After Effects

So whatever I title my composition, it will automatically change the text layer as well. For example, let’s change the title of my composition to something like one two three.

Change the title of my composition in After Effects

And as you can see, it does put that in my composition.

Composition Title Change to One Two Three in After Effects

Now if you notice, everything I typed in my composition title is lowercased.

Lowercased title in my composition in After Effects

But in my composition, the first letter of each word is uppercased and then everything else is lowercased.

Upper and lower cased titles in After Effects

The composition title is not case sensitive. This means that it does not matter what we type in our title composition. Our text layer will still automatically capitalize the first letter of each word.

Title Composition in not case sensitive in After Effects

Now let me show you how to set this up.

So for this example, I am going to go inside of the UKRAMEDIA.COM text layer, select the Source Text and then I am going to hit S twice on my keyboard to solo it.

Solo keyboard shortcut in After Effects

Solo Text Source in After Effects

Next, I will click on the stopwatch icon to create the expression.

Click on the stopwatch icon in After Effect to create an Expression

Then I am going to type the following inside of my white text box:

thisComp.name

What thisComp.name will do is it will basically grab the name of my composition.

Title composition in After Effects

As you may notice, the text in my composition looks kind of crazy but that is because the title of my composition was written kind of crazy.

Now I want to isolate just the first word. So I am going to keep going and I am going to say .split(” “) like so:

thisComp.name.split(” “)

In other words, it is going to split where there is a space. So it is going to give me an index of each word.

By the way, if you want to learn more about the split() method. go to ukramedia.com/tip37.

split() method in After Effects

So as you can see, it has split every word into each own index.

I will keep going with that and now I want the first word. So I am going to add index 0 to the end of my expression:

thisComp.name.split(” “)[0]

If I let go, it is going to give me the first word.

index in After Effects Expressions

Then I am going to keep going with that. I want the first character in that word, so I am going to say .charAt().

thisComp.name.split(” “)[0].charAt()

If I leave the charAt parentheses blank, it will give me the first letter of my first word by default.

First letter of my word charAt() in After Effects

By the way, if you want to learn more about the charAt() method, go to ukramedia.com/tip35

So I got exactly what I want but now I want to change my first letter from lowercase to uppercase. To do that, I am going to add on to my expression and say .toUpperCase().

thisComp.name.split(” “)[0].charAt().toUpperCase()

toUpperCase() After Effects

As you can see it does work quite well. Next, I am going to select thisComp.name.split(” “)[0] and then copy it.

select thisComp.name.split( )[0] and copy it in After Effects

Next, I will add + and paste the same thing like so:

thisComp.name.split(” “)[0].charAt().toUpperCase() + thisComp.name.split(” “)[0]

Copy and paste Expression in After Effects

Now watch what happens.

toUpperCase & toLowerCase Method in After Effects

So I have the first character and its uppercase and then it adds the rest of the word.

That is almost what I want but I want to get rid of this first character.

get rid of first character in After Effects

I want to keep the first letter and make it uppercase and then I want to add the rest of the word and make that lowercase.

So to do that I am going to say .substring() and inside of the .substring() parentheses, I am going to say start at index 1.

thisComp.name.split(” “)[0].charAt().toUpperCase() + thisComp.name.split(” “)[0].substring(1)

So 0 would be O but index 1 will be N.

Index in After Effects

Now I am going to say start at the second word, which is index 1 that happens to be N.

I want it to keep going and end on the last one.

thisComp.name.split(” “)[0].charAt().toUpperCase() + thisComp.name.split(” “)[0].substring(1, thisComp.name.split(” “)[0].length)

If I let go, it is giving me exactly what I want.

After Effects expressions
However, the second portion of it is still uppercased. To fix that I am going to add .toLowerCase() at the end.

thisComp.name.split(” “)[0].charAt().toUpperCase() + thisComp.name.split(” “)[0].substring(1, thisComp.name.split(” “)[0].length).toLowerCase()

toLowerCase() in After Effects

It is exactly what I want. Now I want to apply the same thing to all the other words.

To do that we are going to use For Loop and if you don’t know how to use For Loop Statements, you can check out tip number 42.

Alright, so let’s keep going. I am going to say n you are going to = an empty string:

n = “”;

then we will add a For Loop. I am going to say:

for() and then inside of the For Loop parenthesis, I am going to say for(i=0). Then i will be < and then I will paste this path thisComp.name.split(” “).length).

In other words, as long as i is less than all of my words. Then we will run that expression and then we will add i++, which means it will incrementally increase by one.  So our code should look like this by this point:

n=””;

for(i=0, i < thisComp.name.split(” “).length, i++)

thisComp.name.split(” “)[0].charAt().toUpperCase() + thisComp.name.split(” “)[0].substring(1, thisComp.name.split(” “)[0].length).toLowerCase()

 

Next, we are going to open a curly bracket and put our expression in there and close it with curly brackets.

n=””;

for(i=0, i < thisComp.name.split(” “).length, i++){

thisComp.name.split(” “)[0].charAt().toUpperCase() + thisComp.name.split(” “)[0].substring(1, thisComp.name.split(” “)[0].length).toLowerCase()

}

Also, we are going to add  n +=  in front of thisComp.name.split(” “)[0].charAt().toUpperCase() + thisComp.name.split(” “)[0].substring(1, thisComp.name.split(” “)[0].length).toLowerCase().

n=””;

for(i=0, i < thisComp.name.split(” “).length, i++){

n += thisComp.name.split(” “)[0].charAt().toUpperCase() + thisComp.name.split(” “)[0].substring(1, thisComp.name.split(” “)[0].length).toLowerCase()

}

Now watch what happens when I run it.

For Loop Statement In After Effects
As you can see it repeats the same word over and over but it kind of works. We are getting close.

By the way, we need to probably add some space between these words. To do that I am going to add + ” ” to the end of the expression like so.

n=””;

for(i=0, i < thisComp.name.split(” “).length, i++){

n += thisComp.name.split(” “)[0].charAt().toUpperCase() + thisComp.name.split(” “)[0].substring(1, thisComp.name.split(” “)[0].length).toLowerCase() + ” “

}

Add space in After Effects Expressions

So that’s working quite well. Now we need to set it up to where it grabs a different word each time instead of the same word over and over.

The fix is very simple. We need to change index o to index i because we do know that i start at 0 but then it changes with each loop. In fact, we need to change all of our indexes to i. We have a total of 3.

n=””;

for(i=0, i < thisComp.name.split(” “).length, i++){

n += thisComp.name.split(” “)[i].charAt().toUpperCase() + thisComp.name.split(” “)[i].substring(1, thisComp.name.split(” “)[i].length).toLowerCase() + ” “

}

So now if I let go you can see that everything is working quite well.

index i After Effects Expressions

I hope you found this post useful. If you would like to learn more about Expression and how it can speed up your workflow in After Effects, check out my Learn After Effects Expressions Course.

About the author:

Sergei Prokhnevskiy

Sergei Prokhnevskiy is a Charlotte, NC based motion graphics designer, an online tutor, an entrepreneur, and Adobe MAX Master Speaker. Sergei is known for his quick and practical After Effects tips and tricks on YouTube, where he generated well over 6 million views on his tutorials. He has authored an online video course on After Effects Expressions and developed scripts for After Effects. He is also a former senior motion graphics designer at Fox Sports where he worked on graphics for NFL, Super Bowl, MLB, World Series, College Football, NASCAR, Women’s World Cup, and NASCAR Race Hub. He is very passionate about learning and teaching others.

5 FREE TIME-SAVING TOOLS

Over 100,000 downloads & counting!

These 5 After Effects tools will seriously speed up your workflow and save you hours of wasted time. More than that, they could be the difference between being able to complete a project on time or not!