#️⃣Expression Codes

Почему стоит использовать выражения?

Экономия времени и быстрое создание анимаций. Выражения позволяют автоматизировать действия (например, покачивание, дрожание или отскок). Это существенно экономит время, благодаря отсутствию необходимости создавать новые ключевые кадры для каждого действия. Вот несколько примеров, которые помогут приступить к работе.

Связывание разных свойств.

Выражения можно использовать для связывания разных свойств, таких как «Положение» и «Поворот», в нескольких композициях. Функция связывания помогает создавать анимации без прописывания разных выражений для каждой из них.

Создание инфографиков движения.

Выражения можно использовать при создании шаблонов анимационного дизайна. After Effects позволяет регулировать разные свойства, выполнять привязку анимаций и изменять файлы .mogrt.

Создание сложных анимаций с помощью управления несколькими слоями.

Инструмент «Лассо» позволяет с легкостью регулировать несколько анимаций с помощью минимального количества элементов управления. Применяя его, можно с легкостью создавать анимации, которые потребовали бы намного больших усилий при использовании других средств.

Создание анимированных графиков и диаграмм.

Быстро создавайте анимированные инфографики и инфографики движения, например, динамическую карту мира и динамические гистограммы индекса загрязнения разных стран.

Сохранение и повторное использование выражений.

Сохраняйте выражения как шаблоны для использования в других проектах After Effects. Вам не придется несколько раз делать одно и то же!

Интерфейс выражений

Перед тем, как приступить к использованию выражений, следует ознакомиться с пользовательским интерфейсом. Для начала выполните следующие шаги:

1. Создайте композицию и выберите Слой > Новый > Сплошной для создания сплошного слоя.

2. Выберите слой на таймлайне и нажмите S на клавиатуре, чтобы отобразить свойство «Масштаб». Теперь все готово для начала работы с выражениями.

   
3. Давайте создадим выражение. Чтобы добавить выражение к свойству, откройте таймлайн и щелкните мышкой секундомер рядом с элементом «Положение» при нажатой клавише Alt (Win) или Opt (Mac). After Effects присваивает всем свойствам стандартные выражения, которые позднее можно изменить.

4. Обратите внимание на то, как изменился пользовательский интерфейс после создания выражения. Во-первых, значение свойства «Масштаб» (показано как «100,100») становится красным вместо синего. Красный цвет указывает на то, что для значения активно выражение.

   
5. Обратите внимание, что слева от секундомера появился символ раскрытия. Нажмите на него. Это позволит открыть само выражение.

   • Первая кнопка выглядит как знак равенства (=). Она включает и выключает выражение. Когда выражение включено, она синего цвета.

   • Вторая кнопка переключает в редакторе диаграмм показ значения с течением времени.

   • Третья кнопка с маленькой завитушкой используется для вызова инструмента «Лассо», который можно использовать при создании выражений.

   • Четвертая кнопка открывает меню языка выражений, которое можно использовать при создании выражений.

   
6. Наконец, справа от четырех кнопок отображается параметр transform.position выражения по умолчанию. Для изменения выражения щелкните его текст на таймлайне, чтобы активировать поле редактора выражений. Оно поддерживает те же функции, что и любое другое текстовое поле, например, копирование, вставку, выбор и перетаскивание текста. При нажатии на клавишу ввода создается новая строка, высоту которой можно изменить. Нажмите на нее и введите нужное выражение, например wiggle(3,50). Дополнительные сведения см. в разделе Управление выражениями.

   

Выражения и ключевые кадры

После добавления выражения к свойству можно продолжить добавлять или изменять ключевые кадры свойства. Выражение может принимать значение свойства, как это определено соответствующим ключевым кадром, и использовать эти входные данные для создания новых, измененных значений. Например, выражение value+90 свойства «Поворот» конкретного слоя добавляет 90 градусов к значению свойства «Поворот» в дополнение к движению по ключевым кадрам:

Некоторые методы, такие как покачивание, работают непосредственно с текущим значением свойства. (См. раздел Атрибуты и методы свойства (справочник по выражениям).)

Выражение wiggle(10, 10) свойства слоя «Положение» сохраняет движение по ключевым кадрам слоя, что приводит к его незначительному покачиванию.

Выражения:

Text Expression

// Text Expression part 1
freq = 1.5;
decay = 15;
duration = 0.18;
retard = textIndex*thisComp.frameDuration*1;
t = time - (inPoint + retard);
startVal = [100,100,100];
endVal = [0,0,0];
if (t < duration){
linear(t,0,duration,startVal,endVal);
}else{
amp = (endVal - startVal)/duration;
w = freq*Math.PI*2;
endVal + amp*(Math.sin((t-duration)*w)/Math.exp(decay*(t-duration))/w);
}

