Live2D Tutorial. #3 Hello, cubism!(Part.2)

 

• Live2D Tutorial. #1 시작을 위한 준비.
• Live2D Tutorial. #2 Hello, cubism! (Part.1)
  
• Live2D Tutorial. #3 Hello, cubism! (Part.2) (현재 포스트)

---

Live2D를 입문하는 초보자를 위한 안내서

 

[오리엔테이션]
안녕하세요, 하즈란입니다.

Live2D 강의 3편으로 찾아뵙게 되었습니다.

2편을 통해서 Live2D 큐비즘 에디터에 익숙해지고 큐비즘 에디터의 기능들에 대해 어느 정도 파악을 하셨을까요?

이번 강의는 저번편의 연장선으로 큐비즘 에디터를 다뤄보되 파라미터라는 요소의 개념과 오브젝트 제어에 대해 알아보도록 하겠습니다.

---

[파라미터 알아보기.]

 

 

파라미터는 Live2D 모델을 제어하는 가장 기초에 되는 도구입니다.

파라미터 한개마다 특정한 오브젝트의 변형을 등록하고 파라미터 제어를 통해 다양한 움직임과 표현을 만들어 낸다고 보시면 됩니다.

 

파일을 생성하면 기본적으로 제공되는 파라미터 탬플릿이 있습니다.

큐비즘 에디터를 이용하는 외부 프로그램들도 해당 탬플릿을 베이스로 사용하는 경우가 많으므로 강의를 보시는 분들이 버츄얼을 만들기 위해서라면 해당 파라미터 리스트를 지우지 않고 사용하는 것을 추천드립니다.

 

이번 편에서는 파라미터의 가장 기초에 대해서 알아볼 예정이므로 해당 탬플릿은 사용하지 않습니다.

 

파라미터의 구성요소는 이름, ID, 범위, 키, 키폼 으로 이루어져 있습니다.

각각 요소에 대해 자세히 설명을 해드리자면

 

• 이름 - 사용자가 파라미터를 식별하기 용이하기 입력하는 요소입니다. 다양한 언어, 특수 문자, 공백등 큰 입력 제한이 없습니다.
• ID - 프로그램 내부에서 파라미터를 식별하기 위해 사용하는 요소입니다. 오직 영어와 숫자 _(언더바)만 입력이 가능하며 중복된 ID 사용이 불가합니다. 외부 프로그램등에서 파라미터에 접근할 때 사용하므로 짧고 간결하게 작성합니다.
• 범위 - 파라미터 슬라이더가 움직이는 범위값을 말합니다. 최소값, 디폴트, 최대값 3개의 수치를 입력을 하며 음수와 양수 입력이 가능합니다. 주로 -30~+30이나 -1~+1 혹은 0~+1와 같은 범위를 사용합니다. 사용자의 필요에 따라 입력하면 됩니다.
• 키 - 파라미터 슬라이더에서 제어를 요소입니다. 키를 움직여 파라미터의 수치를 조절합니다.
• 키폼 - 파라미터의 범위 내에서 오브젝트의 특정 변형등이 저장되는 요소입니다. 파라미터의 범위 내에서 다양하게 생성이 가능합니다.

 

파라미터의 추가요소는 반복, 블렌드셰이프 가 있습니다.

추가요소는 파라미터에 적용할 수 있는 추가적인 옵션 설정이라고 보시면 좋습니다.

 

반복 - 파라미터 범위의 최소값 혹은 최대값에 도달했을 경우 자동으로 그 반대값으로 이동하여 반복되게 시켜줍니다.

블렌드셰이프 - 파라미터를 블렌드셰이프 파라미터로 전환하는 옵션입니다. 블렌드셰이프는 셰이프 키라고도 부르며 파라미터의 경우의 수에 대해 신경 쓰지 않고 모델링할 수 있는 유용한 옵션입니다.

 

본격적으로 파라미터를 다뤄보도록 하겠습니다.

