[픽셀아트] 캐릭터 디자인(4방향) 기법에 대해서 배워보자

본 게시글은 'HeartBeast'의 Pixel Art Tutorial의 내용을 다룹니다.
해당 내용의 사진에 대한 저작권은 'HeartBeast'에게 있음을 밝힙니다.

픽셀 아트의 캐릭터 디자인 기법을 배워보는 시간입니다.

제가 따로 강좌를 쓰는 것은 아니고 정확히 말하면

영상 내용을 분석하고 저의 주관적인 의견을 적은 글이라고 보시면 됩니다.

자세한 내용은 영상을 한번 보시는 것을 추천드립니다. 그럼 시작하겠습니다.

 

처음 내용에서는 캐릭터를 작업할 때 기본 모형으로 시작하는 게 좋다고 알려줍니다.

여기서 보면 직사각형에 가깝지만, 위 부분이 다른데요. 이건 머리를 표시하기 위해서 영역을 좀 더 크게 잡은 거라 하네요.

 

주변에 손, 뺨, 귀와 같은 약간의 디테일을 추가합니다.

 

머리와 몸통, 다리 그리고 발까지 영역을 구분합니다.

 

눈이나 코 같은 디테일을 추가합니다.

여우라서 추가로 귀 부분에 음영을 줬네요.

 

눈썹과 얼굴 아래쪽 절반 (입과 볼 주변) 그리고 손 부분에 밝은 톤을 줬습니다. 이렇게 밝은 톤을 준 이유는

표시하는 의미도 있지만 캐릭터의 특징을 정의하는데 의미가 있다고 하네요.

또한 손이 쉽게 보이게 하는 것은 애니메이션에 중요하다고 합니다.

추가로 캐릭터의 가독성에도 의미가 있어서 필요한 단계라고 생각이 됩니다.

 

이다음이 중요한데요 주인공을 두드러지게 하기 위해 '보색'을 사용했습니다.

여기 보시면 기본 색을 여우니까 주황으로 잡았고

티셔츠는 주황색에 대한 보색으로 파란색을 한 것을 확인할 수 있습니다.

 

좀 더 진하게 해서 음영을 표현했습니다.

주황색에는 빨간색을 더해서 진하게 만들었고

파란색은 보라색을 더해서 진한 게 만들었습니다.

 

이미지에 여기저기 픽셀을 추가해서 디테일을 살리는 실험을 많이 했다고 하네요.

그래서 이미지를 보면 눈썹 밑에 음영이 들어가 있고 또 수염을 나타내기 위해서 픽셀을 추가한 것으로 보입니다.

 

또한 망토를 넣었는데, 주인공 캐릭터이므로 장식으로 넣어주었습니다.

 

망토 기본 색은 보라색을 잡았으며 여기에 붉은색을 더해서 색을 맞췄고 하이라이트 모양을 내기 위해

밝은 톤을 사용하여 양쪽 망토 끝 부분에 느낌을 살렸습니다. 망토에 어울리는 색을 빨간색으로 결정한 이유는

이 캐릭터가 사용된 게임의 지형이 대부분 잔디(녹색) 주변이라 두드러지게 보이기 위해

즉, 보색으로 사용하였다고 합니다.

 

다음 단계로 다른 방향에서의 캐릭터 모습인데요.

위로 향하는 캐릭터부터 시작합니다.

 

정면 스프라이트를 가지고 많이 안 고쳐도 되는 게 이 방향이라서 가장 쉽다고 합니다.

 

우선은, 얼굴에 있는 많은 디테일은 없앱니다. 머리를 뒤통수처럼 느끼게 하기 위함이죠.

 

그다음에 나머지 부분을 수정합니다. 귀 뒤쪽을 나타내기 위해 귀를 조금 바꿔주고

몸을 지우고 나서 거기에 망토의 색상을 채웁니다.

 

이 두 가지 변경사항을 거치고 나서, 상당히 뒷모습처럼 보이게 되었습니다.

 

마지막으로 망토의 음영에 디테일을 주었네요, 이렇게 준 디테일은 망토가 캐릭터에 붙어있는 효과를 냅니다.

 

이제 캐릭터가 오른쪽이나 왼쪽을 향하게 해야 하는데요

여기서는 오른쪽을 향하게 한 뒤 제작하였습니다. 어느 방향이든 상관없으며 나중에는 반전을 시켜주면

다른 방향은 손쉽게 만들 수 있답니다.

 

사진에서 보면 전체적으로 캐릭터의 정면과 측면 높이를 같게 해 주었고

머리와 눈은 위치는 다르지만 같은 높이에 있습니다.

이러한 크기를 정확히 동일하게 유지하면 픽셀 위치로 각 부위를 구분하는데 도움이 됩니다.

 

또한, 같은 캐릭터처럼 느끼게 해 줍니다. 이게 중요한 게 너무 괴리감이 심하면

돌 때마다 다른 캐릭터처럼 느껴질 수 있습니다.

 

오른쪽으로 향하는 올바른 캐릭터의 모습을 갖췄으면 원근감을 고려해서 뒷다리와 뒷팔을 추가합니다.

귀 같은 경우는 측면 이미지 두 개에서 볼 수 있듯이, 귀의 뒤쪽인 (왼쪽)은 좀 더 진한 게 처리하고

음영을 아래에도 준 것으로 보입니다.

 

마지막으로 망토를 추가합니다. 현재 보이는 망토의 모습을 보여주기 위해서

망토는 캐릭터의 어깨 위를 지나 팔 위에 오도록 만들었습니다.

 

위에 말씀드렸듯이, 왼쪽 방향은 단지 만들어진 측면 방향을 좌우 반전시켜주면 됩니다.

우리가 오른쪽 방향을 만들었으니 좌우 반전하면 왼쪽 방향이 되겠죠?

 

이렇게 해서 4방향 캐릭터가 완성이 됩니다.

아직 애니메이션은 없지만, 모든 방향에서 볼 수 있는 디자인을 완성했으므로 이것을

기준을 잡고 애니메이션을 위한 도트를 작업할 때 더 쉽게 할 수 있을 거라 하네요!

 

───────────────────────────────────

이번 기법을 살펴보면서, 상당히 눈에 띄었던 게 바로 보색인데

보색은 사실 꼭 쓸 필요는 없지만 상당 부분에서 보색을 활용하고 있음을 알 수 있습니다.

애니메이션이나 디자인도 마찬가지이지요. 또, 캐릭터의 비율을 고려해서 제작하는 방식이 인상 깊었습니다.

 

그리고 캐릭터를 가독성을 올리기 위해서 작업을 해야 한다는 게 나름 신기하기도 합니다.

코드의 가독성은 알아도 디자인의 가독성은 크게 고려하지 못했네요.

픽셀아트 기법은 여기까지이며 도움이 되셨으면 합니다.