// Text Expression part 2
freq = 1;
decay = 8;
duration = 0.25;
retard = textIndex*thisComp.frameDuration*1;
t = time - (inPoint + retard);
startVal = [100,100,100];
endVal = [0,0,0];
if (t < duration){
linear(t,0,duration,startVal,endVal);
}else{
amp = (endVal - startVal)/duration;
w = freq*Math.PI*2;
endVal + amp*(Math.sin((t-duration)*w)/Math.exp(decay*(t-duration))/w);
}

text bounce code

// text bounce code
delay = .05;
myDelay = delay*textIndex;
t = (time - inPoint) - myDelay;
if (t >= 0){
  freq =2;
  amplitude = 80;
  decay = 8.0;
  s = amplitude*Math.cos(freq*t*2*Math.PI)/Math.exp(decay*t);
  [s,s]
}else{
  value
}

text bounce 2

// text bounce 2
swings=1;
timeOffset=0.5;
v=valueAtTime(time-timeOffset*textIndex/textTotal)[0];
anim=2*Math.PI*v/100;
amp=easeOut(v,0,100,100,0);
Math.cos(anim*swings)*amp;

shake

// shake
n = 0;
if (numKeys > 0){
n = nearestKey(time).index;
if (key(n).time > time){
n--;
}
}
if (n == 0){
t = 0;
}else{
t = time - key(n).time;
}
 
if (n > 0){
v = velocityAtTime(key(n).time - thisComp.frameDuration/10);
amp = .1;
freq =3.1;
decay = 7;
value + v*amp*Math.sin(freq*t*2*Math.PI)/Math.exp(decay*t);
}else{
value;
}

impact shake

// impact shake
n = 0;
if (numKeys > 0){
n = nearestKey(time).index;
if (key(n).time > time){
n--;
}
}
if (n == 0){
t = 0;
}else{
t = time - key(n).time;
}

if (n > 0 && t < 1){
v = velocityAtTime(key(n).time - thisComp.frameDuration/10);
amp = .05;
freq = 4.0;
decay = 8.0;
value + v*amp*Math.sin(freq*t*2*Math.PI)/Math.exp(decay*t);
}else{
value;
}

hddr

// hddr
n = 0;
if (numKeys > 0){
n = nearestKey(time).index;
if (key(n).time > time){
n--;
}
}
if (n == 0){
t = 0;
}else{
t = time - key(n).time;
}
 
if (n > 0 && t < 1){
v = velocityAtTime(key(n).time - thisComp.frameDuration/10);
amp = .04;
freq = 2.0;
decay = 9.0;
value + v*amp*Math.sin(freq*t*2*Math.PI)/Math.exp(decay*t);
}else{
value;
}

Gradient Controlled

// gradient controlled
sourceLayer = thisComp.layer("Transition Control 2");
sampleSize = [1,1];
samplePoint = transform.position;
colour= sourceLayer.sampleImage(samplePoint,sampleSize);
x=colour[0]*100;
[x,x]

Expression values

// expression values
n = 0;
if (numKeys  0){
n = nearestKey(time).index;
if (key(n).time  time){
n--;
}
}
if (n == 0){
t = 0;
}else{
t = time - key(n).time;
}
 
if (n  0){
v = velocityAtTime(key(n).time - thisComp.frameDuration10);
amp = .1;
freq =3.1;
decay = 7;
value + vampMath.sin(freqt2Math.PI)Math.exp(decayt);
}else{
value;
}

Expression Shake

// Expression Shake
Expression Shakes
Slider Control
Amplitude: 3.0
Frequency: 2.5
Decay: 5
Expression:
n = 0;
if (numKeys > 0){
n = nearestKey(time).index;
if (key(n).time > time){
n--;
}
}
if (n == 0){
t = 0;
}else{
t = time - key(n).time;
}

if (n > 0){
v = velocityAtTime(key(n).time - thisComp.frameDuration/10);
amp = (effect("Amplitude")("Slider"))/100;
freq = effect("Frequency")("Slider");
decay = effect("Decay")("Slider");
value + v*amp*Math.sin(freq*t*2*Math.PI)/Math.exp(decay*t);
}else{
value;
}

DISCORD

// DISCORD
n = 0;
if (numKeys > 0){
n = nearestKey(time).index;
if (key(n).time > time){
n--;
}
}
if (n == 0){
t = 0;
}else{
t = time - key(n).time;
}

if (n > 0){
v = velocityAtTime(key(n).time - thisComp.frameDuration/10);
amp = effect("Position amplitude")("Slider");
freq = effect("Position frequency")("Slider");
decay = effect("Position decay")("Slider");
value + vampMath.sin(freqt2Math.PI)/Math.exp(decayt);
}else{
value;
}

