인터넷 서핑을 하다가 우연히 일본 사이트에서 이 Script를 발견했습니다. 원래 이 Script는 Cuttana와 ShapeNir Script로, 별도의 Script입니다. 각각 39.99달러에 판매하던 것을 합쳐서 CuttanaNir라는 이름으로 Aescript에서 판매하기 시작했습니다. 이 Script를 처음 봤을 때, 역시 일본이라는 생각이 들었습니다.


일본 사이트

https://aescripts.com/cuttananir

1. CuttanaNir Interface

01. 2개의 Script를 하나로 모아 놓아서 그런지, 상단의 탭이 총 5개입니다. 작업에 있어서 순서에 맞춰 배치되어 있습니다. 문제는 상단 탭에 대한 Help가 약간 부족해 보입니다. 첫 부분부터 순서대로 설명해드리겠습니다.

T는 Text Layer를 각각의 Shape Layer로 분리합니다. P는 선택한 포인트를 나눠주는 신박한(?) 기능을 가지고 있습니다. 다시 말해, 하나의 Shape Layer를 2개나 여러 개로 나눠주는 기능을 합니다. Illustrator에서 면을 자른다는 표현을 하는데, 바로 그런 기능입니다. 하단의 Slice는 하나의 포인트만 선택하고 상하좌우 직선으로 면을 나눠주는 기능입니다.

02. S는 하나의 Shape Layer에 있는 여러 개의 Group을 각각의 Layer로 만들어주는 기능을 합니다. 2020이나 2021 버전에서 Script를 사용할 수 있다고 하는데, 2019에서 테스트한 결과, 2019에서도 사용이 가능합니다. L은 바로 Path의 넘버를 기억하여 이것을 기반으로 Fill 애니메이션을 하는 것입니다.

03. Q는 앞서 작업한 애니메이션들의 키프레임을 원하는 시간대로 줄이거나 늘려주는 역할을 합니다. 뒷부분에서 직접 보여드리겠습니다.

2. Typo Animation

01. MOTIONLAB이라는 Typo를 만들고, Layer를 선택한 다음에 T 탭에 있는 Separate를 클릭합니다.

02. 오리지널 Layer는 눈이 꺼지면서 알파벳이 Shape Layer로 나누어집니다.

03. 이제 P 탭으로 넘어갑니다. 알파벳 T를 예로 들어보겠습니다. 라인 2개가 직각으로 만나는 형태이기 때문에, 이것을 2개의 Layer로 나눠보겠습니다. 먼저, 화면에 보이는 2개의 Path Point를 선택합니다. 그런 다음에 Cut 버튼을 누릅니다. 신기하게도 2개의 Group으로 나뉘어집니다.

04. 타임라인을 보면, 2개의 Group으로 나뉘어진 것을 확인할 수 있습니다.

05. 이제 S 탭으로 가서 Separate 버튼을 클릭합니다. Group이 Layer로 나눠집니다.

06. 이제부터 하이라이트 부분입니다. T의 윗부분에 있는 Layer를 애니메이션시켜보겠습니다. 먼저, 애니메이션이 시작될 Point를 그림처럼 선택합니다. 그리고 First 버튼을 누르면, Path에서 Point가 가지고 있는 번호가 부여됩니다.

07. 이번에는 애니메이션이 끝나는 부분의 Point를 선택하고, Last 버튼을 클릭합니다. 이제 기본적인 셋팅이 모두 끝났습니다. Create 버튼을 클릭합니다.

08. 가운데에 라인이 생기면서 Layer가 사라지는 것을 볼 수 있습니다. 물론, 타임 마커를 0초에 위치시켜 놓으면, 이렇게 됩니다. 아마 화면이 이렇게 보여서 당황했을 수도 있을 겁니다.

09. 이미 애니메이션이 되어서 그렇게 보이는 것입니다. 타임라인에서 확인해보기 바랍니다.

10. 애니메이션도 확인해봅니다.

11. 이런 방식으로 나머지 알파벳들도 하나하나 애니메이션시켜보겠습니다. M은 하나의 Layer로 되어 있어서 시작과 끝 Point를 선택하기가 편합니다. Create를 클릭합니다.

12. M에 가이드라인이 생긴 것이 맘에 들지 않을 수도 있겠지만, 사실 애니메이션에 큰 차이는 없습니다. 가이드라인의 Path 모양을 바꾸어도 애니메이션에는 큰 변화가 없습니다. Typo의 중앙에 생기는 라인은 그냥 가이드 라인입니다.

3. 2개의 Path를 가진 Shape Layer

01. 사실 O, A, B와 같은 알파벳들은 애니메이션을 만들기가 조금 까다롭습니다. 그 중에서도 O는 난감할 수 있습니다. 이번에는 O를 애니메이션시켜보겠습니다. 2개의 Point를 선택한 다음, Cut 버튼을 클릭하여 Layer를 나눠줍니다.