기본 제공되는 파라미터는 사용하지 않으므로 쉬프트를 눌러 일괄 선택 후 우 클릭을 통해 파라미터를 전부 삭제해 주도록 합니다.

이후 파라미터 팔레트의 하단에 + 버튼을 눌러 새로운 파라미터를 만들어 주도록 합시다.

새 파라미터 생성 창이 뜨면 파라미터의 구성요소를 지정해주시면 됩니다.

 

강의에서는 이름은 데모 파라미터 ID는 기본값인 Param 범위는 최소 -1 최대 +1 디폴트는 0으로 해서 생성을 해주도록 하겠습니다.

 

이번에는 생성한 파라미터를 수정을 해보도록 합시다.

수정을 원하는 파라미터에 커서를 대고 우클릭후 추가 메뉴가 뜨면 파라미터 편집을 클릭해 줍니다.

파라미터 편집 창에 뜨면 여기서 여러분들이 원하시는 파라미터의 구성요소를 편집할 수 있습니다.

 

간단하게 이름만 한번 바꿔보도록 하겠습니다.

---

 

[키폼 등록과 조작.]

이번에는 파라미터에 키폼을 등록하여 오브젝트를 본격적으로 조작을 해보도록 합시다.

 

파라미터의 구성요소 중 하나인 키폼은 파라미터의 범위 내에 아트 메쉬나 디포머등 변형이 가능한 오브젝트 요소의 변형 모습이 등록된 포인트입니다.

 

이미지를 보시면 샘플 파라미터가 3개가 있습니다.

각각 파라미터에 키폼이 없는 경우에는 키가 검정색으로 되어 있으며

키폼이 등록된 경우에는 키가 빨간색으로 되며 키폼이 등록된 포인트 빈 원형이 있으며

키폼이 등록되어 있고 키폼에 등록된 오브젝트가 선택된 경우에는 키폼이 등록된 포인트에 녹색 불이 들어오게 됩니다.

 

이러한 차이점을 보고 파라미터의 상태를 구분하시면 될 것 같습니다.

 

이번에는 키폼을 등록을 해보도록 하겠습니다.

변형을 원하는 오브젝트를 선택 후 해당 오브젝트를 제어할 파라미터를 더블클릭합니다.

이폼 편집 창이 뜨면 파라미터의 범위내에서 원하는 포인트를 클릭 해 키폼을 생성합니다.

생성 완료 후 ok를 눌러 창을 닫으면 키폼 등록이 완료되었습니다.

 

원하는 경우 키폼을 소수점 단위로 등록이 가능합니다.

키폼 편집 창에서 눈금에 맞추기 옵션을 해제 하면 소수점 단위로 키폼을 클릭해서 생성 할 수 있으며

하단의 키폼 리스트에서 직접 수정이 가능하기도 합니다.

 

키폼을 꼭 더블 클릭 후 키폼 편집 창에서 편집하지 않고도 빠르게 등록 할 수 있는 방법도 있습니다.

파라미터 팔레트 상단에 있는 프리셋 버튼을 이용해 빠르게 2점 / 3점을 등록하거나 등록된 모든 키폼을 제거 할 수 있습니다.

해당 기능은 키폼 편집 창에도 동일하게 존재하므로 필요한 경우 사용하면 됩니다.

 

파라미터의 키폼과 관련한 추가적인 기능에 대해서 알아보도록 하겠습니다.

파라미터 추가 기능의 경우에는 파라미터 슬라이더를 클릭하면 메뉴가 뜨는데 거기서 확장 메뉴를 통해 선택을 할 수 있습니다.

선택된 파라미터의 키폼에 등록된 오브젝트를 일괄적으로 선택할 수 있는 선택 기능입니다.

키폼을 대량으로 수정하거나 제거해야 하는 경우 유용하게 활용할 수 있습니다.

 

파라미터의 키폼의 최저 최대값을 서로 반전해야 하는 경우 사용하는 반전 기능입니다.

 

파라미터의 키폼의 값끼리 교체해야 하는 경우 사용하는 조정 기능입니다.

