표현식 언어 이해

After Effects 표현식 언어는 JavaScript를 기반으로 확장된 기본 제공 개체 세트를 제공합니다. After Effects는 특정 웹 브라우저 전용 확장이 아닌, 핵심 표준 JavaScript 언어를 사용하며, 레이어, 컴포지션, 푸티지, 카메라 등 고유한 확장 개체 세트를 포함합니다.

표현식 언어는 스크립팅 언어를 기반으로 하지만, 스크립트와 표현식 간에는 약간의 차이가 있습니다. 애플리케이션에 어떤 작업을 수행하도록 지시하는 스크립트와 달리 표현식은 속성에 작업을 지시합니다.

표현식을 만들 때는 다음 사항에 유의하십시오.

• 표현식의 값은 마지막으로 계산된 문의 값입니다. 이것은 일반적으로 표현식의 마지막 줄입니다. 가장 단순한 형식의 표현식은 계산 순서를 기준으로 표현식에서 호출한 마지막 변수 또는 함수를 사용하여 값을 도출합니다. 그러나 그 외에도 반환 값으로 명시적으로 참조할 수 있는 값이라면 무엇이든 될 수 있습니다. 이는 표현식에서 훨씬 이전에 디버깅 목적으로 사용한 값이나, 명시적으로 선언한 함수나 변수 외의 값을 포함할 수 있습니다. 이런 값의 경우 작성 순서대로 처리되지 않습니다.

• JavaScript는 대소문자를 구분하는 언어입니다.

• 함수는 표현식의 맨 밑에서 선언할 수 없습니다.

JavaScript에서는 개체에 저장된 값을 속성이라고 합니다. 그러나 After Effects에서 속성이라는 단어는 타임라인 패널에 정의된 레이어 구성 요소를 의미합니다. 따라서 After Effects에서는 JavaScript 속성을 메서드 또는 특성이라고 부릅니다. 일반적으로 메서드와 특성 간의 차이점은 메서드는 주로 특정 작업을 수행하여 출력(반환) 값을 생성하는 반면, 특성은 단지 기존 값을 참조하여 출력(반환) 값을 결정한다는 것입니다. 메서드의 경우 메서드 이름 뒤에 입력 인수를 감싸는 괄호가 사용되므로 괄호가 있는지 확인하면 메서드와 속성을 쉽게 구별할 수 있습니다.

개체는 다른 개체, 특성 및 메서드를 포함할 수 있는 항목입니다. 컴포지션, 레이어 및 푸티지 항목 등이 개체에 해당합니다. 특히 컴포지션, 레이어 및 푸티지 항목은 전역 개체입니다. 따라서 더 높은 레벨의 개체를 참조하지 않아도 모든 컨텍스트에서 참조될 수 있습니다.

특성 및 메서드 액세스

표현식 언어를 사용하여 레이어 속성의 특성 및 메서드에 액세스합니다. 값에 액세스하려면 마침표() 연산자로 분리된 개체 참조의 체인을 사용합니다. 레이어 레벨을 넘어 개체 참조를 체인으로 연결하려는 경우(예: 효과 속성, 마스크 또는 텍스트 애니메이터 참조) 괄호도 사용할 수 있습니다. 예를 들어 Layer A의 불투명도 속성을 Layer B에 적용된 가우시안 흐림 효과의 흐림 속성에 연결하려면 Layer A의 불투명도 속성 표현식 필드에 다음 표현식을 입력합니다.

이 표현식을 왼쪽에서 오른쪽으로 읽으면 개체를 포함하는 높은 레벨에서 시작하여 특정 속성으로 내려가는 것을 알 수 있습니다.

• thisComp: 사용된 전역 개체는 현재 컴포지션을 참조합니다.

• layer("Layer B"): 컴포지션 내의 특정 레이어 개체는 이름으로 참조됩니다.

• effect("Gaussian Blur"): 레이어 내의 특정 효과 개체는 이름으로 참조됩니다.

• ("Blurriness"): 효과 내의 특정 효과 속성은 이름으로 참조됩니다.

효과 조절점의 y 구성 요소와 같은 다차원 속성의 n번째 구성 요소의 경우 다음과 같이 끝에 [n]을 추가합니다.

