1-09. 플래시 애니메이션의 원리

제 1장 플래시 시작하기

1-09. 플래시 애니메이션의 원리

1. 트윈(Tween)

앞서 말씀드린 애니메이션의 원리는 고전적인 것입니다.
이와 같이 프레임마다 약간의 변화를 가해서 일일이 한 장씩의 그림을 그려주어야 한다면 이는 예삿일이 아닐 것입니다.




플래시에서는 이러한 수고를 덜어주는 '트윈(Tween)'이라는 방식이 있어 시간과 노력을 절감시켜줍니다.
즉, 한 프레임에서 그림을 하나 그려주고 몇 프레임이 떨어진 곳에 변형이 완료된 그림을 넣어준 다음 그 사이를 플래시가 알아서 그려주도록 하는 기능입니다.
트윈은 Between의 준말로 생각하시면 쉽게 개념이 파악될 것으로 생각됩니다.

다음 그림과 같이 첫 번째 프레임에 파란 동그라미를, 마지막 프레임에 빨간 네모를 그려준 후 트윈 명령을 주면 색상 변화를 포함해서 플래시에서 중간 과정을 자동으로 그려주게 되는 것입니다.

2. 트윈의 두 가지 방식

첫 프레임과 마지막 프레임 사이를 자동으로 만들어주는 트윈에는 두 가지 방식이 있습니다. 이는 객체의 묶임 속성에 따라 [모션]과 [모양] 둘 중 하나를 선택하여야 합니다.

묶여있는 객체가 있는 두 키프레임 사이의 트윈은 [모션],
묶여있지 않은 객체가 있는 두 키프레임 사이의 트윈은 [모양]으로 해주어야 합니다.


그리고 하나의 레이어에는 하나의 객체만이 있어야 합니다.
두 키프레임의 객체가 다른 속성을 가져서는 안됩니다. 즉, 한 쪽은 풀림, 한쪽은 묶임이 되면 안됩니다.
트윈이 잘못되거나 미완성인 경우는 타임라인의 두 키프레임 사이에 점선이 표시됩니다.


<잘못된 혹은 미완성 트윈 표시>
모양의 경우 (옅은 연두색 위에 점선)	모션의 경우 (옅은 청색 위에 점선)

3. 개체 묶임(그룹)과 풀림(분리)의 구분

스테이지의 개체가 묶인 것인지 풀린 것인지를 구분하는 방법은 간단합니다.
도구에서 화살표 도구로 개체를 눌러봤을 때 다음 그림과 같이 망점이 보이면 풀림, 하늘색 네모 테두리가 보이면 묶임 속성을 가진 것입니다.

풀림

묶임

풀림 속성을 가진 객체는 선이나 면이 분리되며, 모양의 변형이 가능합니다.
묶임 속성을 가진 객체는 선과 면으로 분리되지 않으며, 모양은 기존의 틀을 가진 상태에서 가로 세로의 비율 조정과 회전 정도만 가능합니다.

심볼로 등록을 해주면 객체는 자동적으로 묶임 속성을 가지게 됩니다.

[새 기능] 객체 드로잉

이전 버전에서 네모나 동그라미 그리기 도구로 그림을 겹쳐 그리면 겹쳐진 부분이 합쳐져서 한덩어리가 되어 버리는 현상이 있었습니다.

플래시8에서는 네모와 동그라미 그리기 도구의 옵션에 [객체 드로잉] 단추가 추가되어서, 이 단추를 누른 상태에서 객체를 그리면 각각의 객체가 묶여진 형태로 그려지게 됩니다.
 

[새 기능] 객체 애니메이션

CS4에서는 타임라인의 키프레임을 이용하지 않고 객체 자체를 변형 또는 이동시킬 수 있는 기능이 추가되었습니다.

이 경우 그리기 도구를 이용하여 객체를 그리되 객체 드로잉 상태로 그려주어야 합니다.
그런 다음 객체 위에서 마우스 오른쪽 단추를 눌러 [타임라인 효과 > 변형/전환]에서 둘 중 하나를 선택하면 아래 그림과 같은 문답 상자가 나오게 됩니다.


이 문답상자에서 항목별로 원하는 값을 입력 혹은 지정해주면 애니메이션이 만들어지게 됩니다.
[미리보기 업데이트] 단추를 눌러 움직임이나 변형을 미리 볼 수도 있습니다.