확장 메뉴 탭에서 조정을 클릭 값의 조정 창이 뜨면 변경 후의 값 항목에서 서로 원하는 위치의 값으로 교체할 수 있습니다.

단, 값은 1대 1 교환 방식이며 한쪽으로 다른 값을 모두 몰아넣는 등의 방식은 불가합니다.

 

추가로 반전 기능과 다른 점이라면 반전 기능의 경우 파라미터의 중심값을 기준으로 대칭되게 일괄적으로 변경하는 반면

조정 기능의 경우 각 키폼끼리 값을 교체하는 방식입니다.

 

이미 기존에 등록된 파라미터 키폼을 다른 파라미터로 교체하고 싶은 경우 사용하는 변경 기능입니다.

확장 메뉴 탭에서 변경을 클릭 후 파라미터 변경 창이 뜨면 변경을 원하는 파라미터를 선택 후 ok를 누르면 파라미터가 변경이 완료가 됩니다.

 

이번에는 키폼 작업 시 주의해야 될 점을 알아보도록 하겠습니다.

센스가 좋은 신 분들이라면 지금까지 키폼을 등록한 모든 경우가 파라미터의 최저와 최댓값에 하나씩은 꼭 있다는 사실을 아셨을 텐데요.

큐비즘 에디터에서 오브젝트가 키폼이 없는 구간을 벗어나게 되면 오브젝트가 사라지는 등의 오동작이 발생하게 됩니다.

 

두 번째 주의사항인 경우의 수 조합입니다.

한 오브젝트는 동시에 여러 파라미터에 키폼 등록이 가능합니다.

다만, 키폼은 개별적인 값을 가지고 있으므로 다른 키폼과 조합 시 새로운 값으로 취급을 하게 됩니다.

 

간단하게 설명을 해보자면

파라미터 키폼의 조합은 사칙연산 마냥 + - 등의 정해진 값이 출력되지 않고 모든 값을 직접 지정을 해주셔야 합니다.

값이 A가 될수도 B가 될수도 있습니다.

 

그러므로 3개의 키폼을 가지고 있는 파라미터가 2개가 있다면 3*3=9개의 조합

3개가 있다면 3*3*3=81개의 조합이 생기게 됩니다.

 

이렇기에 가능하다면 파라미터는 최대 3개를 권장하며 가능하면 2개를 추천합니다.

그렇기에 만약 오브젝트를 여러 파라미터로 제어를 하고 싶다면 일부 변형을 상위 부모 디포머에게 변형을 분배하거나

블렌드 셰이프 파라미터를 사용하는 것을 권장드립니다.

---

 

[오브젝트 제어하기.]

키폼 등록과 조작하는 방법을 알아보았으니 본격적으로 오브젝트를 제어해 보도록 하겠습니다.

 

오브젝트를 제어하는 과정입니다.

키폼을 등록하는 과정까지는 이미 해보았으므로 오브젝트를 변형하고 실전과 같은 오브젝트 제어 파라미터를 제작하는 방법에 대해 알아보도록 하겠습니다.

 

오브젝트를 파라미터에 등록 시 생성되는 키폼에는 아무런 값이 없는 상태가 아닌

등록할 때의 오브젝트 값이 모두 적용된다는 걸 기억하고 있으면 앞으로 변형 과정의 이해에 도움이 될 거라 생각합니다.

 

실제로 오브젝트를 제어해 보도록 하겠습니다.

 

먼저 오브젝트를 선택하여 파라미터에 키폼을 등록해 줍니다.

이후 원하는 키폼으로 파라미터 키를 위치시켜줍니다.

오브젝트를 원하는 형태로 변형을 하게 되면 해당 값이 키폼에 반영이 되게 됩니다.

 

팁. 원하는 키폼을 우클릭을 하면 스냅이 적용되어 정확하게 키폼 값 위치로 키가 이동하므로 상당히 편리합니다.

 

처음 생성 시 있던 A값 그리고 변형된 B값 두 개의 다른 키폼값이 생기게 됩니다.

