After Effects Scripting for Absolute Beginners - ExtendScript Tutorial

welcome to the tutorial After Effects scripting for absolute beginners at the end of the tutorial you will be able to write a script that applies an expression to all the properties you have selected in After Effects but even better you will also have a good understanding of all the different aspects of scripting I will discuss all the concepts one by one so it come very clear how each part of the code works if you want to know a specific thing I'll put timestamps for all the things I cover in the description let's begin scripts for After Effects are essentially automated actions that are performed by After Effects so we command After Effects by telling you to do different actions everything that we normally do with our mouse and keyboard to interact with After Effects can also be done with scripting to command After Effects we need to speak its language which is unfortunately not English but extend script extend script is a variation of JavaScript so if you know JavaScript you'll come a long way in this tutorial I will assume that you don't know any JavaScript yet so I'll start really simple and build from there to write code and run it in after-effects we'll need a code editor you can download extend script toolkit CC from the Adobe website this is a special program that's created for creating code and then running it in the Adobe product so you can also make scripts for Photoshop etc so just go to this link I'll put a link on my website and my website a link in the description and then just go to extend ship toolkit CC and just download and Windows or Mac version so I'll put it on this website here you can click on the link here I also have other resources about variables functions and things we're gonna cover in a tutorial where so if you want to read more about it just go to that website and click on the links and read you'll learn a lot so now this is the code editor we are gonna code for other author effects so then you just click here and then select author effects and then click on this icon it may be read and then after fact isn't started yet so if you click on it it will automatically start after effects up and if we write code in here we can send this go to author effects and then we can test the code life so you can write code in air send it to officer fix by clicking on this green icon and see what happens so the first thing we're gonna cover is variables variables are very important and they store information that we use within our programs and we can manipulate these variables and it also provides a way of labeling data so we can read our program more easily a variable you create by typing far for variable and then the name of your variable I'm just gonna type my variable and then typing equals a variable to contain text you always need to use quotation marks so text that you want to display is always in quotation marks remember that so my text just put it in here and then with extend script we always end the line with a semicolon 1 semicolon not 2 so this is our first line of code and we declare a variable by typing 4 and then the name of the variable equals and then your text variable can contain text it can contain numbers it can contain a boolean a boolean is just I'm true or its false so that's the boolean you can also contain a list of items but I'll go into that later so for now we're just gonna use my my variable text now if you want to just quickly test this in after-effects we can write alert alerts creates a pop-up and after-effects and you can input the text you want to pop up to display within these two parentheses so we just type my variable so this now points to this variable and this variable contains this text so what we actually do is we send this text width into this alert function and now when we run it look after effects and we put the code into After Effects and this is what we get out of it my computer is lagging my er variable text so now you we just change we change this variable click on one again we change the text and we rename variables mostly by using camel case camel case means that the first letter of the variable is a small letter and then instead of spaces you can have spaces in your variable names so instead of spaces we just use capital letter so my variable is who would be like this without spaces but capitalizing the first letter of each word so that's camel case and I recommend to use that so when you see like this you like know it's a variable because the first letter is small and the next letters are capital so for naming variables there are a couple conventions you can't use dashes or something you can't begin with a number you can't have spaces so you can just like this and then space it's case sensitive it has to be unique yeah that's about it so remember that next functions the best example I can give you a function is this so alert was a function that we used functions are also kind of like variables they don't contain like text or numbers but they contain actions so actions you want something you want to perform so functions you can call on them and then they just do the actions that are in the functions you can type a function by typing function no Sherlock and then typing the name of the function just just like the variable then typing these parentheses and then two curly brackets now the thing we want to function to do we can put inside these curly brackets so if we want to put this function within my new function we can just do it like that and now whenever we call my function like this we run the code that is within this function so we run this alert code so we can type my function like four times and run this code and we'll get four pop-ups so that's great if you want to spam people with your plugin so we can do a lot of things with functions you can make generic caller conversions for example where a function just has color conversion logics inside of it if you want to do a color conversion you of course need to know what color you're gonna convert so a function can also have parameters parameters you input within these two parenthesis if we now have color value for example so now we can use this color value to do different things so we can now also just do an alert because that's easy and then just input the color value in here and now when we call this function we can use my function and then we can input a color value so whites for example and then we can use that color value within the function now we just use it to print again so we'll run this we'll print our color value but you can do a lot of different things with function function can also return stuff so if we want to create a new function that's we're just going to name calc for calculation and then we're just gonna return 5 plus 6 most difficult calculation ever and now when we input this calc function within our new function so what well now will happen is we call on this function and the color value will will be this function and this function is gonna run and it's gonna return 11 so it will be actually just to be 11 in here but we don't type 11 we just type our function so what we're gonna do is you're gonna just print 11 on the screen like that so that's functions now let's move on to some cooler stuff and we're gonna actually do manipulate objects within After Effects and actually do useful things because this you can't really do useful things with this but you need to know it if you want to program anything in extend scripts JavaScript and extend script or both object-oriented languages which means that they revolve around using different objects to perform actions extend script objects contain attributes and methods these are things that we can use to manipulate the object to do certain things attribute are things that object has and methods or actions that object can do I will use a circle object as an example the attributes of a circle object can for example we color and diameter methods for a circle object can be bounce or transform we can use these by typing or object name and using and thoughts and then calling on these attributes and methods to manipulate them for example circle dot color equals an N a color code which would set the circle color to green a more practical example would be the application objects from After Effects this object contains a lot of attributes version settings project memory news is watch folder is render engine effects disable rendering build number build name available GPU axle types an active viewer the different methods for the application object are activate begin suppress dialogues begin undo group cancel task well a lot of them artifacts is completely divided into objects so you can tell the program how to work the diagram shows the object structure of After Effects here you can see that application contains a project the project can contain items by referencing these items in our code we can manipulate them to dive deeper and all the objects that you can use in author effects you can read the documentation this contains all the definition of the object attributes and methods you can also use the data browser in a sense toolkit to explore the objects so the goal or script is going to be to select an ik property and put an expression on it but to put an expression on a property we first need to know what property I have selected so do we have a positions like to do with a skill selected to get the current properties that are selected we can use the object structure to get the selected properties do this by typing app dot project dot active item so we go into the app we go into the project we go into the active item with which means the current composition that we have selected so this we have this composition select so that's the current active item and then we do selected properties so now this selected variable has the selected properties that we have selected in After Effects but we can act we can select multiple properties in After Effects so this returns an array so I'm first going to explain to you what an array is so an array is a variable type and it can contain multiple values you create an array by using these square brackets and typing values within these square brackets so value 0 and then comma for the next value value 1 comma value 2 now I'm just inputting a normal number in here you can input anything you want in there input a boom into that we talked about and then just input hello world because you know this is tutorial it needs how the world in there you know to access one of these things we type the array name so our our variable name is array and then we again type these square brackets and then we type the ID of the element that we want and the ID start at 0 this so this has ID 0 this has ID 1 this has added to this has ID 3 in this has ID 4 so you always need to remember that it starts at 0 because the second element actually has an ID of 1 so the second element is 1 but it's the second element so the third element actually has an idea of to the 4th of 3 so now we have just select this one so if we want to select the property that we currently have selected in the selected properties we just type selected and then the square brackets again and then 0 so we select the first property that we have selected now we can do things with this property we can see what the value is so let's do that and we're just going to alert the value on the screen of our selected property so now go into After Effects I'm just gonna select the property opacity and then run this code now we have a script alert 100 because our opacity in here is 100 now we can also change the opacity value my computer is lagging because I'm running stuff we do that by typing set value which is a function and we set the value by typing something the value in here so now we're just gonna set the value of our current selected property to 30 run the script or passively gonna go and go to 30 so now our pasady is 30 so now we can manipulate these things and our script is gonna manipulate the expressions you can just type dot and expression and then just type anything we want our expression to be for example loop out look if we still have that passively selected so we're gonna put a loop out on this opacity and we're just gonna make it flash so we have the opacity selected now let's go back run this and look it now has an expression set on it and it's loop out another way we can utilize the after-effects object structure is by setting an undo group we do that by typing app dot begin and do group now you need to type a name of this undo group I'm just gonna type in my script action and then we also need to end the undo group app dot and and do I recommend you do this for every for every big action that your strip does because now when a user control sets you just undo all the things that are within this undo group so if you run this code now for example on the rotation if you run this code bow there's an ngon expression on the rotation as you can see loop out expression and here when we see edit we can undo the mice at my script action undo that now the rotation doesn't have it anymore I recommend you do that for all the big actions you create in your scripts so what happens right now in our code is we get all the selected properties and then we put an expression on the first one but what happens if we don't select any property so we don't have any property selected right now what if you run it it's gonna get an error and it's gonna say down here undefined it's not an object stop our code by clicking on here so what happens is our selected properties return undefined so then they selected here this variable is going to be undefined and we try to set an expression on undefined and against an expression or nothing so it just returns an error so how do we prevent this we use an if statement so with an if statement we can check something so we type if and then these parentheses and within these parentheses we can type in condition we can check something and if that something is true we can run the code that's within these curly brackets so for example I'm just gonna alert a message and in here I'm also just gonna create a new variable quickly my number is equal to 10 and I'm gonna check is my number is bigger than 10 or equal to I'm just gonna check this if my number is bigger than or equal to 10 it's gonna alert this message so if I run this code now it will get an error because and this returns an error so just a quick tip if you double slash before a line of code you comment it out and after effects just skips this code so we just skip this code now we only run this when we run it we get a message we get the message with message in it because 10 my number is 10 and that is equal to 10 so this will return true if it's now if we make it smaller 5 and we run it it's got not gonna do anything after fact it didn't do anything it's not gonna do anything because this if this statement here returns false so we're just gonna skip this whole code we can catch that by typing an else here and we say if that is false so if this statement is false then we do code that's within these curly brackets we activate this code so now it's false now we actually get a message to buy thing so that works and it's alright we also can use an else if so we also can extend this if statement by also typing another condition by making another condition and checking another another statement we're gonna also check if my number is equal to 100 so if my number is bigger than I'm gonna check it in my numbers equal to 6 my number is bigger than or equal to 10 it's gonna have this message my number is equal to 6 it's gonna have a 6 and else it's just gonna do I'm just gonna say else so my number is now 5 so this will return false this will also return false because my number is not equal to 6 so it's just gonna return else as you can see if you want to compare two numbers we don't use one equal sign we use to because if we do 1 equal sign it just it's gonna act like a variable so it's gonna say my number is now the value 6 but we don't we don't want that going to compare it so that's why we use two equal signs here we also can do is have an exclamation mark this means if my number is not equal to 6 so we can do that and now 5 will this will return true so this will activate and then what alert is not 6 because it's not 6 we now make it 6 again this will return false this will return false so it will be it will say else so one last thing I want to show you one last thing I want to show you with it if L statements you can also extend this statement by typing an N to n like this and then you can have another statement in here is equal to nine so now what you're going to check if this is true and this is true so if both are true then we alert this then we do these actions you can also have these two lines down and that means if this is true or this is true so this is an or operator and this is an end operator so you can also use that in your if statements now back to our code if you want to check if the selected variable has any properties we can write if selected and because this is an array we can use the dot length and with an array dot length returns the length of that array so the amount of items it contains so if this if we have three things selected this will become three if we have nothing selected this will return this will be nothing so we can check if length is zero so we don't have anything selected we can just alert to the user please select the property please select a property else we can activate this code and set a loop out so if we run this right now it's gonna say please select the property and if we then actually select the property you're near actually select rotation go back and run the code it actually sets an expression on rotation as you can see rotation now has the loop out expression then we can controls at it because we made an undo group so that's awesome so now we check if the selected property is not know if it's not now we can set an expression but what if we have multiple property selected now we only get set the expression on property 0 so what we then need to do needs a loop through all the different properties that are in that array and when you do that by using a for loop so to write a for loop you just write 4 and then these parentheses and then these curly brackets within these and then within these parentheses we're gonna write 3 statements first I'm gonna write I is 0 we need to so far I we need to make a variable um I call it I for index and set it to 0 this is the variable that starts so if the for loops get called as first this will run then we need to check for every loop we do we need to check do I still want this loop to run are we at the end of the loop or do I still need to continue so I check that by checking if I is lower then select the dot length so now every time we loop we check is I already bigger than all the properties the length of our array if it's already bigger than the length of our array there are no properties left so we can just quit if it's still bigger if it's still not big enough so it's still smaller than the length we can we have another property left so we can set another expression and then we type I plus plus and this just means actually I is I is equal to I plus 1 so this I plus plus actually means this so it just adds 1 to the I variable now what we do now we have so first we start the for loop we set an I property then every time we run the loop we check is it still smaller than the length of all our properties and if it's still smaller we run this code and at the end we add 1 to the I so now we loop through that whole selected and array so now we type selected and here we we put the I inside these square brackets and then we just put this in here like that and now we what we do is we loop through all the selected properties and then we put a loop out expression on there so now if we also remove the expression from this one just gonna remove that and we're gonna put it on position scale and opacity just on all these select all these go back and run this code it ran and look now there's a loop out expression on all of these property so now we loop through all of them now we can set the loop out expression our selected properties but what if we don't want to use the loop out expression but we want just to give the user the ability to type in any expression any once we need a UI for that in this tutorial I'm not gonna go in-depth into how to build a UI so you can just go to the page I licked in the description and copy this code over here this is a piece of code that just creates the UI for us in another tutorial I'll dive deeper and how to actually create a UI but for now this will have to do so just paste it in here now we have this function and that creates an expression panel so a UI panel and now I'm also gonna put this in a function so just gonna create a new function and expression and then curly brackets with our all our code that we created within that that expression function indent it right so it's more readable and now we're gonna edit this so we can actually put in something and then we we get the value so we get the text that our user put in so here we create an expression panel and talked over here we need to create a couple of variables so we need to create an apply button so the button that and we click to apply the expression and an input expression keresh in but as you can see over here we already have those variables so I create a variable here and then here I set the variable and I set it to an edit text with 25 characters now we just need to call this expression panel at the top of our we also need to add this piece of code so we need to wrap all our code in in this function in this general function which returns this object and that's just actually our app object like this and like this time position here so now we can give this object into that expression panel because we need it in here to create the panel so now when we run this it will actually create this panel and on the button we apply an on click event and that unclick event actually fires off this expression so the onclick event fires off the ad expression what we now still need to do is over here when we click on the button it will still put our our expressions on loop out we actually want the to get the text from this expression input and we do that by typing expression input dot text so we get the text from this expression input now when we run this I hope everything is alright yes we have this panel over here as you can see now it's set on loop out we can change it we can for now I'm just gonna undo what we just did select opacity click on apply and look we apply an expression on this one if we want to change this to loop in light over there we can apply to loop in expression so we can so select multiple expressions and apply to multiple expression so we can just type an expression in here and apply it on a lot of different properties so that's it now we have an working piece of code now that the code is tested and it works we can input it in after effects so now that so that when the next time we started up it will just be in here in the window you can just select it from there so to do that I'm just going to close this not safe I'm gonna save this file for now I'm just gonna save it on the desktop and how you name this file that's also the name that will show up in the drop down in After Effects so I'm just gonna name it Express Express script 1 save it now I'm gonna close this and here we have our expression script now I'm gonna go to this PC go to the place where you have installed your for me it's in Program Files over here and then Adobe and then go to After Effects support files and then go to scripts script UI panels now put your code in here continue move our expression script on into there now close this one start up After Effects and now we can just open our script from within After Effects and use it and then you have built your first script congratulations so still a few tips and if you're debugging if you're controlling your application if you're checking if everything is working use a lot of alerts within your code so that you can go through it one by one and alert what happens so you know where the code is going which if statements it's using how many times it's looping and so forth that's really handy you can also use comments that I showed you with the double forward slash to just describe what you're doing just to say here I'm looping through the function here I'm doing this here I'm doing that it doesn't help the code but it helps you understand the code when you open it up and in a later date then when you're opening up three months later you forgot showed me what your written and it's nice when you still have those common they're to know and to quickly grasp what you did actually I also try to use descriptive variable names it makes it way easier to read it in the future and also I link a couple of helpful sites on my site so you can go through there go read the documentation and figure it out on your own and just try different things and and set a goal for yourself I want to do this with a script and try to make it a reality and probably you come across a lot of problems and you will fix all of those then in the end you will have a great script like this one maybe something that's even better accustomed to what you want just gonna open this one now here we can scroll down and have our expression script open it and here we have it our expression script now we can have it open we can just select things we can select the transform opacity and apply and it works it has expression so thank you for watching see you in the next tutorial

Channel: Code and Motion

Views: 15,904

Keywords: after effects scripting for absolute beginners, after effects scripting guide 2019, after effects scripting guide, after effects scripting tutorial, adobe after effects scripting tutorial, Scripting for after effects, Scripting for motion graphics, getting started with scripting in after effects, scripting in after effects, extendscript tutorial, Extendscript basics, code in motion

Id: UutXfHp9KDg

Length: 35min 48sec (2148 seconds)

Published: Sun Oct 13 2019