안녕하세요 여러분, 제 튜토리얼에 오신 것을 환영합니다!!

 

이 튜토리얼에서는 애니메이션 아바타 또는 리깅 모델을 위한 캐릭터 아트를 만드는 간단한 단계를 보여드리겠습니다!!!

이 튜토리얼은 2개 부분으로 나뉩니다.

 

첫 번째 부분에서는 애니메이션 아바타의 캐릭터 아트를 만드는 방법을 보여드리고,

두 번째 부분에서는 Clip Studio Paint(Pro/Ex)에서 아바타를 애니메이션화하는 방법을 보여드립니다.

또한, 아트를 다른 애니메이션 소프트웨어로 내보내어 게임 스프라이트나 Vtuber 모델과 같은 대화형 아바타를 위한 2D 리깅 모델을 만들 수도 있습니다.

 

이 튜토리얼에는 해당 파일 정리 프로세스도 포함되어 있습니다.

시작하자!!

비디오 튜토리얼

이 튜토리얼의 비디오 버전

1부 : 아바타 모델 만들기

애니메이션 아바타를 만드는 기본은 간단합니다.

캐릭터를 여러 부분으로 분할하고 이동하여 애니메이션을 만듭니다.

이를 수행하는 기존 방법은 캐릭터를 그린 다음 부분을 잘라내고 편집하는 것입니다.

대신 각 부분을 따로 그리면 부분 분할을 위한 평면화가 작업을 더 수월하게 하는 데 도움이 됩니다.

이 튜토리얼에서는 이러한 과정을 보여드리겠습니다.

1단계 : 명확한 디자인 만들기

정면도와 기본적인 스탠딩 포즈로 아트를 스케치합니다.

아트는 추적 프로세스를 위해 세부 사항이 명확해야 합니다.

선택 사항: 드로잉 프로세스에서 색상 참조로 사용할 스케치도 색칠했습니다.

머리 모델을 사용하여 스케치를 도울 수 있습니다.

머리 모델은 [소재 패널 > 3D > 머리]에 있습니다.

(이 패널은 메뉴 [창>소재:3D]에서 액세스할 수 있습니다.)

선택 사항: [하위 도구 세부 정보] 패널의 [얼굴 특징] 탭에서 값을 조정하여 디자인에 맞게 얼굴 특징을 사용자 정의할 수 있습니다.

새 레이어를 만들고 머리 모델 위에 스케치합니다.

머리 모델은 세부 사항이 명확하여 얼굴 모양, 귀, 눈의 위치를 참고할 수 있습니다.

2단계: 부분 분할을 위한 계획

디자인이 끝나면 아트를 여러 부분으로 나눕니다.

 

부분 분할의 핵심:

"애니메이션이 적용될 곳에서 분할" 및 "중앙선에서 시작, 큰 것부터 작은 것까지"

참고: 이 튜토리얼에서는 먼저 몸통 부분을 완성한 다음 *얼굴 특징을 작업합니다.* 혼란을 피하기 위해서요.

머리 (얼굴 + 머리 뒤)와 몸부터 시작하세요.

선택 사항:

머리를 얼굴과 뒷머리 두 부분으로 나누었습니다.

이렇게 하면 머리 돌리기 애니메이션이 더 자연스럽게 보입니다.

중앙선을 중심으로 추가 세부 정보를 나누고 나타나는 순서대로 나열합니다.

일부 부분은 대칭적이고 일부는 비대칭적임을 알 수 있습니다.

사이드뱅이나 트윈테일처럼 반대쪽에 거울 버전이 있는 부분도 있습니다.

이런 부분을 한 번 그린 다음, 복사하고 뒤집어서 다른 쪽을 만들 수 있습니다.

부품 목록을 완성하면 각 부품에 대한 새 폴더를 만듭니다.

이 튜토리얼에서는 작업 과정을 보여주기 위해 유형별로 색상 라벨을 설정했습니다.

가장 편안한 방식으로 설정할 수 있습니다.

참고 : 폴더 이름에 '-'를 사용하여 부품 그룹을 식별합니다. (예: 'hair-twintail-L')

