유니티 UV 텍스쳐 표정 애니메이션 정리

#. 유니티 허브 공식 커뮤니티의 '뚜벅이' 님의 글을 토대로 작성함.

캐릭터의 표정을 만들고싶은데,

모퍼를 통한 애니메이션은 매 프레임마다 오브젝트를 따로 가지고있어서 보간으로 생성하는 것이라 해서

게임에는 많이 무거울 듯한 느낌이라, 가벼운 모바일에서는 부적절하다고 판단,

카트라이더나 마비노기 등에서 사용하는 텍스쳐만 바뀌는 UV 텍스쳐 표정 애니메이션에 대해 조사하였다.

구글에서는 아무리 찾아도 자료가 없어서 유니티 커뮤니티들을 조사해봄. 위의 두개를 토대로 본문에서 설명할 것이고, 

3번째 것은 마스킹에 쉐이더까지 건드는 고급기술이라 굳이 모바일에는 필요없을 것이라 판단하여 링크만 걸어둠.

유니티 UV 텍스쳐 애니메이션 정리(외국사이트) :  http://totallysweetredhoodie.blogspot.kr/2013/07/animated-facial-textures-in-maya-and_26.html

유니티 네이버 공식 커뮤니티 : http://cafe.naver.com/unityhub/25013

눈 깜빡임에 대한 자료(외국사이트) : http://www.benjones.us/twilight-princess-eyes-breakdown/

위의 글을 토대로 테스트 해보았음.

요약하자면 표정이 될 오브젝트 부분은 따로 떼어 놓고, 머테리얼에 UV 텍스쳐 애니메이션을 걸어 주면 된다고 한다.

위의 오브젝트는 얼굴은 눈과 입을 그리지 않고 작업한다음,

그 위에 오브젝트를 하나 더 올려서 살짝 이격시켜 눈과 입을 투명하게 그린 것.

  UV가 왼쪽과 같다면

 텍스쳐도 다음과 같이 꽉채워서 그려준다.

  

Maya인것을 보니, 이 사람은 Mel이나 Expression을 써서 UV를 압축시켜 애니메이션 한 듯 하다.

이러면 너무 한쪽만 깨지게되니까 pot 형태로 텍스쳐와 스크립트를 맞추는게 나을듯.

그래서 유니티에서 테스트를 해보았다.

다음과 같은 텍스쳐를 준비해서, 기본 Material로 큐브에 씌우고 C# 코드를 적용시켰다.

사용되는 코드는 아래와 같다. 

public class FaceBlinkUV : MonoBehaviour {

public Renderer face;

float blinkTime;

float bTime;

Material faceMaterial;

Vector2 off, scale;

int frame;

void Start () {

faceMaterial = face.material;

blinkTime = 0.2f;

bTime = 0f;

scale.x = 0.5f;

scale.y = 0.5f;

  faceMaterial.SetTextureScale("_MainTex", new Vector2(scale.x, scale.y));

}

void Update () {

bTime -= Time.deltaTime;

if(bTime<=0f){

faceMaterial.SetTextureOffset("_MainTex", new Vector2(0.5f*(float)(frame%2),0.5f-0.5f*(frame/2))); 

frame++;

if(frame==4) frame=0;

bTime+=blinkTime;

}

}

}

코드를 해석해보자면, 

UV의 너비와 높이를 0.5로 축소시킨다음, 0.2초마다 UV에 Offset을 춰서 순서대로 1, 2, 3, 4번의 위치로 UV를 옮기는 것.

따라서 UV는 가득채워줘야한다.

적용하면 뷰포트에서는 위와 같이 보이지만,

실행시켜보면 1~4의 숫자가 순서대로 애니메이션 되는 것을 확인할 수 있다.

결론적으로, 이것은 오브젝트에 대해서 적용되는 스크립트기 때문에,

얼굴 오브젝트만 따로 떼져있다면, 몸이랑 하나의 UV를 사용해도 된다.

하지만 컨트롤 하기에는 텍스쳐를 분리하는게 낫다.

몸 1장, 얼굴 1장 이렇게 쓰면 될듯.

타협안으로, 기본얼굴은 그냥 UV를 포함해서 그리고, 따로 기본형을 포함한 4개의 얼굴을 담는 텍스쳐를 제작하면

포폴용, 게임용 두개로 분리가 가능할 듯 하다.

캐릭터 표정 4종을 작업한다음,

얼굴 UV를 분리한다음, 평행이동으로 바뀔수 있게 UV를 배치하였다,.