AE 강의 3강
애니메이션 법칙 12가지 (디즈니에서 만든)
AE에서 구현 가능한, 활용을 많이 하는 애니메이션
1. 타이밍(Timing): 애니메이션의 박자, 리듬. (감정과 무게를 함께 전달하는 요소)
AE에서는 키프레임 간의 거리가 타이밍을 결정한다.
키프레임 구간이 짧으면 빠른 속도와 중력감을 표현할 수 있다. 반대로 길게 설정하면 부드럽고 느린 움직임이 된다.
2. 가속과 감속(Ease In/Out): 타이밍의 세부 조정
모든 움직임은 천천히 출발했다가 속도가 붙고, 멈출 때는 점차 속도가 줄어드는데,
AE에서는 키프레임을 선택하고 ease ease를 눌러 효과를 적용하거나 speed graph에서 속도 곡선을 조정해서 출발과 멈춤의 완급을 직접 설계할 수 있다.
3. 예비 동작(Anticipation): 움직임 시작 전에는 긴장감을 주는 준비 동작이 필요한데, 이러한 움직임의 예고가 보는 사람의 시선을 미리 준비시킬 수 있는 효과가 있다.
AE에서는 본 동작 시작 몇 프레임 전에 position 값을 살짝 반대방향으로 옮겨주기만 해도 예비동작 표현이 가능하다.
4. 여운과 시차(Follow-Thriugh & Overlapping Action)
- 여운: 주요 동작이 끝난 후에도 관성에 의해 일부 요소가 계속 움직이는 현상, AE에서는 마지막 키프레임을 살짝 뒤로 밀거나 Ease Out 값을 강화해서 여운을 만들 수 있다.
- 시차: 몸의 각 부분이 시간차를 두고 반응하는 것. AE에서는 여러 레이어를 사용해 각 레이어의 키프레임을 2~2프레임씩 오프셋 시켜서 리듬을 만든다.
5.눌림과 늘어남(Squash & Stretch)
- 눌림: 물체가 충격을 받거나 멈출때 눌리듯 납작해지는 형태
- 늘어남: 물체가 빠르게 이동할 때 길게 늘어나는 형태.
두 움직임 모두 AE에서는 scale 속성에서 X/Y 비율을 각각 조정해서 만든다.
가로로 눌리면 세로로 길어지고, 세로로 길어지면 가로는 줄어들어야 한다.
이때, 물체의 부피감이 유지되어야 자연스러운 움직임을 만들 수 있다.
예) 공이 바닥에 닿을 때 Y축을 80%, X축을 120%로 주면 충돌의 충격이 표현된다.
반대로 튀어 오를 때는 Y축을 115%, X축을 85%로 주면 속도감과 탄성이 강조된다.
1. Transform 속성
- Transform 속성의 구조: Position(위치), Scale(크기), Rotation(회전), Opacity(투명도)
- 각 속성은 독립적으로 움직이지만, 조합되어 더 풍부한 움직임을 표현할 수 있다.
- 키프레임은 Transform 속성의 시간 변화값을 기록해서 애니메이션을 형 tjd한다.
- 오브젝트의 anchor point를 기준으로 transform 값이 적용되므로, anchor point의 위치가 전체 모션 결과에 큰 영향을 준다.
키프레임: AE에서 특정 ‘시점’에 설정한 ‘값’을 ‘저장’하는 포인트
- 속성 대부분에 키프레임 적용이 가능하다.
- 두 개 이상의 키프레임이 있다면 AE가 시작 값과 끝 값을 시간에 따라 자동으로 계산해서 움직인다.(모션)
anchor point: 레이어의 회전, 스케일, 위치 등 transform 연산의 기준점. 레이어 안에서 움직이는 가상의 중심점
anchor point와 transform 속성 연결
- Position: 레이어 전체의 이동. anchor point와 직접적인 연관은 없지만 anchor point의 위치가 레이어 내부에서 기준이 되기 때문에 레이어 이동 후 다른 속성 변화가 달라보일 수 있다.
- rotation: anchor point를 중심으로 회전한다.
예) anchor point가 레이어 중앙이라면 가운데를 기준으로 회전하고, 모서리라면 모서리를 중심으로 레이어가 회전한다.
- scale: 크기 변화도 anchor point를 기준으로 확대/축소가 이뤄진다.
예) anchor point가 왼쪽 상단에 있다면 레이어가 왼쪽 상단을 고정하고 커지고 작아진다.
anchor point 위치에 따른 모션 차이
실습
키프레임의 종류
선형 키프레임(Linear Keyframe): 시작부터 끝까지 일정한 속도로 변화하는 키프레임
- 일정한 속도로 움직여서 기계적이고 단조로운 느낌이 든다.
- 주로 단순 이동이나 정확한 타이밍이 필요한 모션에 쓰인다.
부드러운 키프레임(easy ease keyframe): 시작과 끝 속도가 부드러워 자연스러운 키프레임
- 천천히 시작해서 중간부터는 빠르게, 마지막에는 천천히 마무리 된다.
- 그래프 에디터에서는 곡선형태로 나타난다.
- 캐릭터 애니메이션이나 UI 모션에 활용하기 좋다.
감속 키프레임(easy in keyframe)
- 끝으로 갈수록 속도가 느려져서 마무리를 강조할 때 쓰기 좋은 키프레임이다.
- 그래프 에디터에서는 그래프 곡선의 끝부분이 완만한 것을 확인할 수 있다.
- 피사체의 착지나 감속, 멈춤 애니메이션에 활용할 수 있다.
가속 키프레임(easy out keyframe)
- 시작에서는 속도가 느리고 점차 빨라지는 키프레임
- 그래프 에디터에서는 그래프 곡선 시작 부분이 완만하게 표현되어있다.
- 발사, 출발, 도임 모션에 사용하기 좋다.
고정 키프레임(hold keyframe)
- 다음 키프레임까지 값이 고정되어있어 갑작스러운 변화를 표현하기 좋은 키프레임.
- 순간적인 점프 처럼 보이는 움직임을 보여주어 딱한 느낌을 준다.
- 그래프 에디터에서는 갑자기 꺾이는 수평선으로 표현된다.
- 정지 후 순간 변화가 필요하거나, 스프라이트 교체, on/off 상태 변경에 활용하기에 좋다.
모션 패스(Motion path): 키프레임을 연결한 레이어 이동 궤적으로, 레이어가 시간에 따라 어떤 경로로 이동하는지 시각적으로 나타낸다. 이때 , 이동 경로를 직접 조정하여 곡선 이동과 직선 이동 등 다양한 모션을 설계할 수 있다.
모션패스의 특징
(1) 궤적 곡선을 베지어 핸들로 변경할 수 있다.
(일러스트레이터의 path control과 같은 방식이다. 그러나 핸들을 없애거나 한 쪽만 생성하는 것은 불가능하다.)
(2) 레이어의 위치 변화를 실시간으로 확인 가능하다.
(3) 키프레임 종류와 곡선의 조합으로 가속, 감속, 부드러운 움직임을 설계할 수 있다.
모션블러: 빠르게 움직이는 오브젝트의 잔상효과
- 움직임이 조금 더 부드럽고 자연스럽게 보인다.
- 정적인 이미지보다 강한 운동감을 준다.
- 끊김 현상을 시각적으로 완화하여 움직임을 더 자연스럽게 보이게 한다.
실습을 해보면서 느낀거지만, 애니메이션을 만드는 일은 정말 힘든 일이구나 싶었따.
왜냐면 이동하는 위치까지 모두 계산한다는게 쉽지가 않은 것 같다. 차라리 마우스로 모션패스를 이동시키는게 조금 더 편할 수도 있겠다는 생각이 들었다.
디자인 감각 훈련
이번에는 영상의 조명을 주제로 영상을 분석했는데, 여기서 얻은 결론은 '영상에서 표현하고자 하는 감정을 빛으로 표현할 수 있다.' 였다.