Shape Layer의 사용 영역이 점점 넓어지고 있어 그에 관련된 Script들이 만들어지고 있습니다. 최근에 나온 것들 중에 눈에 띄는 Script 중에 하나인 Super Line Script를 소개하겠습니다. 간단한 조작만으로 손이 많이 갔던 작업들을 손쉽게 처리할 수 있도록 도와주는 Script입니다. 물론, 예전에 소개한 Ouroboros와는 약간 차이가 나는 Script입니다. Super Line은 말 그대로 멋진(?) 라인을 간단하게 만들어 주는 Script입니다. Super Line Script를 설명하기 전에 지난 달에 소개한 Wind Script의 활용법을 먼저 이야기하고 넘어가겠습니다.
1. Wind Script 활용
01. Wind Script는 자연스럽게 바람이 불어서 오브제를 날리는 듯한 애니메이션을 만들어 주는 Script입니다. 지난 달에는 기본적인 옵션들의 정의와 사용법을 설명했습니다. 이번에는 간단하게 Type에 적용하는 응용 버전을 설명하겠습니다. 타입 툴로 원하는 글자를 써 넣습니다.
02. Type Layer를 선택한 다음, 마우스 우측 버튼을 눌러서 팝업 메뉴를 나타나게 합니다. 여기에서 Create Shapes From Text를 선택하여 Shape Layer로 만들어 줍니다.
03. 이렇게 해서 만들어준 Layer를 선택합니다. MOTIONLAB Outlines이라는 Layer에 각각의 철자만큼 Path들이 만들어졌습니다. Wind Script를 적용하려면, 각각의 철자들이 Layer별로 있어야 하므로 이것들을 각각의 Layer로 분리해야 합니다. 물론, 수작업으로 해도 되지만, 여간 짜증나는 일이 아닙니다. 그래서 이러한 불편을 해결해주는 Script가 바로 Explode Shape Layers입니다. Shape Layer를 완전 폭발시켜 버린다는 무서운 뜻의 이름입니다. https://aescripts.com/explode-shape-layers/ 에 들어가면, 각각의 옵션들에 대한 설명이 자세하게 나와 있으니 참고하기 바랍니다. 여기서 우리가 주목해야 하는 옵션은 바로 Explode Shape Layers 메뉴 중에서 맨 앞에 있는 Explode 버튼입니다. 사실 아이콘의 모양만 봐도 대충 알 수 있습니다. 이 버튼을 클릭합니다.
04. 오리지널 Layer는 그대로 놔두고(대신 눈 아이콘이 자동으로 꺼지게 됩니다.), 총 9개의 철자들이 Layer로 나뉘어졌습니다. 이제 Wind Script를 적용할 수 있게 되었습니다(Shape Layer에 있는 여러 개의 Path들을 개별적인 Layer로도 나눠주고, 반대로 여러 개의 Path들을 하나로도 만들어줍니다.).
05. 지난 번에 Wind Script의 옵션들을 설명했기 때문에, 여기에서는 넘어 가겠습니다. 기본적인 설정으로 하고, Apply 버튼을 누릅니다.
06. 애니메이션을 확인해봅니다.
07. 애니메이션을 보면, 글자들이 한꺼번에 Wind의 영향을 받아서 날아가는 것을 확인할 수 있습니다. 바람이 왼쪽에서 오른쪽으로 불어오는 것이므로 맨 마지막 글자, 즉 맨 오른쪽에 있는 'B'부터 날아가게 만들어보겠습니다. Wind Script를 적용하면, 자동으로 Shy 아이콘이 켜지면서 여러 Layer들이 안보이게 됩니다. 이것들을 보이게 만들기 위해 Shy 아이콘을 클릭합니다.
08. 가려진 Layer들이 나타납니다. 바로 Layer들을 컨트롤하는 Wind Null Layer들입니다. Null Layer들을 모두 선택합니다. 이제 선택한 Null Layer들의 Layer Bar를 계단 모양으로 만들어줘서 나타나는 시간들의 차이를 주기만하면, 한글자 한글자 원하는 시간대로 Wind Script의 적용을 받게 될 것입니다.
09. 물론, 이것 또한 간단하게 처리할 수 있습니다. Script 중에서 Layer Bar를 점진적으로 배치시켜주는 Script들이 몇 개 있습니다. 그 중에서 Sequence Layers라는 Script를 사용해보겠습니다. 초 단위 또는 프레임 단위로 Layer들을 옮겨줄 수 있습니다. 이번에는 5 Frames으로 설정하겠습니다. Execute 버튼을 누릅니다.
10. 그림처럼 각각의 Layer들이 5 프레임씩 타임라인에서 뒤로 밀리면서 배치됩니다.
11. 애니메이션을 확인해보면, 맨 뒤의 글자부터 차례대로 날아가는 것을 볼 수 있습니다. 사실 Wind Script는 사용 범위가 그렇게 넓지는 않다고 생각됩니다. 그러나 바람에 날아가는 식의 애니메이션 작업 시에는 유용하게 쓰일 것 같습니다.
2. Super Lines Script
01. Transition 또는 오브제가 움직일 때 사용되는 Speed Line에 사용될 수 있는 Super Lines에 대해서 알아보겠습니다. 좀 더 자세한 것들을 알아보려면, https://aescripts.com/super-lines/ 에서 확인하면 됩니다.
02. Script의 메뉴들을 보면, 생각보다 복잡하진 않습니다. Style은 총 2가지로 되어져 있는데, Cartoon Style과 Abstract Style입니다. 기본적으로 Super Lines Script를 적용시키면, 자동으로 1초 짜리 애니메이션이 만들어집니다. 이때 애니메이션이 되는 방향을 바꾸고 싶다면, Path Direction을 클릭하여 바꿔주면 됩니다.
03. 먼저, 컴포지션을 하나 만듭니다. 펜 툴을 선택하여 그림처럼 곡선을 하나 그려봅니다(Shape Layer를 하나 만드는 것입니다.). 그런 다음, Super Lines Script를 열어줍니다. 여기에 Style을 Abstract로 설정하고, Count를 10으로 입력한 후에 Generate Lines 버튼을 클릭하여 적용시켜봅니다.
04. 타임라인 윈도우를 봅니다. Shape Layer를 선택하고, 'U'를 눌러봅니다. 그림처럼 Expression이 적용되거나 키프레임이 적용된 속성들만 나타납니다. 아마도 엄청나게 많은 속성들이 나와서 당황했을 것입니다.
05. 이제 어떤 식으로 Shape Layer에 Super Lines가 적용되었는지를 알아보겠습니다. A라고 표시된 부분은 앞서 Count를 10으로 입력한 것에 대한 결과물로, 펜 툴로 만든 라인 Path를 10개 복제한 것입니다. 이 라인들을 자연스럽게 조절하기 위해서 필요한 것은 바로 Wiggle Transform입니다. 바로 B라고 표시된 부분입니다. B라고 표시된 부분들 및 다른 속성 값들을 Expression Control이라는 이펙트와 연결시켜 놓은 상태입니다. 기본적인 Transform 속성 중에서는 Rotation 속성만 Expression이 적용된 상태입니다.
06. Shape Layer의 Contents 안에 총 10개의 Shape이 있는데, 그 중에서 하단에 있는 Shape 1이 맨 처음에 만든 오리지널 라인입니다. 키프레임 애니메이션은 바로 여기 Trim Path에 있습니다. 유일하게 키프레임 애니메이션이 있는 곳입니다. Super Lines을 적용시키면, 자동으로 1초 정도의 애니메이션이 만들어집니다. 그런데 그 1초가 너무 짧던지, 길게 느껴져서 수정을 하고 싶다면, 바로 이 부분을 조절하면 됩니다.
07. 램프 리뷰로 애니메이션을 확인해 보기 바랍니다. 처음에 펜 툴로 만든 곡선으로 총 10개의 라인이 보는 것처럼 1초 동안 지나가는 애니메이션을 볼 수 있습니다.
3. Abstract Style 컨트롤하기
01. 위의 애니메이션을 보면, 오른쪽에서 왼쪽으로 라인이 움직입니다. 이것의 방향을 바꿔주려면, Path Direction에서 원하는 방향의 버튼을 클릭해 바꿔주면 됩니다.
02. 타임 라인 윈도우에 있는 Shape Layer를 선택한 다음, 이펙트 컨트롤 창을 확인합니다. 총 5개 파트로 설정 값들이 나뉘어져 있습니다. Time Setting은 라인이 나타나고, 또 다른 라인이 나타나는 시간을 조절하는 옵션입니다. 쉽게 말해서 Delay값을 조절하여 여러 개의 라인들이 나오는 시간을 조절하는 부분입니다. Width Settings은 라인의 두께 설정 및 여러 개의 라인일 경우 두께를 서로 다르게 만들어 주는 Random 값들을 조절하는 곳입니다. Transform Settings은 라인의 위치, 회전, 투명도를 컨트롤하는 부분입니다. Dash Setting은 아마 Shape Layer를 공부해본 분들은 잘 알리라 생각됩니다. 바로 Stroke의 옵션에 있는 부분으로 라인을 점선 형태로 만들어 주는 옵션입니다. 현재는 여러 개의 Stroke들이 모두 여기에 Expression으로 엮어져 있다고 생각하면 됩니다. 그래서 여기에 있는 Dash나 Gap의 값들을 조절하면, 라인들이 다양한 점선 모양으로 바뀌게 됩니다. Color Settings은 단색의 컬러를 바꿀 수도 있고, Random Color를 이용해서 다중 라인들의 컬러를 바꿔 줄 수도 있습니다.
03. 라인들이 나타나는 속도를 조절할 수 있습니다. Time Offset으로 하나씩 연달아서 나타나게 할 수 있으며, 여러 개가 한꺼번에 나타나게도 할 수 있습니다.
04. Time Random으로 나타나는 라인들의 모양을 바꿀 수도 있습니다. Time Random Seed 값을 조절하면, 랜덤으로 바뀌게 됩니다.
05. Width 값을 조절하고, Random 값을 조절해서 나타나는 라인들의 두께들을 조금씩 다르게 만들 수 있습니다.
06. Position Random 값을 0,0으로 설정하면, 여러 개의 라인이 하나로 겹쳐져서 보여집니다. 지금처럼 X, Y축의 값을 200으로 설정하면, 그림처럼 보여집니다.
07. 앞서 밝힌 것처럼 Effects에 있는 옵션들은 Shape Layer의 Wiggle Transform과 관련이 많습니다. Super Lines의 Position Random 값을 조절하면, Wiggle Transform의 Position 값과 연결되어 있다는 것을 알 수 있습니다.
08. 이제 다른 형태로 라인들을 배치해 보겠습니다. 보는 것처럼 Super Lines의 위치 값의 X, Y축 값을 0으로 설정하고, Time 값을 모두 0으로 설정한 다음, Rotation 값을 3도로 입력합니다.
09. Rotation 값을 3도로 입력하면, Shape Layer의 Rotation 값은 3 곱하기 -5.5를 하여 적용됩니다.
10. 만약, Position 값을 X=50, Y=50으로 입력한 다음, Opacity 값을 50으로 입력하면, 보는 것처럼 라인들의 투명도가 조금씩 다른 라인이 만들어집니다.
11. Dash 값을 조절하면, 원하는 Style의 점선 모양의 라인을 만들 수 있습니다.
12. Color 값을 조절하여 원하는 컬러를 만들 수 있고, Random Color를 체크하여 다양한 컬러를 만들 수도 있습니다.
13. Cap은 Shape Layer의 기본 옵션과 같은 기능을 합니다. Butt는 직선, Round는 곡선으로 라인의 양끝을 보여줍니다.
4. Cartoon Style 컨트롤하기
01. 이번에는 Cartoon Style을 알아보겠습니다. Cartoon Style로 설정하면, Type이 활성화됩니다. 총 3개의 Type으로 설정할 수 있습니다.
02. 기본적인 Regular를 선택하면, 그림처럼 보여집니다. Inverse와 Both Type 등도 확인해 보기 바랍니다. 겉모양만 이런 Style로 바뀐 것이지, 근본적인 것들은 Abstract과 비슷하다고 생각하면 됩니다.
03. Cartoon Style을 적용하고, 이펙트 컨트롤 창을 확인해보면, 약간 다른 것을 알 수 있습니다. Cartoon Style은 Shape Layer에 있는 Stroke들을 Expression으로 연결한 다음, Keylight으로 그린 스크린 형식으로 적용을 하고, 딱딱하게 각이 진 모양을 Fast Blur로 부드럽게 만들어 준 다음에 흐려진 이미지를 다시 Level 이펙트로 선명하게 하고, 여기에 Fill 이펙트로 컬러를 채워놓는 형식입니다. 이렇게 이야기하니 복잡합니다. 그래서 DO NOT TOUCH라는 이름으로 건드리지 말라는 이름을 붙여놓은 것입니다.
5. 글자가 써지는 애니메이션 만들기
01. 이제 Abstract Style로 글자가 써지는 애니메이션을 만들어보겠습니다. 먼저, 타입 툴로 원하는 글자를 써넣습니다.
02. 그런 다음에 펜 툴을 이용해서 그림처럼 모든 글자들을 자연스럽게 통과(?)하는 라인을 하나 그립니다. 손을 떼지 않고 글자를 써넣는다고 생각하면 됩니다. 반드시 이렇게 하지 않아도 되지만, 여기에서는 라인 하나로 끊어지지 않고 써지는 형식으로 해보겠습니다.
03. 그리고 방금 펜 툴로 그린 Layer에 Super Lines을 적용합니다. 설정 값들을 정해주고, Generate Lines 버튼을 누릅니다.
04. 컴포지션 윈도우를 확인하면 이렇게 보여질 것입니다.
05. Layer를 선택하고, 이펙트 컨트롤에 들어가면, 이펙트들이 보일 것입니다. 이제 적용된 Super Lines들을 좀 더 예쁘게 정리정돈을 해보겠습니다. 그림처럼 옵션 값들을 입력해보기 바랍니다.
06. 엄청나게 두꺼운 라인이 애니메이션되는 것을 확인할 수 있습니다. 이제 이 Layer의 이름을 '매스 소스용'이라고 바꿔줍니다. 이 두꺼운 라인에 따라서 글자가 써지는 것처럼 보이게 만들 예정입니다. 바로 Matte 기능을 사용하는 것입니다. 타임라인을 보면 좀 더 이해가 빠를 것입니다. 현재 Super Lines이 적용된 Layer가 바로 '매트 소스용' Layer입니다.
07. 애니메이션해보면, 글자가 써지는 애니메이션이 만들어진 것을 알 수 있습니다. 이렇게 Super Lines Script를 이용해서 매트 소스를 만들 수도 있습니다.
08. 매트 소스용 Layer의 Shape 1에 있는 Trim Path를 확인해봅니다. 여기에서 애니메이션을 바꿔줄 수 있는데, 라인이 지나가는 식이 아니라, 라인이 아예 없던 상태에서 생성되어져 그대로 화면에 있어야 매트 기능을 제대로 사용할 수 있습니다. 그래서 Start만 가지고 애니메이션을 만들었습니다. End 값은 100%로 입력해 놓으면 됩니다.
09. 그냥 글자만 써지면 밋밋해서 재미가 없습니다. 그래서 이번엔 라인이 지나가면서 글자가 써지는 애니메이션으로 해보겠습니다. 방금 전에 작업한 '매트 소스용' Layer를 복제합니다. 복제하고 선택한 뒤에 이번에는 Count를 10으로 입력하고, 다시 Generate Lines를 누릅니다.
10. Layer의 이름을 '라인 애니용'이라고 바꿔줍니다. 이제 이펙트 컨트롤 창에서 그림처럼 옵션들을 입력합니다.
11. 여러 개의 라인들이 왼쪽에서 오른쪽으로 패스를 따라서 움직이는 애니메이션을 확인할 수 있습니다.
12. 라인 애니용 Layer의 Shape 1 그룹 안에 있는 Trim Paths를 확인해봅니다. 원래 1초 안에 애니메이션되는 것이 너무 빠른 것 같아서 시간을 조금 늘려 보았습니다. 현재는 2초 조금 넘게 바꿔 보았습니다.
13. 타임라인 윈도우를 보면 이렇게 보일 것입니다.
14. 애니메이션을 시켜보면, 얇은 여러 개의 라인이 먼저 지나가고, 그 뒤로 글자들이 써지는 애니메이션을 볼 수 있을 것입니다. 이렇게 패스 하나만 가지고도 Super Lines을 이용해서 간단하게 멋진 애니메이션을 만들 수 있습니다.
6. Apply to Position 기능
01. Speed 라인과 같은 효과를 낼 수 있는 Super Line Script의 또 다른 기능에 대해 설명하겠습니다. 일단, 오브제를 만들고 간단한 애니메이션을 만듭니다.
02. 그림처럼 여러 개의 키프레임이 생성된 애니메이션이 만들어졌습니다. 이제 Layer를 선택합니다.
03. 선택한 다음, Apply to Position 버튼을 클릭합니다.
04. Layer가 새롭게 생성되었습니다. 그것도 원본 Layer의 밑에 생성되었습니다.
05. Composition Window에서 애니메이션을 시켜보면, 왜 원본 Layer의 밑에 생성이 되었는지 알 수 있습니다. 원본 Layer의 Position 패스를 그대로 가져와서 새롭게 생긴 Layer에 적용하고, 여기에 Super Lines을 적용한 것입니다. 이렇게 하니까 Speed Line 같아 보입니다(Speed Line이란, 오브제가 움직일 때, 움직임의 잔상처럼 라인이 보여지는 것을 말합니다.). 그래서 오브제의 밑에 있어야 잔상처럼 보여지기 때문에, 원본 Layer의 밑에 생성이 되는 것입니다.
Super Line은 적용 후에도 전체적인 속도가 많이 느려지지 않아서 좋습니다. 어떤 Script들은 적용 후에 전체적인 속도가 많이 떨어져서 저사양인 컴퓨터에서는 불편한 점이 많았는데, Super Lines은 그런 측면에서 괜찮은 Script 중 하나입니다.
많이 사용되는 기법이나 효과 등이 점점 사용자가 편리하게 사용할 수 있도록 이펙트 또는 Script로 나오고 있는 현실에서 점점 더 중요시되어지는 것이 바로 컨셉과 디자인, 그리고 아이디어입니다.
Shape Layer의 사용 영역이 점점 넓어지고 있어 그에 관련된 Script들이 만들어지고 있습니다. 최근에 나온 것들 중에 눈에 띄는 Script 중에 하나인 Super Line Script를 소개하겠습니다. 간단한 조작만으로 손이 많이 갔던 작업들을 손쉽게 처리할 수 있도록 도와주는 Script입니다. 물론, 예전에 소개한 Ouroboros와는 약간 차이가 나는 Script입니다. Super Line은 말 그대로 멋진(?) 라인을 간단하게 만들어 주는 Script입니다. Super Line Script를 설명하기 전에 지난 달에 소개한 Wind Script의 활용법을 먼저 이야기하고 넘어가겠습니다.
1. Wind Script 활용
01. Wind Script는 자연스럽게 바람이 불어서 오브제를 날리는 듯한 애니메이션을 만들어 주는 Script입니다. 지난 달에는 기본적인 옵션들의 정의와 사용법을 설명했습니다. 이번에는 간단하게 Type에 적용하는 응용 버전을 설명하겠습니다. 타입 툴로 원하는 글자를 써 넣습니다.
02. Type Layer를 선택한 다음, 마우스 우측 버튼을 눌러서 팝업 메뉴를 나타나게 합니다. 여기에서 Create Shapes From Text를 선택하여 Shape Layer로 만들어 줍니다.
03. 이렇게 해서 만들어준 Layer를 선택합니다. MOTIONLAB Outlines이라는 Layer에 각각의 철자만큼 Path들이 만들어졌습니다. Wind Script를 적용하려면, 각각의 철자들이 Layer별로 있어야 하므로 이것들을 각각의 Layer로 분리해야 합니다. 물론, 수작업으로 해도 되지만, 여간 짜증나는 일이 아닙니다. 그래서 이러한 불편을 해결해주는 Script가 바로 Explode Shape Layers입니다. Shape Layer를 완전 폭발시켜 버린다는 무서운 뜻의 이름입니다. https://aescripts.com/explode-shape-layers/ 에 들어가면, 각각의 옵션들에 대한 설명이 자세하게 나와 있으니 참고하기 바랍니다. 여기서 우리가 주목해야 하는 옵션은 바로 Explode Shape Layers 메뉴 중에서 맨 앞에 있는 Explode 버튼입니다. 사실 아이콘의 모양만 봐도 대충 알 수 있습니다. 이 버튼을 클릭합니다.
04. 오리지널 Layer는 그대로 놔두고(대신 눈 아이콘이 자동으로 꺼지게 됩니다.), 총 9개의 철자들이 Layer로 나뉘어졌습니다. 이제 Wind Script를 적용할 수 있게 되었습니다(Shape Layer에 있는 여러 개의 Path들을 개별적인 Layer로도 나눠주고, 반대로 여러 개의 Path들을 하나로도 만들어줍니다.).
05. 지난 번에 Wind Script의 옵션들을 설명했기 때문에, 여기에서는 넘어 가겠습니다. 기본적인 설정으로 하고, Apply 버튼을 누릅니다.
06. 애니메이션을 확인해봅니다.
07. 애니메이션을 보면, 글자들이 한꺼번에 Wind의 영향을 받아서 날아가는 것을 확인할 수 있습니다. 바람이 왼쪽에서 오른쪽으로 불어오는 것이므로 맨 마지막 글자, 즉 맨 오른쪽에 있는 'B'부터 날아가게 만들어보겠습니다. Wind Script를 적용하면, 자동으로 Shy 아이콘이 켜지면서 여러 Layer들이 안보이게 됩니다. 이것들을 보이게 만들기 위해 Shy 아이콘을 클릭합니다.
08. 가려진 Layer들이 나타납니다. 바로 Layer들을 컨트롤하는 Wind Null Layer들입니다. Null Layer들을 모두 선택합니다. 이제 선택한 Null Layer들의 Layer Bar를 계단 모양으로 만들어줘서 나타나는 시간들의 차이를 주기만하면, 한글자 한글자 원하는 시간대로 Wind Script의 적용을 받게 될 것입니다.
09. 물론, 이것 또한 간단하게 처리할 수 있습니다. Script 중에서 Layer Bar를 점진적으로 배치시켜주는 Script들이 몇 개 있습니다. 그 중에서 Sequence Layers라는 Script를 사용해보겠습니다. 초 단위 또는 프레임 단위로 Layer들을 옮겨줄 수 있습니다. 이번에는 5 Frames으로 설정하겠습니다. Execute 버튼을 누릅니다.
10. 그림처럼 각각의 Layer들이 5 프레임씩 타임라인에서 뒤로 밀리면서 배치됩니다.
11. 애니메이션을 확인해보면, 맨 뒤의 글자부터 차례대로 날아가는 것을 볼 수 있습니다. 사실 Wind Script는 사용 범위가 그렇게 넓지는 않다고 생각됩니다. 그러나 바람에 날아가는 식의 애니메이션 작업 시에는 유용하게 쓰일 것 같습니다.
2. Super Lines Script
01. Transition 또는 오브제가 움직일 때 사용되는 Speed Line에 사용될 수 있는 Super Lines에 대해서 알아보겠습니다. 좀 더 자세한 것들을 알아보려면, https://aescripts.com/super-lines/ 에서 확인하면 됩니다.
02. Script의 메뉴들을 보면, 생각보다 복잡하진 않습니다. Style은 총 2가지로 되어져 있는데, Cartoon Style과 Abstract Style입니다. 기본적으로 Super Lines Script를 적용시키면, 자동으로 1초 짜리 애니메이션이 만들어집니다. 이때 애니메이션이 되는 방향을 바꾸고 싶다면, Path Direction을 클릭하여 바꿔주면 됩니다.
03. 먼저, 컴포지션을 하나 만듭니다. 펜 툴을 선택하여 그림처럼 곡선을 하나 그려봅니다(Shape Layer를 하나 만드는 것입니다.). 그런 다음, Super Lines Script를 열어줍니다. 여기에 Style을 Abstract로 설정하고, Count를 10으로 입력한 후에 Generate Lines 버튼을 클릭하여 적용시켜봅니다.
04. 타임라인 윈도우를 봅니다. Shape Layer를 선택하고, 'U'를 눌러봅니다. 그림처럼 Expression이 적용되거나 키프레임이 적용된 속성들만 나타납니다. 아마도 엄청나게 많은 속성들이 나와서 당황했을 것입니다.
05. 이제 어떤 식으로 Shape Layer에 Super Lines가 적용되었는지를 알아보겠습니다. A라고 표시된 부분은 앞서 Count를 10으로 입력한 것에 대한 결과물로, 펜 툴로 만든 라인 Path를 10개 복제한 것입니다. 이 라인들을 자연스럽게 조절하기 위해서 필요한 것은 바로 Wiggle Transform입니다. 바로 B라고 표시된 부분입니다. B라고 표시된 부분들 및 다른 속성 값들을 Expression Control이라는 이펙트와 연결시켜 놓은 상태입니다. 기본적인 Transform 속성 중에서는 Rotation 속성만 Expression이 적용된 상태입니다.
06. Shape Layer의 Contents 안에 총 10개의 Shape이 있는데, 그 중에서 하단에 있는 Shape 1이 맨 처음에 만든 오리지널 라인입니다. 키프레임 애니메이션은 바로 여기 Trim Path에 있습니다. 유일하게 키프레임 애니메이션이 있는 곳입니다. Super Lines을 적용시키면, 자동으로 1초 정도의 애니메이션이 만들어집니다. 그런데 그 1초가 너무 짧던지, 길게 느껴져서 수정을 하고 싶다면, 바로 이 부분을 조절하면 됩니다.
07. 램프 리뷰로 애니메이션을 확인해 보기 바랍니다. 처음에 펜 툴로 만든 곡선으로 총 10개의 라인이 보는 것처럼 1초 동안 지나가는 애니메이션을 볼 수 있습니다.
3. Abstract Style 컨트롤하기
01. 위의 애니메이션을 보면, 오른쪽에서 왼쪽으로 라인이 움직입니다. 이것의 방향을 바꿔주려면, Path Direction에서 원하는 방향의 버튼을 클릭해 바꿔주면 됩니다.
02. 타임 라인 윈도우에 있는 Shape Layer를 선택한 다음, 이펙트 컨트롤 창을 확인합니다. 총 5개 파트로 설정 값들이 나뉘어져 있습니다. Time Setting은 라인이 나타나고, 또 다른 라인이 나타나는 시간을 조절하는 옵션입니다. 쉽게 말해서 Delay값을 조절하여 여러 개의 라인들이 나오는 시간을 조절하는 부분입니다. Width Settings은 라인의 두께 설정 및 여러 개의 라인일 경우 두께를 서로 다르게 만들어 주는 Random 값들을 조절하는 곳입니다. Transform Settings은 라인의 위치, 회전, 투명도를 컨트롤하는 부분입니다. Dash Setting은 아마 Shape Layer를 공부해본 분들은 잘 알리라 생각됩니다. 바로 Stroke의 옵션에 있는 부분으로 라인을 점선 형태로 만들어 주는 옵션입니다. 현재는 여러 개의 Stroke들이 모두 여기에 Expression으로 엮어져 있다고 생각하면 됩니다. 그래서 여기에 있는 Dash나 Gap의 값들을 조절하면, 라인들이 다양한 점선 모양으로 바뀌게 됩니다. Color Settings은 단색의 컬러를 바꿀 수도 있고, Random Color를 이용해서 다중 라인들의 컬러를 바꿔 줄 수도 있습니다.
03. 라인들이 나타나는 속도를 조절할 수 있습니다. Time Offset으로 하나씩 연달아서 나타나게 할 수 있으며, 여러 개가 한꺼번에 나타나게도 할 수 있습니다.
04. Time Random으로 나타나는 라인들의 모양을 바꿀 수도 있습니다. Time Random Seed 값을 조절하면, 랜덤으로 바뀌게 됩니다.
05. Width 값을 조절하고, Random 값을 조절해서 나타나는 라인들의 두께들을 조금씩 다르게 만들 수 있습니다.
06. Position Random 값을 0,0으로 설정하면, 여러 개의 라인이 하나로 겹쳐져서 보여집니다. 지금처럼 X, Y축의 값을 200으로 설정하면, 그림처럼 보여집니다.
07. 앞서 밝힌 것처럼 Effects에 있는 옵션들은 Shape Layer의 Wiggle Transform과 관련이 많습니다. Super Lines의 Position Random 값을 조절하면, Wiggle Transform의 Position 값과 연결되어 있다는 것을 알 수 있습니다.
08. 이제 다른 형태로 라인들을 배치해 보겠습니다. 보는 것처럼 Super Lines의 위치 값의 X, Y축 값을 0으로 설정하고, Time 값을 모두 0으로 설정한 다음, Rotation 값을 3도로 입력합니다.
09. Rotation 값을 3도로 입력하면, Shape Layer의 Rotation 값은 3 곱하기 -5.5를 하여 적용됩니다.
10. 만약, Position 값을 X=50, Y=50으로 입력한 다음, Opacity 값을 50으로 입력하면, 보는 것처럼 라인들의 투명도가 조금씩 다른 라인이 만들어집니다.
11. Dash 값을 조절하면, 원하는 Style의 점선 모양의 라인을 만들 수 있습니다.
12. Color 값을 조절하여 원하는 컬러를 만들 수 있고, Random Color를 체크하여 다양한 컬러를 만들 수도 있습니다.
13. Cap은 Shape Layer의 기본 옵션과 같은 기능을 합니다. Butt는 직선, Round는 곡선으로 라인의 양끝을 보여줍니다.
4. Cartoon Style 컨트롤하기
01. 이번에는 Cartoon Style을 알아보겠습니다. Cartoon Style로 설정하면, Type이 활성화됩니다. 총 3개의 Type으로 설정할 수 있습니다.
02. 기본적인 Regular를 선택하면, 그림처럼 보여집니다. Inverse와 Both Type 등도 확인해 보기 바랍니다. 겉모양만 이런 Style로 바뀐 것이지, 근본적인 것들은 Abstract과 비슷하다고 생각하면 됩니다.
03. Cartoon Style을 적용하고, 이펙트 컨트롤 창을 확인해보면, 약간 다른 것을 알 수 있습니다. Cartoon Style은 Shape Layer에 있는 Stroke들을 Expression으로 연결한 다음, Keylight으로 그린 스크린 형식으로 적용을 하고, 딱딱하게 각이 진 모양을 Fast Blur로 부드럽게 만들어 준 다음에 흐려진 이미지를 다시 Level 이펙트로 선명하게 하고, 여기에 Fill 이펙트로 컬러를 채워놓는 형식입니다. 이렇게 이야기하니 복잡합니다. 그래서 DO NOT TOUCH라는 이름으로 건드리지 말라는 이름을 붙여놓은 것입니다.
5. 글자가 써지는 애니메이션 만들기
01. 이제 Abstract Style로 글자가 써지는 애니메이션을 만들어보겠습니다. 먼저, 타입 툴로 원하는 글자를 써넣습니다.
02. 그런 다음에 펜 툴을 이용해서 그림처럼 모든 글자들을 자연스럽게 통과(?)하는 라인을 하나 그립니다. 손을 떼지 않고 글자를 써넣는다고 생각하면 됩니다. 반드시 이렇게 하지 않아도 되지만, 여기에서는 라인 하나로 끊어지지 않고 써지는 형식으로 해보겠습니다.
03. 그리고 방금 펜 툴로 그린 Layer에 Super Lines을 적용합니다. 설정 값들을 정해주고, Generate Lines 버튼을 누릅니다.
04. 컴포지션 윈도우를 확인하면 이렇게 보여질 것입니다.
05. Layer를 선택하고, 이펙트 컨트롤에 들어가면, 이펙트들이 보일 것입니다. 이제 적용된 Super Lines들을 좀 더 예쁘게 정리정돈을 해보겠습니다. 그림처럼 옵션 값들을 입력해보기 바랍니다.
06. 엄청나게 두꺼운 라인이 애니메이션되는 것을 확인할 수 있습니다. 이제 이 Layer의 이름을 '매스 소스용'이라고 바꿔줍니다. 이 두꺼운 라인에 따라서 글자가 써지는 것처럼 보이게 만들 예정입니다. 바로 Matte 기능을 사용하는 것입니다. 타임라인을 보면 좀 더 이해가 빠를 것입니다. 현재 Super Lines이 적용된 Layer가 바로 '매트 소스용' Layer입니다.
07. 애니메이션해보면, 글자가 써지는 애니메이션이 만들어진 것을 알 수 있습니다. 이렇게 Super Lines Script를 이용해서 매트 소스를 만들 수도 있습니다.
08. 매트 소스용 Layer의 Shape 1에 있는 Trim Path를 확인해봅니다. 여기에서 애니메이션을 바꿔줄 수 있는데, 라인이 지나가는 식이 아니라, 라인이 아예 없던 상태에서 생성되어져 그대로 화면에 있어야 매트 기능을 제대로 사용할 수 있습니다. 그래서 Start만 가지고 애니메이션을 만들었습니다. End 값은 100%로 입력해 놓으면 됩니다.
09. 그냥 글자만 써지면 밋밋해서 재미가 없습니다. 그래서 이번엔 라인이 지나가면서 글자가 써지는 애니메이션으로 해보겠습니다. 방금 전에 작업한 '매트 소스용' Layer를 복제합니다. 복제하고 선택한 뒤에 이번에는 Count를 10으로 입력하고, 다시 Generate Lines를 누릅니다.
10. Layer의 이름을 '라인 애니용'이라고 바꿔줍니다. 이제 이펙트 컨트롤 창에서 그림처럼 옵션들을 입력합니다.
11. 여러 개의 라인들이 왼쪽에서 오른쪽으로 패스를 따라서 움직이는 애니메이션을 확인할 수 있습니다.
12. 라인 애니용 Layer의 Shape 1 그룹 안에 있는 Trim Paths를 확인해봅니다. 원래 1초 안에 애니메이션되는 것이 너무 빠른 것 같아서 시간을 조금 늘려 보았습니다. 현재는 2초 조금 넘게 바꿔 보았습니다.
13. 타임라인 윈도우를 보면 이렇게 보일 것입니다.
14. 애니메이션을 시켜보면, 얇은 여러 개의 라인이 먼저 지나가고, 그 뒤로 글자들이 써지는 애니메이션을 볼 수 있을 것입니다. 이렇게 패스 하나만 가지고도 Super Lines을 이용해서 간단하게 멋진 애니메이션을 만들 수 있습니다.
6. Apply to Position 기능
01. Speed 라인과 같은 효과를 낼 수 있는 Super Line Script의 또 다른 기능에 대해 설명하겠습니다. 일단, 오브제를 만들고 간단한 애니메이션을 만듭니다.
02. 그림처럼 여러 개의 키프레임이 생성된 애니메이션이 만들어졌습니다. 이제 Layer를 선택합니다.
03. 선택한 다음, Apply to Position 버튼을 클릭합니다.
04. Layer가 새롭게 생성되었습니다. 그것도 원본 Layer의 밑에 생성되었습니다.
05. Composition Window에서 애니메이션을 시켜보면, 왜 원본 Layer의 밑에 생성이 되었는지 알 수 있습니다. 원본 Layer의 Position 패스를 그대로 가져와서 새롭게 생긴 Layer에 적용하고, 여기에 Super Lines을 적용한 것입니다. 이렇게 하니까 Speed Line 같아 보입니다(Speed Line이란, 오브제가 움직일 때, 움직임의 잔상처럼 라인이 보여지는 것을 말합니다.). 그래서 오브제의 밑에 있어야 잔상처럼 보여지기 때문에, 원본 Layer의 밑에 생성이 되는 것입니다.
Super Line은 적용 후에도 전체적인 속도가 많이 느려지지 않아서 좋습니다. 어떤 Script들은 적용 후에 전체적인 속도가 많이 떨어져서 저사양인 컴퓨터에서는 불편한 점이 많았는데, Super Lines은 그런 측면에서 괜찮은 Script 중 하나입니다.
많이 사용되는 기법이나 효과 등이 점점 사용자가 편리하게 사용할 수 있도록 이펙트 또는 Script로 나오고 있는 현실에서 점점 더 중요시되어지는 것이 바로 컨셉과 디자인, 그리고 아이디어입니다.