다른 두개의 키폼 사이의 공간은 에디터가 자동으로 보간 처리를 하게 되므로 여러분은 키폼 값만 지정해 주면 자연스럽게 A와 B 값 사이가 전환이 되는 변형을 만들 수 있게 됩니다.

 

각 오브젝트에서 제어할 수 있는 요소들에 대해서 알아보도록 하겠습니다.

큐비즘 에디터에서의 오브젝트는 아트 메쉬와 디포머(회전/변형) 총 2가지가 존재합니다.

 

대부분의 제어 요소는 캔버스 내에서 직접 변형이 가능하며 아트 메쉬의 경우 그리기 순서(드로우 오더)를 추가적으로 제어 할 수 있다는 점이 있습니다.

 

제어 요소에 따라서 캔버스 영역에서 직접 제어가 가능한 요소가 있고

해당 오브젝트를 선택했을때 나오는 인스펙터 팔레트에서 제어가 가능한 요소가 있으므로 어떤 요소가 인스펙터에서 제어 가능한지 참고하시면 될 것 같습니다.

 

 

[효율적인 오브젝트 제어 방법.]

파라미터에 키폼 등록과 수정 그리고 변형을 하는 방법을 알아보았으니

마지막으로 그걸 한번에 여러개를 작업해야 하는 경우에 효율적으로 제어하는 방법에 대해 알아보도록 하겠습니다.

 

실제 작업을 하다보면 많이 마주하게 되는 경우와 유사한 제어 환경을 준비해보았습니다.

 

한개의 오브젝트가

X, Y축 움직임 / 회전 / 크기 조절 / 변형

의 다양한 제어가 구현 가능하도록 해보겠습니다.

 

가장 먼저 첫 번째로 제어에 필요한 파라미터 리스트를 생성합니다.

원하는 움직임 구현을 위해 어떤 변형이 필요한지 생각하며 그에 맞게 파라미터를 생성해 주면 됩니다.

 

움직임 X / 움직임 Y / 회전 / 크기 조절 / 변형

총 5개의 파라미터를 생성해 주도록 하겠습니다.

 

이제 생성한 파라미터 각각 변형을 만들어 가면 됩니다.

하지만 무작정 만들게 된다면 앞서 주의사항에서 언급했던 경우의 수처럼 엄청난 노동을 필요로 하게 되므로 부모 디포머에 변형을 분배해서 작업하는 방법으로 진행합니다.

 

저번 편에서 언급한 디포머의 종속 개념을 되짚어 보면서 영향 관계를 생각하며 작업 순서를 정해보도록 합시다.

작업 순서의 경우 대체적으로 작고 디테일한 변형을 맨 처음(자식)으로 작업하며 이후 점점 더 변형의 범위가 큰 것을 이후(부모)에 작업하는 것이 일반적입니다.

 

그렇기에 가장 변형의 정도가 작은 변형을 맨 처음 만들고 이후 회전과 크기 조절을 그리고 가장 변형의 정도가 큰 움직임을 마지막으로 만드는 형태로 진행해 보겠습니다.

 

가장 먼저 변형입니다.

별도의 디포머를 사용하지 않고 아트 메쉬 오브젝트를 직접 파라미터에 등록을 해 변형을 적용하겠습니다.

강의에선 간단하게 모서리를 살짝 찌그러트리는 모습을 했지만

실전에선 눈을 감는 변형이라 생각하시면 좋을 것 같습니다.

 

이후 회전과 크기 변형을 적용하기 위해 아트 메쉬의 부모로 회전 디포머를 하나 생성해 주도록 합니다.

 

회전 디포머를 회전, 크기 파라미터에 각각 등록하여 회전하는 움직임과 확대 축소하는 움직임을 키폼에 등록해 줍니다.

 

이때 파라미터 키폼 등록에 정해진 규칙은 없습니다만,

키의 진행 방향과 오브젝트의 진행 방향이 일치하는 것이 작업에 효율적이므로 특별한 경우가 아니라면 이렇게 작업하는 것을 추천드리며

