캐릭터 애니메이션에 키프레임 적용

2,332

Mr.Nobody1111

Mr.Nobody1111

주의사항: 이 튜토리얼은 PC에서 제작되었습니다. 클립스튜디오를 PC에서 사용하지 않으시면 레이아웃이 저와 다를 수 있습니다.

애니메이션을 만들어 본 적이 있다면 그것이 얼마나 어려운지 아실 것입니다.

Clip Studio Paint 내에서 가장 일반적인 애니메이션 방법은 프레임별입니다.

프레임별 작업은 일련의 그림을 만들어 순차적으로 재생하는 방식으로 작동합니다.

 

유일한 방법은 아닙니다

 

Clip Studio에는 또 다른 옵션이 있습니다.

소개: 키프레임!

 

키프레임은 매우 다양한 옵션입니다. 본질적으로 프레임별보다 낫지는 않지만 다음과 같이 학습할 가치가 있는 고유한 장점이 있습니다.

- 키 프레임은 사용 및 학습이 쉽습니다.

- 많은 작업을 절약할 수 있습니다.

- 프로젝트 중간에 편집이 쉽습니다.

가장 유용한 점은 키프레임이 프레임별로 원활하게 결합될 수 있다는 것입니다. 하나만 사용하거나 동시에 둘 다 사용하도록 선택할 수 있습니다.

 

이것이 흥미롭다면 이 튜토리얼이 여러분을 위한 것입니다!

여기에서는 키프레임을 시작하는 방법과 개인 작품에 키프레임을 적용하는 방법을 알려드리겠습니다.

키프레임 소개

키프레임 사용 방법을 보여드리기 위해 키프레임을 사용하여 이 빨간 공을 재현하는 방법에 대한 단계별 가이드를 만들었습니다.

1단계 - 새 빈 프로젝트를 만드는 것으로 시작한 다음 새 레이어를 만들고 캔버스 왼쪽에 빨간 공을 그립니다.

2단계 - 타임라인 만들기

3단계 - 빨간 공 레이어에서 키프레임을 활성화합니다.

4단계 - 키프레임 생성 버튼을 찾으되 아직 누르지는 마세요.

대신 옆에 화살표가 있는 상자를 클릭하세요.

 

 

그러면 드롭다운 메뉴가 열립니다. 이 메뉴 내에서 부드러운 보간으로 설정되어 있는지 확인하세요. 키프레임 생성 아이콘이 위 그림의 아이콘과 일치하면 올바르게 완료된 것입니다.

5단계 - 타임라인 시작 부분에 첫 번째 키프레임을 만듭니다. 그러면 타임라인에 다이아몬드 모양이 생성되는데, 이것이 키프레임입니다.

6단계 - 타임라인을 중간쯤으로 이동합니다.

이제 개체 도구를 찾아 이를 사용하여 빨간 공을 오른쪽으로 드래그하세요.

올바르게 완료되면 타임라인에 두 번째 키프레임이 생성됩니다.

7단계 - 첫 번째 키프레임을 클릭합니다. 그러면 키프레임이 강조 표시됩니다. 이제 동일한 키프레임을 마우스 오른쪽 버튼으로 클릭하여 메뉴를 열고 복사를 선택하세요.

이제 타임라인의 끝으로 이동합니다. 마지막 프레임을 마우스 오른쪽 버튼으로 클릭하여 메뉴를 다시 열고 붙여넣기를 선택합니다.

 

올바르게 완료했다면 타임라인에 3개의 키프레임이 있어야 합니다.

이제 애니메이션이 완료되었습니다! 이제 재생을 누를 수 있으며 다시 왼쪽으로 이동하기 전에 오른쪽으로 이동합니다.

키프레임 작동 방식

방금 일어난 일을 설명하려면 개체 도구의 특수 메뉴를 확인해야 합니다.

 

빨간 공 레이어를 선택한 다음 개체 도구를 선택합니다. 개체 도구의 도구 속성 아래를 보면 아래 제공된 스크린샷과 유사한 메뉴가 표시됩니다.

 

개체 도구 아래에 메뉴가 표시되지 않으면 공 레이어가 선택되어 있는지 확인하세요. 개체 도구와 키프레임이 활성화된 레이어를 선택하지 않으면 이 메뉴가 표시되지 않습니다

단순화를 위해 키프레임에 대해 2개의 용어를 만들었습니다. 경로.

은 레이어의 특정 측정항목입니다. 메뉴의 위에서 아래로 다음과 같습니다.

X 및 Y 위치 (캔버스에서 레이어는 어디에 있습니까?)

배율 비율 (레이어가 원래 크기와 비교하여 얼마나 크거나 작습니까?)

 

 

가로세로 비율 유지 (너비와 높이가 서로 독립적으로 변경될 수 있나요?)

회전 각도 (이 레이어가 회전되었습니까, 아니면 비스듬히 있습니까?)

회전 중심 (레이어는 어느 점을 중심으로 회전합니까?)

레이어 불투명도 (레이어가 얼마나 잘 보입니까?)

키프레임이 만들어지면 Clip Studio는 레이어의 을 잠급니다. 키프레임은 직접 변경하지 않는 한 변경되지 않으며, 클립스튜디오의 경로 기준으로 사용됩니다.

 

경로는 2개의 키프레임 사이의 Clip Studio 계산입니다.

Clip Studio는 마지막으로 본 키프레임과 다음 키프레임 간의 을 비교합니다. 경로는 키프레임을 참조로 사용하며 키프레임에 대한 변경 사항으로 생성되는 사이를 적극적으로 변경합니다.

 

