Cookbook
Posted 2021, Updated on 10 Apr 2021

πŸ”΄ Why is my expression not working?

Biggest culprit: You are using ExtendScript for the Expression Engine, when it is supposed to be Javascript. Fix: Go to File> Project Settings > Expressions > change to Javascript. (This option is available on AE 2019 and later.)

Other reasons

  1. 1.
    You made a typo or used the wrong case when writing the variable or function names
  2. 2.
    You listed a single value into a parameters that takes an array
    • eg. myScale =5 will yield an error because the scale property is an array that takes 2 values.
    • The fix is
      • myScale = [5,5];
      • or myScale = 5; s = [myScale, myScale]
  3. 3.
    You forgot to put semicolons at the end of each line
  4. 4.
    You listed a variable as a string value
    • This is a string: "mytext"
    • This is a variable: var str = "mytext";
    • eg. in Apeel & Vucko tutorial, people alway list the variable as a string ('myVariable') when it should be just myVariable;
When to ask for help?
If you tried everything above, and nothing still works. There are two things you can do:
  1. 1.
    You can download the project files that I usually provide for free, and use my code I have there. As I am just a student, and do this on my own freewill. I do not have a lot of time and bandwidth to help people troubleshoot expressions. Hence, it's up to you to figure it on your own as much as possible.
  2. 2.
    If you have to ask me for help, what I appreciate is having more context and description of your problem. For example:
  • Which lines does the error occurred?
  • What does the error(s) say?
  • What have you tried?
  • Have you consulted this guide and tried the solutions I mentioned?
  • What AE version are you running, and what OS.
Sample format for requesting troubleshooting
Hello, I having problem with line number. The error says errorMessage . I have tried solution but I still cannot fix the issue.
What does not help me
  1. 1.
    Saying that "I wrote the code exactly" or I followed your tutorial. If you did, it would have worked. Clearly, the issue is something else and usually it's simply just a typo mistake.Hence, please give me more information about what the problem is so I can help you as quickly as possible.

More readings

Phyllotaxis

1
//theta
2
var myIndex = index - thisComp.layer("controls").index;
3
var a = 137.508
4
var theta = degreesToRadians(myIndex * a);
5
​
6
theta
7
​
8
//position
9
var myIndex = index - thisComp.layer("controls").index;
10
var s = thisComp.layer("controls").effect("Spacing")("Slider");
11
var theta = effect("theta")("Slider");
12
​
13
x = s * Math.sqrt(myIndex) * Math.cos(theta);
14
y = s * Math.sqrt(myIndex) * Math.sin(theta);
15
​
16
[x, y] + [thisComp.width, thisComp.height] / 2
17
​
18
// Circle Size
19
var theta = effect("theta")("Slider");
20
var minSize = thisComp.layer("controls").effect("Min Size")("Slider");
21
var maxSize = thisComp.layer("controls").effect("Max Size")("Slider");
22
var maxRange = thisComp.layer("controls").effect("Distance Range")("Slider");
23
​
24
var sizeFactor = linear(theta, 0, maxRange, minSize, maxSize) / 100;
25
var s = thisComp.layer("controls").effect("Size")("Slider");
26
[s, s] * sizeFactor;
27
​
28
// Fill Color
29
var theta = effect("theta")("Slider");
30
var interval = thisComp.layer("controls").effect("Color Interval")("Slider");
31
var numColor = thisComp.layer("colors")("Effects").numProperties;
32
​
33
var colorIndex = Math.ceil(theta / interval) % numColor + 1;
34
thisComp.layer("colors").effect(colorIndex)("Color")
35
​
36
​
Copied!

Best Motion Trails in After Effects

Wavey sine wave motion

1
// apply to X position after separating dimensions
2
var vel = effect("waveSpeed")("Slider")*Math.PI*2;
3
var amp = effect("waveHeight")("Slider");
4
var offset =Math.PI*2*degreesToRadians(effect("phase")("Angle"));
5
​
6
// main
7
var v = amp* Math.sin(time*vel+offset);
8
v + value;
Copied!

createPath Motion Trails