파라미터의 최저값이 키 슬라이더의 좌측에 해당하므로 값이 작아지거나 축소등은 좌측 키폼에 값이 커지거나 확대등은 우측 키폼에 등록하는 것을 권장드립니다.

 

회전과 크기 움직임을 작업했다면 정상적으로 작동하는지 확인을 해보도록 합시다.

아마 정상적으로 작동하지 않으실 겁니다.

 

키폼 등록에서 언급하고 간 경우의 수 때문에 그렇습니다.

3개의 키폼을 가진 파라미터 2개를 동시에 사용했으므로 3*3=9개의 경우의 수가 발생하게 되는데

회전과 크기가 동시에 적용되는 값은 작업을 하지 않았기 때문입니다.

 

이번에는 이 값을 만들어 보도록 하겠습니다.

 

키폼의 조합이 새로운 값이 취급되는 이유가 사칙연산 마냥 정해진 규칙을 통해 값이 고정되지 않고 작업자가 값을 지정해줘야 하기 때문이라도 설명을 드렸는데

지금과 같이 단순히 사칙연산 마냥 모든 값을 서로 더한 값을 자동으로 생성시켜주는 기능이 있습니다.

 

바로 네 모서리 폼을 자동 생성 라는 도구입니다, 간단하게 네 모서리 생성 도구라고 부르기도 합니다.

기본 단축키 Ctrl+4

메뉴 트리로는 파라미터 팔레트 - 햄버거 메뉴 - 네 모서리 폼을 자동 생성

를 통해서 도구를 켜시면 자동 보간을 사용할 파라미터 2개를 선택 후

원하는 키폼 포인트를 지정하고 ok를 눌러줍니다.

 

이후에 회전과 크기 제어 파라미터를 동시에 사용하였을 때 정상적으로 오브젝트가 변형이 되는지 체크해봅니다.

문제가 없다면 다음 작업으로 계속해서 진행해 보도록 하겠습니다.

 

이번에는 방금 생성한 회전 디포머의 부모로 새로운 회전 디포머를 생성해 주도록 합니다.

생성된 회전 디포머에는 움직임 X, Y의 변형을 적용해 주도록 합니다.

 

이후 아까와 동일하게 네 모서리 생성 도구를 이용해 키폼이 중첩되었을 경우 정상 동작을 하는지 체크합니다.

 

여러분들이 정상적으로 작업을 따라오셨다면

3*3*3*3*3=243개의 변형을 적용할 수 있는 오브젝트를 제작 완료하였습니다.

 

이렇게 부모 디포머에게 일부 변형을 배분하고 네 모서리 자동 생성 도구를 이용해 작업의 양을 줄이며 다양한 변형을 적용할 수 있는 오브젝트를 빠르고 간편하게 만들 수 있습니다.

 

지금 만든 단순한 오브젝트의 변형이 실전과 어디가 비슷하냐? 라는 의문을 표하신다면 버츄얼 아바타의 눈을 떠올려 보시면

눈도 감고, 동공은 상하좌우로 움직이며 고개에 맞춰서 같이 변형이 되기도 합니다.

 

엄청 복잡하고 대단해 보이는 버츄얼 아바타 또한 결국 본질은 작은 변형을 조합하고 쌓아나가는 기반으로 제작됩니다.

강의를 따라 오신 여러분들은 그 시작을 끊으셨다고 봐도 좋습니다.

 

 

이번편의 내용은 여기까지입니다.

 

다음편에는 버츄얼 일러스트를 이용하여 눈 깜빡임을 만들어보는 본격적인 모델링 강의로 찾아뵙도록 하겠습니다.

감사합니다.

 

Live2D 라이선스 구매를 고려 중이신가요?
' UKSQPRDNRN ' 코드를 입력하셔서 라이선스 비용의 9%를 절감해 보세요!*

*연간 플랜, 3년 플랜 대상이며 인디/비즈니스 플랜 모두 활용 가능합니다.