본문 바로가기
플래시(Flash) 강좌

3-03. 모양 트윈(Shape Tween) 만들기(1)

by 리치샘 2016. 6. 14.

제3장 애니메이션 기초

03. 모양 트윈(Shape Tween) 만들어보기


    앞서 언급한 바와 같이 키프레임과 키프레임 사이의 자동 애니메이션 만들기는 즉, 트윈은 두 가지 방식이 있습니다. 하나는 앞 강의에서 살펴본 모션 방식이고, 다른 하나는 모양 방식입니다.

    여기서는 다음과 같은 [트윈 > 모양] 예제를 만들어보겠습니다.

    위의 예제를 보시면 아시겠지만 모양이 변하는 애니메이션입니다.
    이와 같이 모양이 변하는 애니에미션을 만들기 위해서는 키프레임에 있는 객체가 반드시 풀려(분리되어) 있어야 합니다.


    1) 글자 선과 면으로 풀기(분리하기)

    글자가 변형하는 예제를 만들기 위해서는 글자의 묶임 속성을 풀어 분리시켜주어야 합니다.
    글자는 입력과 동시에 입력한 글자 전체가 묶여(그룹화되어) 버리게 됩니다.

    분리를 위해서는 글자들 객체를 선택한 후 Ctrl + B(메뉴 > 수정 > 분리)를 해줍니다.
    일반 그림 객체는 한번에 분리가 되지만 글자는 다음과 같이 두 번에 걸쳐 분리를 시켜주어야 완전하게 선과 면으로 분리되게 됩니다.


    2) 키프레임 넣기

    변형에 소요될 시간을 계산한 다음 타임라인에서 필요한 수많큼의 프레임을 건너뛰어 키프레임을 넣어줍니다.
    모양 트윈의 경우는 대부분 전후 키프레임의 스테이지에 존재하는 객체의 모양이 다르므로(달라야 모양 트윈이 가능) 빈프레임 넣기(F7키 누름)를 해주어야 할 것입니다.

    변형에 4초 정도의 시간이 필요하다면 50프레임에 빈 키프레임을 넣어줍니다.


    3) 영문 글자 입력 및 분리

    50프레임의 스테이지에 영문 글자를 입력해주고 위의 1)과 같은 방법으로 분리해줍니다.


    4) 되돌아가기를 위한 키프레임 설정

    한글이 영문으로, 다시 영문이 한글로 모양이 되돌아가는 애니메이션을 만들기 위해서 다음과 같은 방법으로 작업해줍니다.

    바뀐 영문이 1초 정도 보이도록 하기 위해 10프레임 정도를 건너뛰어 60프레임에서 키프레임 넣기(F6키 누름)를 해줍니다.

     다시 한글로 변형되도록 하기 위하여 50프레임을 건너뛰어 110프레임에 빈 키프레임을 넣고(F7키 누름),
    1프레임에 있는 한글을 복사합니다.(Ctrl + C)

    110프레임을 클릭하고 붙여넣기를 합니다.(Ctrl + V)

    다시 한글이 1초 정도 보이도록 하기 위해 10프레임을 건너뛰어 120프레임에서 프레임 넣기(F5키 누름)를 해줍니다.


    5) 트윈 > 모양 처리하기

    1프레임과 50프레임 사이를 클릭하고 [속성] 창에서 [트윈 > 모양]을 지정해줍니다.

    60프레임과 110프레임 사이를 클릭하고 역시 [속성] 창에서 [트윈 > 모양]을 지정해줍니다.

    앞서의 강의에서 강조해둔 바 있습니다만, 이번 예제와 같이 전후 키프레임에 있는 객체가 분리 속성을 가지고 있으면(수세미로 보임) 트윈 방식은 "수세미 - 모양(Shape)"입니다.


    6) 저장하고 확인해보기

    저장하기(Ctrl + S)를 합니다.

    그리고 Ctrl + Enter키를 눌러 무비 만들기를 합니다.