3단계 : 부품 그리기 # 본체

작업 공간 설정

색상 참조로 사용할 색상이 있는 스케치를 복사합니다.

또한 [하위 뷰] 패널을 사용할 수도 있습니다

[레이어 속성] 패널에서 스케치 레이어의 색상 변경

이제 대칭 자를 사용할 시간입니다!!

 

용지 레이어를 선택합니다.

[자]로 가서 [대칭 자]를 선택합니다.

옵션을 설정합니다.

[줄 수]: 2,

[선 대칭]: 체크됨,

[스냅 각도]: 90,

 

캔버스에 자를 그리면 자는 90도로 스냅됩니다.

모든 레이어에 표시되도록 설정:

눈금자 아이콘을 마우스 오른쪽 버튼으로 클릭하고 [모든 레이어에 표시]**

[Object] 도구로 눈금자를 선택하고 캔버스의 중앙에 정렬

 

[Tool Property] 패널에서 [Center X] 옵션을 캔버스 너비의 절반으로 설정할 수 있습니다.

또는 정렬/분배 패널(Clipstudio 2.0+)로 정렬할 수 있습니다.

메시 변환을 사용하여 눈금자 선에 맞춰 일부 부분을 조정합니다.

[편집>변환>메시 변환]

캔버스가 준비되었습니다. 이제 그림을 그릴 시간입니다!!

부품 그리기#1 : 대칭 부품

얼굴 부분부터 시작해 봅시다.

선화에 대한 새 벡터 레이어 만들기

선택 사항이며, 선화에 래스터 레이어를 사용할 수도 있지만, 벡터 레이어는 이후 프로세스에서 편집/변경하기가 더 쉽습니다

[특수 눈금자에 스냅]이 활성화되어 있는지 확인하세요.

캔버스에 그리면 눈금자 선의 양쪽에 표시됩니다.

참고: 브러시/지우개가 자와 함께 작동하지 않는 경우 [하위 도구 세부 정보] 패널의 [수정] 탭에서 [스냅 사용]을 확인하세요.

색상 채우기:

새 벡터 레이어 만들기 및 영역 닫기를 위해 선을 그립니다.

얼굴 부분에는 머리카락 선을 그립니다.

새로운 래스터 레이어 만들기

[채우기] > [다른 레이어 참조]로 색상 채우기

[도구 속성] 패널에서 옵션 [여러 개 참조]를 [폴더]로 설정합니다.

그리고 [벡터 경로까지 채우기] 옵션을 활성화합니다.

헤어 라인의 벡터 레이어 삭제

그런 다음 투명 픽셀 잠금 및 부분의 음영 처리

첫 번째 부분이 완료되었습니다!

선택 사항: 스케치 레이어를 보고 다른 부분을 작업할 수 있도록 폴더 레이어 모드를 [소프트 라이트]로 변경합니다.

파트 그리기#2 : 비대칭 파트

비대칭 부분의 경우

특수 눈금자에 스냅 옵션을 비활성화하고 부분을 그립니다.

파트 그리기#3 : 거울 파트

왼쪽 앞머리를 뒤집어 오른쪽 앞머리를 만들 수 있습니다

파트 그리기를 마치면 파트 폴더를 선택합니다.

그런 다음 사각형 선택 영역을 만들고, 파트와 캔버스 영역의 너비를 덮습니다.

부품 폴더를 복사하려면 떠 있는 메뉴에서 [복사 및 붙여넣기] 아이콘을 클릭하세요.

떠 있는 메뉴에서 [크기 조정/회전]을 클릭하고 [도구 속성] 패널에서 [수평 뒤집기] 아이콘을 클릭합니다.

폴더 이름 변경 및 사용자 정의 세부 정보 추가

[대칭 자 팁]

어떤 부분을 그리기 위해 또 다른 특수한 자를 필요로 할 수 있으며

완료되면 대칭 자는 더 이상 작동하지 않습니다

동시에 하나의 특수 눈금자만 스냅할 수 있기 때문에

새로운 특수 눈금자를 만들면 이전 눈금자는 비활성화됩니다.

 