표현식의 기본 개체는 표현식이 작성된 속성이고 기본 개체 뒤에는 해당 표현식을 포함하는 레이어가 오므로 속성을 지정할 필요는 없습니다. 예를 들어 레이어의 위치 속성에 대해 작성한 wiggle 표현식은 다음 둘 중 하나일 수 있습니다.

표현식이 작성된 레이어 및 속성 외부에서 레이어와 속성을 검색하는 경우 해당 레이어와 속성을 포함해야 합니다. 예를 들어 Layer B의 불투명도 속성에 대해 작성한 경우 이 속성을 Layer A의 회전 속성에 연결하는 표현식은 다음과 같습니다.

배열 및 다차원 속성

배열은 순서 있는 숫자 세트를 저장하는 개체 유형입니다. 배열은 다음 예처럼 쉼표로 구분되고 대괄호로 묶인 숫자의 목록으로 나타냅니다.

[배열] 개체를 변수에 할당하면 표현식의 다른 영역에서 배열 값을 쉽게 참조할 수 있습니다. 예를 들면 다음과 같습니다.

[배열] 개체의 차원은 배열에 있는 요소의 수입니다. myArray의 차원은 2입니다. After Effects의 서로 다른 속성은 포함하는 값 인수의 수에 따라 서로 다른 차원을 가집니다. 표현식 언어에서 속성 값은 단일 값(숫자 개체)이거나 배열(배열 개체)입니다.

다음 표에서는 일부 속성과 그 차원의 예시를 확인할 수 있습니다.

대괄호 및 인덱스 번호로 원하는 요소를 지정하여 배열 개체의 개별 요소에 액세스할 수 있습니다. 배열 개체의 요소는 0부터 시작하도록 인덱싱됩니다. 이전 예제의 경우 myArray[0]는 10이고 myArray[1]은 23입니다.

다음 두 표현식은 동일합니다.

위치 속성 배열

[위치] 속성 배열은 다음과 같이 인덱싱됩니다.

• position[0]은 위치의 x 좌표입니다.

• position[1]은 위치의 y 좌표입니다.

• position[2]는 위치의 z 좌표입니다.

배열을 통한 색상 표현

색상은 4D 배열로 표현됩니다.

• 빨강
• 녹색
• 파랑
• 알파

색상 심도가 8bpc 또는 16bpc인 프로젝트에서 색상 배열의 각 값은 0(검정)에서 1(흰색)까지의 범위를 가집니다. 예를 들어 red는 0(색상 없음)에서 1(빨강)까지의 범위를 가질 수 있습니다. 따라서 [0,0,0,0]은 투명한 검정을 나타내고 [1,1,1,1]은 불투명한 흰색을 나타냅니다. 색상 심도가 32bpc인 프로젝트에서는 0보다 작거나 1보다 큰 값을 사용할 수 있습니다.

배열 개체에 있는 가장 차원이 높은 구성 요소의 인덱스보다 큰 인덱스를 사용하는 경우 After Effects에서는 오류를 반환합니다. 예를 들어 myArray[2]는 오류를 유발하지만 position[2]는 위치의 z 좌표를 반환합니다.

After Effects 표현식 언어의 많은 속성 및 메서드에서는 배열 개체를 인수로 받거나 값으로 반환합니다. 예를 들어 thisLayer.position은 레이어가 2D인지 아니면 3D인지에 따라 2차원 배열이 되거나 3차원 배열이 되는 개체입니다.

예제

위치 애니메이션의 y 값을 유지하고 x 값을 9로 고정하는 표현식을 작성하려면 다음을 사용합니다.

다음과 같이 더욱 간결한 표현식을 사용할 수도 있습니다.

이는 표현식 사용에서 중요한 지점이므로 예제를 하나 더 살펴보도록 합니다. Layer A의 x 위치 값과 Layer B의 y 위치 값을 결합하려면 다음을 사용합니다.

2D 또는 3D 속성의 배열 내에 있는 값 하나만 참조하는 표현식을 만들 수 있습니다. 달리 지정하지 않으면 기본적으로 첫 번째 값이 사용됩니다. 예를 들어 뚝딱 도구를 Layer A의회전 속성에서 Layer B의 비율 속성으로 드래그하면 다음 표현식이 나타납니다.

기본적으로 위 표현식에서는 비율 속성의 첫 번째 값인 폭을 사용합니다. 높이 값을 대신 사용하려면 뚝딱 도구를 속성 이름 대신 두 번째 값으로 바로 드래그하거나 다음과 같이 표현식을 변경합니다.