키프레임의 작동 방식은 다음과 같습니다.

키프레임을 변경하면 이 변경됩니다.

을 변경하면 경로가 변경됩니다.

경로를 변경하여 중간을 변경합니다.

중간을 변경하여 애니메이션을 변경합니다.

 

예를 들어 빨간 공을 연결해 보겠습니다.

우리가 공을 바꾸었을 때, 우리는 공이 오른쪽으로 가게 만들었습니다.

제대로 만들면 Clip Studio의 경로가 오른쪽으로 변경됩니다.

Clip Studio가 경로를 오른쪽으로 변경하면 그 사이가 오른쪽으로 이동합니다.

 

 

키프레임 유형

마지막으로 키프레임 유형이 있습니다.

 

키프레임 생성 옆에는 키프레임 유형 메뉴가 있습니다. 이는 애니메이션에 큰 영향을 미칠 수 있습니다.

 

 

이러한 키프레임 유형은 레이어의 과 아무 관련이 없습니다.

대신 Clip Studio가 경로를 계산하는 방식에 영향을 미칩니다.

이 3개의 모양에는 복사하여 붙여넣은 동일한 키프레임이 있습니다. 그러면 왼쪽에서 오른쪽으로 움직이게 됩니다. 유일한 실제 차이점은 (모양과 색상을 제외하고) 키프레임의 유형입니다.

 

홀드 보간을 사용하는 삼각형

선형 보간법을 사용한 사각형

부드러운 보간을 사용하는 원

 

 


축하해요! 이제 키프레임을 사용하는 방법을 알았습니다.

 

다음 단계는 이 정보를 적용하는 방법을 배우는 것입니다.

다음 섹션에서는 내 프로젝트에 키프레임을 적용하는 방법을 보여 드리겠습니다.

배경의 키프레임

모든 캐릭터는 어딘가에 존재하기 때문에 배경이 필요합니다. 예술의 배경은 접근하기 어려울 수 있으며 애니메이션의 경우 더욱 그렇습니다.

애니메이션화할 자신의 캐릭터 외에도 이제 처리해야 할 배경도 생겼습니다.

 

배경에 키프레임을 고려해보세요!

 

 

이 예에서는 키프레임만 사용하여 기차에서 자고 있는 남자의 장면을 애니메이션으로 만들었습니다.

이는 4개 부분으로 나누어졌습니다:

남자와 기차

레일

건물의 그림자

하늘

 

하늘은 움직이지 않기 때문에 키프레임이 없습니다.

기차가 일정한 속도로 움직이기 때문에 레일과 건물은 선형 키프레임을 사용합니다(또한 반복하기가 더 쉽습니다). 추가 레이어의 경우 레일이 건물보다 창에 훨씬 더 가깝기 때문에 건물보다 레일을 더 빠르게 만들었습니다.

 

남자와 기차는 선형 키프레임을 사용하여 위아래로 바운스합니다. 리니어는 투박해서 기차를 탈 때 부딪히는 데 적합하다고 생각합니다.

코미디용 키프레임

간단하게 코미디 단편을 만들고 싶다면 키프레임이 탁월한 선택입니다.

 

아래는 거의 전체를 키프레임으로 애니메이션한 YouTube 단편입니다.

 

 

나는 의도적으로 그 남자를 움직이지 않게 남겨두었습니다. 왜냐하면 그가 실제로 걷고 있는 모습을 애니메이션화하기가 더 어렵고, 그가 종이를 오려낸 것처럼 미끄러지도록 하는 것이 개인적으로 재미있기 때문입니다.

 

또한 키프레임을 사용하여 텍스트에 애니메이션을 적용했습니다. 여기에서는 시리얼, 상자, 그릇과 함께 화면에서 슬라이드하도록 합니다. 묘한 매력을 주는 동시에 묘한 서사 역할도 해준다.

 

물음표는 불투명도에 대한 키프레임을 사용하여 애니메이션화되었습니다. 분위기를 바꾸기 위해 깜박이는 윤곽선과 음악 차단과 함께 여기에서 사용합니다. 우유가 있다고 말하는 대신 이제 우유가 어디 있는지 묻습니다. 그리하여 우유를 얻기 위한 인간의 여정이 시작됩니다.

계획을 위한 키프레임

다음은 키프레임과 프레임별이 함께 작동하는 예입니다.

썸네일에서 떨어진 불쌍한 수액을 프레임 단위로 애니메이션화하였고, 키프레임을 활용하여 기획하였습니다.

저는 필요한 모든 도면을 작성하여 대략적인 애니메이션으로 시작했습니다. 이 경우에는 다음과 같습니다.

- 화면 상단에서 떨어지는 소녀

- 그녀가 땅에 미치는 영향

- 공중으로 튀는 그녀

- 지면과의 두 번째 충격

이러한 그림이 있으면 키프레임을 사용하여 미묘한 동작을 사용하여 그림을 더욱 애니메이션화합니다.

 

그런 다음 레이어의 불투명도를 낮추고 레이어 위에 애니메이션을 적용합니다.


키프레임은 다양한 용도로 사용되므로 여기에 모든 내용을 나열했는지 의심스럽습니다.

아마도 이 글을 읽고 나면 키프레임이 여러분의 일부 프로젝트에서 자리를 찾을 수도 있을 것입니다.

아님.

 

도움이 되었기를 바랍니다,

 

읽어 주셔서 감사합니다

댓글

신착

공식 신착