키 프레임을 사용하여 기존 아트 워크에 애니메이션을 적용하는 방법 알아보기

이 개를 비디오 게임의 마스코트로 그렸습니다.

그리고 우리는 그를 더 눈에 띄게 사용하고 싶을만큼 그를 좋아했습니다. 애니메이션을 추가하고 싶었습니다.

 

그래서 나는 약 45 분을 보냈고 움직일 각 부분을 잘라 냈습니다. 나는 각 신체 부위를 자체 레이어에 저장하고 머리 꼭대기, 목, 무릎과 같은 부분에 빠진 틈을 메 웠습니다. 다음과 같이 보였습니다.

그런 다음 모든 레이어를 제자리로 드래그하고 타임 라인을 실행하고 키 프레임을 테스트 한 다음이 애니메이션으로 끝났습니다.

충분히 훌륭하지만 우리가하는 일에는 유용하지 않습니다. 그러나 나는 그를 UI 알림의 일부로 만들기 위해 더 복잡한 애니메이션을 만들었습니다.

 

이 다음 애니메이션은 더 적은 조각을 사용하지만 더 과장된 움직임과 약간의 전경 / 배경 전환을 사용합니다. 따라서 가르치는 데 사용할 수있는 훌륭한 작품입니다.

CLIP STUDIO PAINT에서 키 프레임으로 애니메이션

1 단계 : 설정

이미 그린 캐릭터를 작업하는 경우 새 애니메이션 파일을 만드는 것에 대해 걱정하지 마십시오. 기존 캔버스를 사용할 수 있습니다. 원본 캔버스를 백업하십시오. 원하는 경우 그림을 변경할 수 있습니다. 그런 다음 움직이는 각 조각을 잘라내어 레이어를 지정하는 작업을 수행하십시오. 누락 된 도형을 채우십시오. 애니메이션의 중요한 부분이 아닌 모든 것을 삭제하여 레이어를 단순화하십시오.

 

더 빠르고 간단한 애니메이션을위한 폴더 설정 :

 

"Dog"(또는 "Your Character")라는 이름의 폴더를 만듭니다.

캐릭터의 모든 부분을 여기에 넣으십시오.

"Dog"폴더 내에 "Head"라는 이름의 폴더를 만듭니다.

머리에 연결된 모든 조각을 그 안에 넣으십시오. (제 경우에는 "코", "모자", "귀"및 "머리"였습니다.

"Dog"폴더 내에서 "Body"라는 다른 폴더를 만듭니다.

나머지 신체 부위를 모두 넣으십시오.

폴더는 다음과 같아야합니다.

타임 라인 창을 활성화합니다.

"새 타임 라인"을 클릭하십시오.

(Clip Studio Pro를 사용하는 경우 최대 24 프레임 만 얻을 수 있습니다. 연습하기 좋은 숫자입니다. 제 애니메이션은 길이가 1 초이므로 업계 표준 인 초당 24 프레임을 사용했습니다. 잘게 자르려면 2 -초 애니메이션, 초당 12 프레임으로, 또는 4 초 길이의 애니메이션을 위해 6fps로 만듭니다.)

 

타임 라인은 모든 폴더와 레이어로 자동으로 채워 져야하며 애니메이션의 24 프레임 섹션을 둘러싼 파란색 핸들이 있어야합니다.

 

(타임 라인에는 "애니메이션 폴더"도 있습니다.이 튜토리얼에서는 애니메이션 폴더를 사용하지 마십시오. 훌륭하고 유용하지만 여기서는 혼란 스러울 것입니다.)

 

"Dog"폴더를 선택한 다음 타임 라인 창에서 "이 레이어에서 키 프레임 활성화"를 클릭합니다.

(우리가 한 것은 강아지의 모든 부분을 키 프레임 셀로 변환하는 것입니다. 지금 어떤 조각이라도 그림을 수정해야하는 경우이 강아지 폴더로 돌아가서 "키 프레임 활성화"아이콘을 다시 클릭해야합니다. 키 프레임 사용) 활성화하면 아트 브러시가 작동하지 않습니다.)

 

키 프레임을 활성화하면 개체 도구로만 작업하게됩니다.

이제 애니메이션 할 준비가되었습니다!

2 단계 : 움직이기

타임 라인에서 첫 번째 프레임을 선택한 상태에서 "Head"폴더를 선택합니다.

 

타임 라인 창 상단에있는 "키 프레임 추가"아이콘을 클릭합니다. 타임 라인에 다이아몬드가 나타나고 캔버스 주위에 파란색 핸들이 나타납니다.

 

캔버스 중심에서 머리가 목과 만나는 지점까지 회전 중심을 드래그합니다. (작은 + 기호입니다. 표시되지 않으면 "개체"도구를 사용하고 있는지 확인하십시오.)

 

커서를 파란색 테두리 바깥쪽으로 이동하여 "회전"아이콘으로 변경하여 회전을 테스트합니다. 클릭하고 드래그합니다. 고개가 자연스럽게 고개를 끄덕이면 좋다.

 

(머리는 회전하지만 귀와 모자는 고정되어있는 경우 "머리"그리기 레이어를 선택한 것입니다.)

 

머리를 아래쪽으로 돌립니다.

 

약 프레임 6에서 타임 라인을 클릭합니다.

 

머리를 위쪽으로 돌립니다. 변경할 때마다 키 프레임이 자동으로 생성됩니다.

 

타임 라인에서 "Play"버튼을 눌러 테스트하십시오.

 

약 프레임 12에서 타임 라인을 클릭합니다.

 

머리를 약간 아래로 돌리십시오.

 