활성화하려면 [개체] 도구로 눈금자를 선택하고 눈금자의 스냅 아이콘을 클릭합니다.

모든 부분이 완성되면 모든 부분을 선택하고 [레이어 모드]를 [일반]으로 다시 변경합니다.

어떤 부분의 딱딱한 모서리를 알아볼 수 있습니다.

수정하려면, [레이어] 패널의 [마스크] 아이콘으로 마스크를 만듭니다.

그런 다음 [소프트 에어브러시]로 투명한 부분을 칠합니다.

4단계: 얼굴 부분 그리기

헤어 스타일과 의상으로 부분을 나누어야 하는 신체와 달리

항상 동일한 기본 구조가 있습니다.

추가 부분(혀 또는 별도의 동공 층 등)을 추가할 수도 있습니다.

하지만 올바른 층 순서인지 확인하세요

스케치 레이어를 맨 위로 이동하고 얼굴 부분에 대한 폴더 생성

얼굴의 반만 덮는 [사각형] 선택 영역을 만든 다음, 스케치에서 마스크합니다.

대칭 자로 얼굴을 그릴 때 덜 혼란스러울 것입니다.

부품을 그리면 완성된 부품에서도 결과를 볼 수 있습니다.

팁:

Clip Studio 3.0 사용자의 경우

메시 변환에서 여러 지점을 선택하여 양쪽에서 함께 조정할 수 있습니다.

 

참고: 미러 위치에서도 지점을 선택해야 합니다.

[클리핑 문제]

아바타 애니메이션을 위한 대부분의 애니메이션 소프트웨어에는 클리핑 마스크 기능이 있습니다.

그러나 때로는 소프트웨어에 따라 사용하기가 더 복잡할 수 있습니다.

 

애니메이션 소프트웨어에 더 적합한 방식을 조사해야 할 수도 있습니다.

입을 그리려면 입 선과 입 안쪽을 그립니다.

입 라인을 복사해서 아랫입술 폴더에 넣고,

그런 다음 안쪽 입 부분을 덮을 정도로 피부를 칠합니다.

얼굴이 완성되면 레이어 폴더를 얼굴 레이어 폴더 위로 이동합니다.

투명 또는 부드러운 지우개로 레이어 마스크에 페인트를 칠하면 앞머리를 반투명하게 만들 수 있습니다.

일반적으로 왼쪽과 오른쪽 눈은 별도로 애니메이션화됩니다.

왼쪽과 오른쪽 눈 부분을 나누려면:

레이어 폴더를 선택하고 눈 위에 선택 영역을 만든 다음

플로팅 메뉴에서 [잘라내기 및 붙여넣기] 버튼을 클릭합니다.

폴더 이름을 바꾸면 이제 모든 부분이 완성되었습니다!!

5단계: 파일 정리

아바타 아트가 준비되면 다른 애니메이션 소프트웨어로 내보내거나 Clip Studio Paint에서 애니메이션을 적용할 수 있습니다. 일부 소프트웨어는 내보내기 전에 각 부분의 레이어를 병합해야 할 수 있습니다. 나중에 부분을 편집하려는 경우 불편할 수 있습니다.

 

 

(참고: 애니메이션 과정에 Spine 2d를 사용합니다. 다른 소프트웨어에서는 다른 결과가 나올 수 있습니다.)

 

Clip Studio의 [파일 개체] 기능은 부분을 편집 가능하게 유지하는 데 도움이 될 수 있습니다(별도의 파일로) 그리고 내보내기 과정에서 매번 레이어를 병합할 필요가 없습니다!!

파일을 준비합시다.

 

먼저, 파일에서 파트 폴더를 제외한 모든 것을 삭제합니다.

(예: 용지 레이어, 스케치 레이어, 참조 등)

레이어 폴더를 파일 객체로 변환:

레이어 폴더를 마우스 오른쪽 버튼으로 클릭 > [파일 객체 > 레이어를 파일 객체로 변환]

영역을 [도면 영역]으로 설정하고 파일을 저장합니다.

 