반대로 Layer B의 비율 속성에서 Layer A의 회전 속성으로 뚝딱 도구를 드래그하면 After Effects는 변수를 자동으로 만들어 1차원 회전 속성 값을 할당한 다음 비율 속성의 두 차원 모두에 대해 해당 변수를 사용합니다.

벡터

After Effects의 여러 속성과 메서드에서는 벡터를 받거나 반환합니다. After Effects에서는 배열이 공간의 점 또는 방향을 나타내는 경우 배열을 벡터로 참조합니다. 예를 들어 After Effects에서는 위치를 벡터 반환으로 설명합니다.

그러나 audioLevels와 같은 함수는 2차원 값(왼쪽 및 오른쪽 채널 레벨)을 반환하지만 점 또는 방향을 나타내지 않으므로 벡터라고 하지 않습니다. After Effects의 일부 함수에서 벡터 인수를 받아들이지만 벡터 인수는 일반적으로 전달된 값이 방향을 나타낼 때만 유용합니다. 예를 들어 cross(vec1, vec2)에서는 입력 벡터의 오른쪽 각도에 있는 세 번째 벡터를 계산합니다. 외적은 vec1 및 vec2가 공간의 방향을 나타내는 두 벡터인 경우에는 유용하지만 임의의 숫자 모음 두 개를 나타낼 때는 유용하지 않습니다.

인덱스 및 레이블

After Effects의 레이어, 효과 및 마스크 요소에 대한 인덱싱은 1부터 시작됩니다. 예를 들어 타임라인 패널의 첫 번째 레이어는 layer(1)입니다.

일반적으로 레이어, 효과 또는 마스크를 이동하거나 제품 업데이트 및 업그레이드 과정에서 인수가 변경되는 경우에는 숫자 대신 레이어, 효과 또는 마스크의 이름을 사용하여 혼동과 실수를 피하는 것이 좋습니다. 이름을 사용하는 경우 항상 곧은 따옴표로 묶도록 합니다. 예를 들어 아래의 첫 번째 표현식이 두 번째 표현식보다 이해하기 쉬우며 첫 번째 표현식은 효과의 순서를 바꿔도 작동합니다.

표현식 시간

표현식 내의 시간은 항상 컴포지션 시간(레이어 시간이 아님)에 있으며 초 단위로 측정됩니다(sourceRectAtTime() 표현식에서는 그렇지 않습니다). 모든 표현식의 기본 시간은 표현식이 계산되는 현재 컴포지션 시간입니다. 다음 표현식에서는 모두 기본 컴포지션 시간을 사용하고 같은 값을 반환합니다.

상대 시간을 사용하려면 time 인수에 증분된 시간 값을 더합니다. 예를 들어 현재 시간 5초 전의 위치 값을 구하려면 다음 표현식을 사용합니다.

중첩된 컴포지션에 있는 속성의 기본 시간 참조에서는 다시 매핑된 시간이 아닌 원본 기본 컴포지션 시간을 사용합니다. 그러나 source 함수를 사용하여 속성을 가져오는 경우 다시 매핑된 시간이 사용됩니다.

예를 들어 포함하는 컴포지션의 레이어 소스가 중첩된 컴포지션이고 포함하는 컴포지션에 다시 매핑된 시간이 있는 경우 다음 표현식을 사용하여 중첩된 컴포지션에 있는 레이어의 위치 값을 가져오면 위치 값에 컴포지션의 기본 시간이 사용됩니다.

그러나 source 함수로 layer 1에 액세스하면 위치 값에 다시 매핑된 시간이 사용됩니다.

표현식에서는 프레임이 아닌 초 단위 시간으로 연산하므로 프레임 단위로 연산을 수행하려면 시간 변환 메서드로 시간 값을 변환해야 할 수도 있습니다.

예제: 표현식 언어 참조를 사용하여 표현식 작성

다음 예제를 따라 After Effects 표현식 언어 참조를 사용하여 표현식을 작성하는 방법을 배웁니다. 이 예제에서 만들 표현식에서는 Solid 2의 위치 속성을 Solid 1의 위치 속성과 연결하고 Solid 2의 이동이 Solid 1의 이동에서 2초만큼 오프셋되도록 지정합니다.

표현식 리소스 더 보기