02. 라인에 커서를 대고 클릭하여 살짝 위로 올리거나 내리면, 그림처럼 나눠진 라인이 벌어집니다.

03. 2개의 Point를 선택하고, First 버튼을 클릭합니다. 그리고 다른 2개의 Point를 선택하고, Last 버튼을 클릭합니다.

04. 일단 First와 Last에 입력 값이 체크되었으면, Undo를 실행하여(Ctrl + Z) 벌린 O를 다시 벌리기 전으로 만들고, Create 버튼을 클릭합니다.

05. 애니메이션을 만들어서 확인해보면, 처음에 First로 설정한 부분에서 시계 방향으로 애니메이션이 되는 것을 확인할 수 있습니다.

4. Bone 수정하기

01. 이번에는 N의 Bone을 만들어보겠습니다. Bone은 L 탭에서 작업하는 것으로, Typo의 중앙에 만들어지는 라인입니다. 시작 Point와 끝나는 Point를 그림처럼 설정합니다. Create를 클릭하여 기본적인 Bone을 생성합니다.

02. Undo로 다시 원상태로 되돌립니다. 이제 Bone의 모양을 바꿔보겠습니다. 그림과 같은 부분을 선택하여 Invalid를 순서대로 2번 클릭합니다.

03. Definitive를 같은 방법으로 순서대로 선택한 다음에 클릭해주고, Create 버튼을 누릅니다.

04. 앞서 보았던 Bone과는 약간 다른 형태의 Bone이 만들어지는 것을 확인할 수 있습니다. 약간 애니메이션이 다릅니다.

05. 이번에는 A로 만들어보겠습니다. 어느 부분을 자를 것인지를 선택하는 것이 우선입니다. 그림처럼 2개의 Point를 선택하고, Cut 버튼을 눌러 자릅니다.

06. 같은 방법으로 옆에 있는 부분도 잘라냅니다.

07. Layer를 선택한 다음, S 탭의 Separate 버튼을 클릭하여 2개의 Layer로 만듭니다.

08. B Layer 같은 경우는 그림처럼 3번을 Cut으로 잘라냅니다.

09. 그러면, 2개의 Group으로 나눠지며, 이것을 S 탭의 Separate 버튼으로 2개의 Layer로 만듭니다.

10. 이제 하나의 Layer를 만들고, 시작 Point 2개와 끝나는 지점의 Point 2개를 선택하여 그림처럼 만들어줍니다. Bone이 별로 예쁘게 되지 않았지만, Shape Layer의 Fill 애니메이션 특성상 별차이가 없이 보일 겁니다.

11. 애니메이션을 만들어서 확인해봅니다.

12. 기본값으로 설정된 키프레임 애니메이션이 12프레임입니다. 그래서 모든 Layer들의 애니메이션이 12프레임에서 끝나게 될 것입니다.

5. 애니메이션 속도 조절하기

01. 이번에는 마지막에 있는 Q 탭에 대해서 알아보겠습니다. L 탭까지 모두 진행했다면, 각각의 알파벳들이 애니메이션까지 되었을 것입니다. 하지만, 모두 기본 값이 12프레임의 애니메이션이어서 상당히 빠르게 진행되는 것을 보았을 것입니다. 이제 원하는 시간대로 애니메이션을 만들어보겠습니다. 하단에 보면, 키를 원하는 대로 늘릴 수 있는 Stretch Key라는 버튼이 있습니다. 원래 옆에는 TC로 00:00:01:20 이런 식으로 시분초 프레임 형식으로 있을 것입니다. TC를 클릭하면, F로 바뀌면서 원하는 프레임을 입력할 수 있습니다. 원하는 프레임을 입력한 다음, Stretch Key를 클릭하면, 애니메이션된 전체 알파벳의 키프레임이 입력한 프레임만큼 늘어납니다. 예를 들어, 120프레임으로 입력했으면, 초당 30프레임으로 계산하여 4초짜리 애니메이션이 만들어집니다.

6. 뒷이야기 - Alpha Add 활용법

01. 하나의 Layer를 2개 또는 3개로 나누면, 그림처럼 잘라진 부분의 경계선이 보기 싫게 나타납니다(일부러 뒷배경을 눈에 띄게 Red로 만들었습니다). 이 부분을 없애기 위해서는 일단 나뉘어진 Layer를 PreComp로 만듭니다.

02. 그런 다음에 PreComp로 들어가서 Alpha Add로 Mode를 설정해주면, 깔끔하게 보일 것입니다.

Typo 애니메이션을 할 때, 가장 짜증나면서 힘든 부분을 이런 식으로 처리하는 Script는 아마도 처음일 것입니다. 한자를 많이 사용하는 일본이니까 가능했을 법한 Script입니다(제 개인적인 사견입니다). 기존에 사용했던 Stroke 이펙트나 Mask로 애니메이션했던 것보다도 훨씬 빠르고, 편하게 애니메이션할 수 있을 것 같습니다.