1
//setup
2
var l = effect("Layer Control")("Layer");
3
var dur = effect("trailLength")("Slider");
4
var pts = [];
5
​
6
// calculate the trail length in frame numbers
7
var currentFrame = timeToFrames(time);
8
var trailLength = currentFrame - dur;
9
​
10
// main: generate the points from the current time
11
​
12
for (i = currentFrame; i > trailLength; i--) {
13
t = framesToTime(i)
14
ap = l.toWorld(l.transform.anchorPoint, t);
15
ap -= [thisComp.width, thisComp.height] / 2;
16
pts.push(ap);
17
}
18
​
19
// create the path using the points
20
createPath(pts, [], [], 0)
Copied!

Scaling Radial Grid

1
ps = parent.transform.scale.value;
2
s = value[0]*100/ps[0];
3
[s,s]
Copied!

Aim Constraint

1
target = thisComp.layer("controls"); // set this to the layer to aim at
2
p = thisLayer.toWorld(anchorPoint) - target.position;
3
radiansToDegrees(Math.atan2(p[1], p[0])) - 90
Copied!

Cyberpunk tech lines

main
branch
1
// user variables
2
var pts = 50;
3
var pos = [0, 100];
4
var seed = 50;
5
​
6
// declaration
7
var x, y; // coordinates
8
var c, mul; // direction changer
9
var vertices = [[0, 0]]; // create first point
10
​
11
// vertices array
12
for (i = 1; i <= pts; i++) {
13
seedRandom(i + seed, true);
14
c = random(); // create random num between 0 to 1
15
c > 0.5 ? mul = 1 : mul = -1; // change direction
16
oldEle = vertices[i - 1]; // get previous vertice
17
​
18
y = random(pos[0], pos[1]);
19
x = y * mul;
20
​
21
// conditional: if even, go diagonal. If odd, go straight
22
if (i % 2 == 0) {
23
vertices[i] = oldEle + [x, y];
24
} else {
25
vertices[i] = oldEle + [0, y];
26
}
27
}
28
​
29
createPath(vertices, [], [], 0);
Copied!
1
// user variables
2
var pts = effect("pts")("Slider");
3
var pos = [effect("min_y")("Slider"), effect("max_y")("Slider")];
4
var seed = effect("seed")("Slider");
5
​
6
// get random point on first path
7
seedRandom(seed,true);
8
var myPath = content("main").path;
9
var myPathpts = myPath.points().length;
10
var myRandPt = Math.floor(random(myPathpts));
11
var mySelectedPt = myPath.points()[myRandPt];
12
​
13
// declaration
14
var x, y // coordinates
15
var c, mul // direction changer
16
var vertices = [mySelectedPt] // create first point
17
​
18
// vertices array
19
for (i = 1; i <= pts; i++) {
20
seedRandom(i + seed, true);
21
c = random(); // create random num between 0 to 1
22
c > 0.5 ? mul = 1 : mul = -1; // change direction
23
oldEle = vertices[i - 1] // get previous vertice
24
​
25
y = random(pos[0], pos[1]);
26
x = y * mul;
27
​
28
// conditional: if even, go diagonal. If odd, go straight
29
if (i % 2 == 0) {
30
vertices[i] = oldEle + [x, y];
31
} else {
32
vertices[i] = oldEle + [0, y];
33
}
34
}
35
​
36
createPath(vertices, [], [], 0);
Copied!

Radial Delay Rig

1
tgt = thisComp.layer("control");
2
// d = length(L.transform.position, transform.position);
3
d = length(thisLayer.toWorld(transform.anchorPoint), tgt.toWorld(tgt.transform.anchorPoint));
4
​
5
delay = thisComp.layer("control").effect("maxDelay")("Slider");
6
offset = linear(d,0,2000,0,delay);
7
time-offset;
Copied!

Buck Apeel Circle Ripple

Ensure you have the following
  1. 1.
    ring shape layer Slider Controls : size,copies, radius (anchorpoint-Y), myIndex
  2. 2.
    null layer named "controls" with Slider Controls : circle_size, circle_spacing, ring_base_size, ring_spacing, dur
  3. 3.
    null layer named "colors" with Color Controls x 3