da_expression

// da_expression
n=0;
if (numKeys > 0 ) {
n = nearestKey(time) .index;
if (key(n) .time > time ){
n--;
}
}
if (n == 0 ){
t = 0;
}else {
t = time - key(n) .time;
}
if (n > 0 && t < 1){
v = velocityAtTime (key(n) .time - thisComp.frameDuration/10);
amp = .04;
freq = 4.0;
decay = 10.0;
value + v*amp*Math.sin
(freq*t*2*Math.PI)/Math.exp(decay*t);
}else{
value;
}

Comma Numbers

// comma numbers
var num = effect("Slider Control")("Slider")
num = Comma(num);
[num]

function Comma(number)
{
number = '' + Math.round(number);
if (number.length > 3)
{
var mod = number.length % 3;
var output = (mod > 0 ? (number.substring(0,mod)) : '');
for (i=0 ; i < Math.floor(number.length / 3); i++)
{
if ((mod == 0) && (i == 0))
output += number.substring(mod+ 3 * i, mod + 3 * i + 3);
else
output+= ',' + number.substring(mod + 3 * i, mod + 3 * i + 3);
}
return (output);
}
else return number;
}

bounce shake

// bounce_shake
n = 0;
if (numKeys > 0){
n = nearestKey(time).index;
if (key(n).time > time){
n--;
}
}
if (n == 0){
t = 0;
}else{
t = time - key(n).time;
}

if (n > 0 && t < 1){
v = velocityAtTime(key(n).time - thisComp.frameDuration/10);
amp = .05;
freq = 4.0;
decay = 8.0;
value + v*amp*Math.sin(freq*t*2*Math.PI)/Math.exp(decay*t);
}else{
value;

}

bounce thing

// bounce thing
freq = 5;
decay = 7;

n = 0;
if (numKeys > 0){
  n = nearestKey(time).index;
  if (key(n).time > time) n--;
}
if (n > 0){
  t = time - key(n).time;
  amp = velocityAtTime(key(n).time - .001);
  w = freq*Math.PI*2;
  value + amp*(Math.sin(t*w)/Math.exp(decay*t)/w);
}else
  value

Avoid opacity fade

//avoid opacity fade
Math.round(value)

Automatic Fade In - Out

// Automatic Fade In - Out
fadeDuration = .5;
fadeIn = linear(time,inPoint,inPoint + fadeDuration, 0, 100);
fadeOut = linear(time,outPoint - .5, outPoint,0,100);
fadeIn-fadeOut

Ae_Mograch

//AE expressions for mograph
//Useful After Effects Expressions
//From this tutorial:
//https://www.youtube.com/watch?v=rsW4fwscwKI&feature=youtu.be

//1. Maintain stroke width
value / length(toComp([0,0]), toComp([0.7071,0.7071])) || 0.001;

//Via Adam Plouff
//https://battleaxe.tumblr.com/post/101945073972/maintain-stroke-weight-expression 

//2. Maintain scale when parented
s = [];
ps = parent.transform.scale.value;
for (i = 0; i < ps.length; i++){
s[i] = value[i]*100/ps[i];
}
s

//Via JR Canest’s handy spreadsheet
//https://docs.google.com/spreadsheets/d/1a3ArTUHAJwVi-ObZofvz6IfrKbSGSENlaTIRTs8pAJU/edit?pageId=116871612094468624414#gid=0

//3.Time 
Time 
Or maybe
Time*50
Just time, nothing ticky

//4. 
+value

//5.
 *-1
 
//6. Posterize Time
posterizeTime(1);

//7. LoopOut
loopOut(type = “cycle”, numKeyframes = 0)
loopOut(type = “pingpong”, numKeyframes = 0)
loopOut(type = “offset”, numKeyframes = 0)
//You don’t need to include “numKeyframes = 0”
loopOut(type = “cycle”) will work too :)

//8. Reference Another Comp
comp(“COMP_NAME”).layer(“LAYER_NAME”).
//To reference the source test from the example in the video
comp(“COMP_NAME”).layer(“LAYER_NAME”).text.sourceText

//9. Wiggle
wiggle(freq,amp);
E.g.
wiggle(1,50);

//10. 
math.floor()

Text Animation

// Text Animation
delay = .09
;
myDelay = delay*textIndex;
t = (time - inPoint) - myDelay;
if (t >= 0){
  freq =1;
  amplitude = 200;
  decay = 5.0;
  s = amplitude*Math.cos(freq*t*2*Math.PI)/Math.exp(decay*t);
  [s,s]
}else{
  value
}
// wiki.meshalkin.art