약 프레임 16에서 타임 라인을 클릭합니다. 머리를 약간 위로 돌립니다.

 

약 프레임 20에서 타임 라인을 클릭합니다. 머리를 원래 위치로 되돌립니다.

 

테스트하려면 "재생"버튼을 누르십시오.

 

모자로 이동하여이 모든 단계를 다시 수행하십시오.

 

귀와 코로 이동하십시오. 회전, 테스트, 전진.

 

 

간판 위에 자연스럽게 얹힐 수있는 새 팔이 필요합니다. 키 프레임을 비활성화 한 후 다른 캔버스 또는이 캔버스에 그립니다. 또한 올바른 각도로 그려진 셔츠 슬리브가 필요합니다.

이 두 항목을 한 레이어에 함께 그릴 수 있지만 소매에서 약간의 움직임 힌트를 얻고 싶었습니다.

 

주머니에 손이 숨겨져 있던 다른 쪽 팔을 지우고 이것으로 교체했습니다. 나는 이전의 셔츠 소매를 유지하고 2 개의 셔츠 소매 이미지를 남겼습니다. 이것은 애니메이션 폴더에 대한 완벽한 기회가 될 것이지만, 대신 간단한 드로잉 스왑을 수행하는 방법을 보여 드리겠습니다.

 

강아지의 어깨를 위로 움직이게하여 팔을 올리기 시작했음을 보여줍니다.

 

어깨가 가장 높은 프레임에서 단일 애니메이션 트랙 상단의 핸들을 오른쪽에서 왼쪽으로 드래그합니다. (저에게는 프레임 # 5입니다. 이렇게하면 전체 레이어가 프레임 # 5가 사라질 때까지만 나타납니다.)

새 셔츠 슬리브가있는 애니메이션 트랙에서 반대쪽 핸들을 드래그하여 이전 셔츠 슬리브가 사라질 때 새 셔츠 슬리브가 표시되도록합니다.

3 단계 : 배경에서 전경으로 이동

좋은 크기 참조를 편리하게하기 위해 알림 표시를 계속 표시했습니다. 이제 해당 레이어를 레이어 창의 맨 위로 이동합니다. 이것은 개의 일부를 덮어야합니다.

 

"Dog"폴더에서 키 프레임을 만들고 이동하여 완전한 개체로 표시 위에 팝업되도록합니다.

 

알림 서명 레이어를 복제합니다.

 

사인 레이어 사본을 아래로 이동하여 팔과 소매 레이어 바로 아래에 있도록합니다.

 

셔츠 슬리브에서했던 것처럼 애니메이션 트랙의 핸들을 움직여서 사인 카피는 팔을 위로 올렸을 때만 나타나고 "Dog"폴더가 움직이지 않도록합니다.

 

복사본이 나타날 때 사라지도록 원래 기호에 동일한 작업을 수행하십시오.

 

표지판 사본을 원래 표지판과 똑같은 공간으로 이동합니다. 이것이 내 레이어가 끝난 방법입니다.

개의 머리 뒤에 표시되는 마지막 프레임의 경우하던 것처럼 키 프레임을 만든 다음 다음을 수행합니다.

 

가장 왼쪽 핸들을 잡고 보이지 않을 때까지 레이어 크기를 조정하는 데 사용합니다. (이미지가 병합되지 않고 축소되는 경우 개체 도구 속성 아래의 "변형"옆에있는 +를 클릭 한 다음 "가로 세로 비율 유지"를 선택 취소하십시오.)

 

타임 라인에서 앞으로 이동하고 원래 모양으로 다시 조정합니다.

 

키 프레임을 몇 개 더 추가하여 움직임을 생동감있게 만들고 바운스를줍니다.

보너스 특수 효과!

레이어 속성과 클리핑 레이어로 얻을 수있는 효과 중 일부가 정말 마음에 듭니다. 우리 작품의 대부분은 이미 폴더에 있으므로 적용하기 쉽습니다.

 

깔끔한 아르누보 스타일의 테두리를 만들기 위해 폴더를 추가하고 사인 레이어와 "Dog"폴더를 그 안에 놓았습니다. 그런 다음 레이어 속성에서 테두리 효과를 활성화했습니다.

키 프레임을 사용한 걷기 애니메이션에 대한 보너스 팁!

걷기 사이클은 꽤 어려울 수 있습니다. 다음은 몇 가지 팁입니다.

 

사이클의 마지막 위치에 첫 번째 키 프레임을 복사합니다. 모든 레이어에서이 작업을 수행하십시오.

 

먼저 발을 애니메이션합니다.

 

어깨는 엉덩이 반대쪽으로 회전합니다. 따라서 오른쪽 팔은 왼쪽 다리로 앞으로 이동하고 왼쪽 팔은 오른쪽 다리로 앞으로 이동합니다.

 

빠르게 찾을 수 있도록 전경 및 배경 레이어를 색상으로 구분합니다.

그리고 여기에 전체 작업 공간이 있습니다. 레이어와 키 프레임 배치를 잘 보려면 전체 화면으로 만드십시오.

당신에 대해서는 잘 모르지만 캐릭터가 살아나는 것을 보는 것은 설레는 일입니다. 이 튜토리얼이 제가 배우는 동안 많은 문제를 일으킨 동일한 장애물을 극복하는 데 도움이되기를 바랍니다. 질문이 있으시면 댓글로 물어보세요 ... 제가 이것을 만들면서 잘못 될 수 있고 혼란을 야기 할 수있는 모든 다른 것들을 계속 생각했지만, 그 문제를 다루고 싶지 않았습니다.