Auto-copies

1
cir = 2*Math.PI *effect("radius")("Slider"); // circumference of circle
2
n = thisComp.layer("controls").effect("circle_spacing")("Slider"); // max size of a circle
3
Math.floor(cir/n) // round down the results
Copied!

Get myIndex

1
myIndex = index-thisComp.layer("controls").index-1;
Copied!

Auto-scaling radius

1
myIndex = effect("myIndex")("Slider");
2
c = thisComp.layer("controls");
3
int = c.effect("ring_spacing")("Slider");
4
base = c.effect("ring_base_size")("Slider");
5
​
6
s = myIndex*int;s+ base;
Copied!

Auto-alternate color

1
myIndex = effect("myIndex")("Slider");
2
num = myIndex %3+1;
3
thisComp.layer("color").effect(num)("Color")
Copied!

Stagger-animation - balls

1
myIndex = effect("myIndex")("Slider");
2
s = thisComp.layer("controls").effect("circle_size")("Slider");
3
dur = framesToTime(thisComp.layer("controls").effect("dur")("Slider"));
4
offset = myIndex*dur;
5
s.valueAtTime(time-offset)
Copied!

Matrix Binary Rain Code

1
seed = 10; // connect to slider
2
n = 50; // connect to slider
3
​
4
m = b = ''
5
​
6
for(i=0;i<n;i++){
7
seedRandom(seed+i,true);
8
b = Math.round(random());
9
m += b;
10
}
Copied!

Vucko β€” From Nothing to Something

Random flickering

1
// apply this to your Time Remap property of your Sprite render
2
seed = 20; // option:connect to a slider
3
segMin = .5; //minimum segment duration
4
segMax = .8; //maximum segment duration
5
flickerDurMin = 1;
6
flickerDurMax = 5;
7
​
8
end = 0;
9
j = 0;
10
​
11
while ( time >= end){
12
j += 1;
13
seedRandom(j,true);
14
start = end;
15
end += random(segMin,segMax);
16
}
17
flickerDur = random(flickerDurMin,flickerDurMax);
18
if (time > end - flickerDur){
19
seedRandom(j+69+seed,true);
20
random(outPoint);
21
}else{
22
seedRandom(j+seed,true);
23
random(outPoint);
24
}
25
​
26
// original expression from Dan Ebbert
Copied!

Falling leaves [1][2]

1
2
1
//position
2
yVelocity = 200; //pixels per second
3
oscFreq = 1.5; //oscillations per second
4
oscDepth = 35; //oscillation depth (pixels)
5
drift = 25; // drift (wind?) (pixels per second: - = left, + = right)
6
​
7
value + [oscDepth*Math.sin(oscFreq*Math.PI*2*time) + drift *time, yVelocity*time,0]
8
​
9
//Z ROTATION:
10
​
11
seedRandom(index,true);
12
random(360);
13
​
14
//Y ROTATION:
15
oscFreq = 1.5;
16
maxTilt = 15; //degrees
17
​
18
maxTilt*Math.cos(oscFreq*Math.PI*2*time)
Copied!
1
yVelocity = 200; //pixels per second
2
oscFreq = 1.5; //oscillations per second
3
oscDepth = 35; //oscillation depth (pixels)
4
drift = 25; // drift (wind?) (pixels per second: - = left, + = right)
5
floor=500; //position of floor from top
6
​
7
X=value[0] + oscDepth*Math.sin(oscFreq*Math.PI*2*time) + drift *time;
8
Y=easeIn(value[1]+yVelocity*time,value[1],floor)
9
Z=0;
10
​
11
[X,Y,Z]
Copied!

Techniques

Radial arrangement

Pixilation

  • Dot-Pixilation: CC Ball Actions
  • Square-Pixilation: Mosaic
  • Plugins: tv pixels,

Multi-image spriting / instancing

1
// Create a marker and use that to control the length of the comp you want instance
2
​
3
seedRandom(0,true);
4
m = thisComp.marker.nearestKey(time).time
5
random(0, m)
Copied!
​
Last modified 7mo ago