이제 해당 부분이 외부 파일에 저장됩니다.

팁: [빠른 액세스] 패널에 내보내기 메뉴를 두면 변환 시간을 절약할 수 있습니다.

모든 폴더를 파일로 변환합니다.

파일 이름은 기본적으로 폴더 이름이 됩니다.

참고: 애니메이션 소프트웨어에 .psd 형식(포토샵 문서)이 필요한 경우 [다른 이름으로 저장..] 메뉴로 저장하면 됩니다.

(뭔가를 편집해야 하는 경우 Clip Studio에서 .psd 파일에서 편집할 수 없습니다. .csp 파일에서 편집한 다음 다시 psd로 내보내면 됩니다)

부분을 편집하려면 [개체] 도구로 선택합니다.

그런 다음 [도구 속성] 패널에서 [파일 열기]를 클릭합니다.

파트 파일을 저장하면 자동으로 메인 파일에 업데이트됩니다.

 

이제 아바타를 애니메이션으로 만들 준비가 되었습니다.

파일 구조가 깔끔하고 이름이 명확합니다!!

파트 분할 아트는 일반적으로 게임이나 스트리밍 아바타의 대화형 모델을 위한 리깅 방법(스켈레톤)으로 애니메이션화됩니다.

동적 모델이 필요하지 않다면,

클립 스튜디오 페인트에서 애니메이션을 간단히 만들어 비디오나 GIF 애니메이션으로 내보낼 수도 있습니다!!

2부 : 클립 스튜디오 페인트로 아바타 애니메이션 만들기

[레이어 키프레임]을 사용하여 아바타 애니메이션을 만들 수 있습니다.

프레임별 애니메이션으로 얼굴 표정을 애니메이션화하는 것이 더 쉽습니다.

얼굴 특징 부분을 레이어 폴더에 넣습니다.

얼굴 표정 폴더를 제외한 모든 레이어를 선택하고 [크기/회전] 아이콘을 클릭합니다.

[도구 속성] 패널에서 모드를 [기울이기]로 설정합니다.

그런 다음 위쪽의 제어점을 옮겨 원래 위치로 되돌립니다.

타임라인 패널을 엽니다([창 > 타임라인])

 

프레임 속도: 8 및 재생 시간: 24로 새 타임라인을 만듭니다.

(이 프레임 양은 Clipstudio 페인트 Pro 버전과 호환됩니다)

이번에는 모든 레이어를 선택하고 [타임라인] 패널에서 레이어 키프레임을 활성화합니다.

빨간색 탭은 현재 활성화된 프레임을 보여줍니다.

첫 번째 프레임에서 [키프레임 추가] 버튼을 클릭합니다.

참고: 키프레임 아이콘의 색상은 보간 유형에 따라 다릅니다.

일정한 이동 속도에는 선형을 사용하고, 지수 속도에는 매끄럽게 사용할 수 있습니다.

그리고 프레임에서 개체의 위치를 고정하려면 고정합니다.

[도구 속성 패널]에서 [개체 도구]로 부분을 선택하면 모서리 위치에 [변환] 옵션이 나타납니다. 이것은 이전 단계의 모든 부분을 비틀어서 만든 것입니다.

조절 가능한 코너로 부품을 더욱 자유롭게 조절할 수 있습니다.

조정 전에 애니메이션을 디자인합니다.

이 튜토리얼에서는 루프 애니메이션으로 윙크 포즈를 만들어 보겠습니다.

애니메이션을 시간 프레임에 매핑할 때,

게시물은 시작과 윙크 위치에만 설정해야 합니다.

프레임 1에서 시작 포즈 조정

참고: 몸부터 시작해서 나중에 다른 부분을 옮깁니다.

모든 객체에 대한 종료 키프레임 추가

모든 레이어를 선택하고 마지막 프레임을 클릭한 다음 키프레임을 추가하여 루프를 만듭니다.

애니메이션을 멈추게 합니다.

프레임 7에서 모든 레이어에 대한 키프레임을 만든 다음, 정지 프레임에 대한 포즈를 설정합니다.

