텍스트 애니메이션 예제 및 리소스

새 컴포지션을 만듭니다.

[애니메이션] > [텍스트 애니메이션] > [문자별로 3D 사용]을 선택합니다.

[애니메이션] > [텍스트 애니메이션] > [위치]를 선택합니다.

[애니메이션] > [텍스트 애니메이션] > [회전]을 선택합니다.

[타임라인] 패널의 [애니메이터] 그룹에서 [X 회전] 속성은 45로, [위치] 값은 (0.0, 0.0, -100.0)으로 설정합니다.

[범위 선택기 1]을 확장합니다.

[오프셋] 속성의 초시계 아이콘을 클릭하여 0초에 값이 있는 초기 키프레임을 설정합니다.

[오프셋] 속성 값을 -15%로 설정합니다.

[종료] 속성 값을 15%로 설정합니다.

현재 시간 표시기를 10초로 이동하고 [오프셋] 값을 100%로 설정합니다.

R 키를 눌러 전체 레이어의 [회전] 속성을 표시합니다.

레이어의 [Y 회전] 값을 -45로 설정하고 전체 레이어를 회전합니다. 그러면 문자의 3D 동작을 더욱 쉽게 볼 수 있습니다.

[애니메이션] > [텍스트 애니메이션] > [문자 오프셋]을 선택합니다.

[타임라인] 패널에서 [문자 오프셋] 값을 5로 설정합니다.

[범위 선택기 1]을 확장합니다.

시작 초시계를 클릭하여 0초에 초기 프레임을 설정하고 값을 0%로 설정합니다.

[문자 정렬]을 [가운데]로 설정합니다.

[애니메이션] > [텍스트 애니메이션] > [위치]를 선택합니다.

[타임라인] 패널에서 모든 문자가 프레임을 벗어날 때까지 [위치] 속성의 y 값을 왼쪽으로 드래그합니다.

[범위 선택기 1]을 확장합니다.

시작 초시계를 클릭하고 0초에 0%를 그대로 둔 다음 현재 시간 표시기를 5초로 이동하고 [시작]을 100%로 설정합니다.

[애니메이터 1] 그룹을 축소합니다.

[타임라인] 패널에서 텍스트 레이어 이름만 선택하고 [애니메이션] 메뉴에서 [칠 색상] > [색조]를 선택합니다. [타임라인] 패널에 새 애니메이터 그룹인 [애니메이터 2]가 나타납니다.

[칠 색조]를 1x+0.0으로 설정합니다.

[애니메이터 2]의 [범위 선택기 1]을 확장합니다.

시작 초시계를 클릭하고 0초에 0%를 그대로 둔 다음 현재 시간 표시기를 5초로 이동하고 [시작]을 100%로 설정합니다.

[칠 색조]를 선택한 상태로 [추가] 메뉴에서 [선택기] > [흔들기]를 선택합니다.

텍스트 레이어를 선택한 상태로 [단락] 패널에서 텍스트 가운데 맞춤] 버튼을 클릭합니다.

[보기] > [격자 표시]를 선택합니다.

[타임라인] 패널에서 텍스트 레이어를 선택하고 [애니메이션] > [텍스트 애니메이션] > [자간]을 선택합니다.

[자간 유형] 메뉴에 [이전 및 이후]가 지정되었는지 확인합니다.

[자간 양] 초시계를 클릭하고 0초의 값을 0으로 유지합니다.

현재 시간 표시기를 5초로 이동하고 모든 문자가 화면을 벗어날 때까지 [자간 양] 값을 드래그합니다.

현재 시간 표시기를 0초에 둔 상태에서 [컴포지션] 패널의 스냅사진을 만듭니다. 이 스냅사진과 격자를 사용하여 애니메이션이 끝날 때 숫자 7의 원래 위치를 파악하게 됩니다.

[스냅사진 표시] 단추를 클릭합니다.

[타임라인] 패널에서 [애니메이터 1]을 선택하고 [추가] 메뉴에서 [선 기준]을 선택합니다.

7이 대략적으로 [컴포지션] 패널 가운데의 원래 위치에 배치될 때까지 [선 기준] 값을 드래그합니다.

[컴포지션] 패널에서 [스냅사진 표시] 버튼을 클릭하여 원래 위치에서 7의 정확한 위치를 확인합니다. [선 기준] 값을 조정하여 문자를 원래 위치에 배치합니다.

[애니메이션] > [텍스트 애니메이션] > [기울이기]를 선택합니다.

[타임라인] 패널에서 [기울이기] 값을 35로 설정합니다.

현재 시간 표시기가 0초에 있는지 확인하고 종료 초시계를 클릭합니다.

[컴포지션] 패널에서 두 선택기 막대를 모두 Speeding의 S 왼쪽으로 드래그합니다.

[애니메이션] > [텍스트 애니메이션] > [불투명도]를 선택합니다.

[불투명도]를 0%로 설정합니다.

[범위 선택기 1]을 확장하고 [시작] 초시계 아이콘을 클릭합니다.

[컴포지션] 패널에서 시작 선택기를 텍스트의 왼쪽 가장자리로 드래그합니다. 그러면 값은 0이 됩니다.

현재 시간 표시기를 5초로 이동하고 [컴포지션] 패널에 있는 시작 선택기를 텍스트의 오른쪽 가장자리로 드래그합니다. 그러면 값은 5가 됩니다.

[타임라인] 패널에 있는 텍스트 레이어의 [애니메이션] 메뉴에서 [불투명도]를 선택합니다.

[타임라인] 패널에서 텍스트 레이어와 해당 애니메이터를 확장합니다.

[범위 선택기]를 선택하여 삭제합니다.

텍스트 레이어의 [애니메이터] 속성 그룹 옆에서 [추가] > [선택기] > [흔들기]를 선택합니다.

[추가] > [선택기] > [표현식]을 선택합니다. [흔들기] 선택기가 [표현식] 선택기 앞에 오지 않으면 [흔들기] 선택기를 [표현식] 선택기 위로 드래그합니다.

[표현식 선택기]를 확장합니다.

selectorValue * textIndex/textTotal

r_val=selectorValue[0];
if(r_val < 50)r_val=0;
if(r_val > 50)r_val=100;
r_val

[타임라인] 패널에서 텍스트 레이어를 확장하여 텍스트 속성을 봅니다. [애니메이션] 메뉴에서 [위치] 애니메이터 그룹을 추가합니다.

[추가] 메뉴를 선택한 다음 [선택기] > [표현식]을 선택하여 [표현식] 선택기를 추가합니다. [표현식] 선택기를 확장하여 해당 옵션을 표시합니다.

selectorValue * textIndex/textTotal

seedRandom(textIndex);
amount=linear(time, 0, 5, 200*textIndex/textTotal, 0);
wiggle(1, amount);

이 예제에서는 선형 메서드를 사용하여 시간 경과에 따라 최대 흔들기 양을 줄입니다.

[타임라인] 패널에서 레이어를 선택하지 않은 상태로 [효과 및 사전 설정] 패널에서 [현재 시간 포맷] 애니메이션 사전 설정을 두 번 클릭합니다. ([효과 및 사전 설정] 패널의 [다음 포함] 필드에 해당 이름을 입력하여 애니메이션 사전 설정을 찾을 수 있습니다.)

[소스 텍스트] 속성에 텍스트가 프로젝트의 시간 표시 형식으로 현재 시간을 표시하도록 하는 표현식이 있는 새 텍스트 레이어가 만들어집니다.

[전체] 범주에 있는 다른 표현식을 사용하여 시간을 다른 형식으로 표시할 수 있습니다.