포즈를 마치면 키프레임을 복사하여 다음 애니메이션을 중지합니다.

클릭하고 드래그하여 모든 키프레임을 여러 개 선택한 다음

키프레임을 마우스 오른쪽 버튼으로 클릭하고 복사합니다.

모든 레이어를 선택하고 프레임 13으로 이동하여 붙여넣습니다.

거의 완료

마지막 키프레임을 프레임 19로 옮기면

이제 캐릭터 움직임이 디자인과 동일합니다.

애니메이션 물리학

애니메이션 물리 효과를 추가하여 더욱 생동감 있는 움직임을 만들어 보겠습니다!

지금은 옷과 머리카락이 캐릭터 움직임과 함께 모두 함께 움직이고 있습니다...

 

하지만 실제로는 부착물 객체가 더 느리게 움직이는 것을 멈추게 하는 관성 효과가 있습니다. 애니메이션에 이 효과를 추가하면 더욱 자연스럽게 보일 것입니다.

움직임이 끝나는 프레임에 더 많은 움직이는 효과를 추가합니다.

프레임 1~7에 움직임이 있습니다. 프레임 7에 더 많은 움직이는 효과를 추가합니다.

프레임 13에서 19까지 또 다른 움직임이 있습니다.

프레임 19에도 더 많은 움직임 효과를 추가합니다.

프레임 19의 키 프레임은 프레임 1과 동일했으며 애니메이션은 루프 상태입니다.

프레임 19에 조정이 있으므로 애니메이션은 더 이상 루프 상태가 아닙니다.

 

수정하려면 프레임 1의 모든 키 프레임을 복사하여 마지막 키 프레임에 붙여넣습니다.

 

 

이 조정을 통해 캐릭터가 움직이지 않는 프레임에서도 머리카락이 계속 움직이게 됩니다.

[루프 갭]

애니메이션에는 루프 사이에 작은 정지 갭이 있습니다. 마지막 키 프레임이 프레임 23의 끝에 있기 때문입니다.

삭제하려면 키 프레임을 프레임 24의 끝으로 이동해야 합니다.

 

이렇게 쉽게 이동할 수 있습니다.

[bouncing]

애니메이션에 튀는 효과를 추가하면 더 자연스러운 모습이 됩니다.

 

관성 효과 키프레임 사이에 객체가 반대 방향으로 움직이거나 회전하는 키프레임을 삽입합니다.

팁: 움직임 위치를 너무 많이 조정해서 애니메이션이 깜빡거리는 것처럼 보이면,

객체를 다시 조정하는 대신 키프레임 사이의 간격을 넓힐 수 있습니다

얼굴 표정

얼굴 표정은 [애니메이션 폴더]로 더 쉽게 추가할 수 있습니다.

 

모든 레이어를 선택하고 [레이어 키프레임]을 비활성화하면 부분이 초기 위치에 있게 됩니다.

얼굴 표정 폴더에서 모든 좌우 눈 부분 병합(홍채/동공 제외),

입 레이어 래스터화

편집한 얼굴 부분을 폴더에 넣어주세요

폴더를 복사하고 [메쉬 변환]으로 새로 그리거나 부분을 조정합니다.

나는 3가지 얼굴 감정을 만들었습니다

얼굴 표정 폴더 안에 새 [애니메이션 폴더]를 만든 다음

모든 얼굴 감정 폴더를 그 안으로 옮깁니다.

모든 레이어를 선택하고 레이어 키프레임을 다시 활성화하면 키프레임이 다시 나타납니다.

얼굴 표정 레이어 폴더를 확장하면 애니메이션 폴더가 표시됩니다.

[+] 아이콘으로 폴더 옵션을 확장하면 [cel]에 대한 타임라인이 표시됩니다.

마우스 오른쪽 버튼을 클릭하고 키프레임에 할당할 면을 선택합니다.

완료되었습니다!!

제 작업 과정과 애니메이션 기술이 여러분의 프로젝트에 유용하기를 바랍니다!!

애니메이션을 재미있게 만들고 다음 튜토리얼에서 뵙겠습니다!!