언리얼 애니메이션
이재홍 네오플 테크니컬 아티스트 ©INVEN 김찬휘 기자

  • 주제: 언리얼 카툰 렌더링을 활용한 2D 애니메이션 제작기
  • 강연자 : 이재홍 네오플 테크니컬 아티스트
  • 발표분야 : 비주얼아트 & 사운드
  • 권장 대상 : 테크니컬 아티스트, 3D 모델러 및 애니메이터
  • 관심태그 : #카툰 렌더링 #워크플로우 자동화


  • [🚨 강연 주제] 이 세션은 약 3년간 '던전앤파이터' 인게임 컷씬 및 프로모션 영상을 제작하며 축적한 경험을 바탕으로, 3D 특유의 위화감을 없애고 2D 셀 애니메이션의 감성을 완벽히 재현하는 언리얼 엔진 기반 재패니메이션 스타일 카툰 셰이더 구현기이다. 아티스트의 작업 피로도를 낮추고 결과물 예측의 정확도를 높이기 위해 3ds Max, Maya, Substance Painter 등 다양한 DCC 툴과 엔진 간의 비주얼을 실시간으로 일치시키는 셰이더 동기화 파이프라인 구축 과정과 실무 카툰 렌더링 노하우를 공유한다.

    장르명이었던 '서브'에서 이제는 각광 받는 장르로 거듭난 '서브 컬처' 게임에서 가장 많이 사용되는 기법은 다름 아닌 '툰 셰이딩(Toon Shading)'이다. 3D 그래픽이지만, 2D 애니메이션 감성도 놓쳐서는 안되는 만큼 자연스레 툰 셰이딩에는 많은 노력과 고민이 투자되게 된다.

    툰 셰이딩에 기반한 게임을 개발하고 싶은 개발자들을 위해 네오플 이재홍 테크니컬 아티스트는 툰 셰이딩 개발에서 겪었던 고충과 어떤 점을 챙기면 좋을지에 대해 노하우를 공유하는 시간을 가졌다.

    나의 툰 셰이더가 어색한 이유는?


    언리얼 애니메이션
    이 TA는 참고 자료로 바이올렛 에버가든과 같은 2D 애니메이션을 많이 참고했다고 말했다 ©INVEN 김찬휘 기자

    이 TA는 초창기 자신의 툰 셰이더가 3D 특유의 어색함을 버리지 못하는 이유를 열심히 찾았다고 말하며 그 이유에 대해 '텍스처의 과도한 존재감'과 '칙칙한 그림자'를 꼽았다. 텍스처로 그려진 근육 등에 셰이더의 암부가 덧입혀지면서, 3D 모델 위에 명암이 그라데이션으로 '그려져 있다'는 느낌을 주었고, 기본 셰이더에서는 어두운 부분에 무채색 그림자가 단순하게 곱해지면서 탁한 색감이 발생했다는 것이 이 TA의 분석이다.

    그는 "명부와 암부를 단순히 나누는 것만으로는 3D 모델 위에 그라데이션이 그려져 있다는 느낌을 지울 수 없다"고 말하며 이를 해결하기 위해 레퍼런스로 '바이올렛 에버가든'과 같은 고퀄리티 2D 애니메이션을 참고하여 작화를 분석했음을 전했다.

    그러면서 도출해 낸 답이 질감 묘사의 제한, 자연스러운 암부와 그림자, 적화 밀도를 높이는 선과 다채로운 색감에 집중했음을 이야기했다.

    질감 묘사의 제한을 통해 그라데이션을 자제하고 투톤 혹은 쓰리톤으로 명암을 단순화하는 작업을 진행했으며, 어두운 영역의 색상과 그림자가 분리되지 않고 자연스럽게 이어질 수 있도록 했다고 설명했다. 또 질감을 단순화한 대신 머리카락, 옷깃 등에 복잡한 라인을 넣어 디테일을 올리고 단순한 검은색 그림자가 아니라 부위별(얼굴, 머리카락, 옷 등)로 아티스트의 의도에 맞춘 맑고 다채로운 셰이드 전용 색상을 적용했음을 설명했다.

    언리얼 애니메이션
    사료들을 참고하여 개선한 아트, 2D 느낌을 잘 함유한 3D 모델링 느낌이다. ©INVEN 김찬휘 기자

    빛, 선, 그림자의 완벽 제어 기법


    언리얼 애니메이션
    툰 셰이딩에서 중요한 것은 빛, 선, 그림자를 어떻게 잘 통제해서 애니메이션 느낌을 주냐는 것이다. ©INVEN 김찬휘 기자

    이 TA는 빛, 선, 그림자 세 가지 영역으로 나누고 이를 제어하는 고도화 작업에 돌입했다. 우선 빛의 제어를 위해 텍스처 분리와 월드 노멀맵 활용에 들어갔다. 명부와 암부가 이질적으로 분리되는 현을 막기 위해, 기본 조명에서 방향 정보만 받아 '가짜 라이트'를 생성했다. 그리고 빛을 계산하는 시점에 흑백의 AO(Ambient Occlusion) 텍스처를 미리 더한 후, 마지막 단계에서 컬러를 입히는 방식을 택했다. 이렇게 하면 실시간 조명과 텍스처가 자연스럽게 합쳐진다는 것이 이 TA의 설명이다.

    또한 베이스 텍스처와 셰이드 텍스처를 완전히 분리하여, 그림자 영역에 무채색이 아닌 아티스트가 지정한 고유의 색상이 발현되도록 했다. 특히 얼굴의 명암이 각도에 따라 미워지는 현상을 방지하기 위해, 메시의 형태와 무관하게 명암을 직접 조각할 수 있는 '수작업 월드 노멀맵'을 적용하여 2D 특유의 예쁜 음영을 만들어냈다.

    이 TA은 툰 셰이더에서 선명한 라인 랜더링을 유지했던 나름의 노하우와 G-버퍼의 재발견에 대해서도 이야기했다. 던파 모바일 프로모션 영상 제작 중 뎁스 버퍼의 정밀도가 낮아져 선이 깨지는 경우가 있었는데 이를 해결하기 위해 파라미터를 활용해 씬 뎁스 값을 거리에 따라 보정하는 로직을 추가하여 크기와 거리에 상관없이 선명한 라인을 유지해 냈음을 강조했다.

    또, 이 TA은 물리 기반 렌더링(PBR) 시스템에서 카툰 렌더링 시 전혀 사용하지 않는 G-버퍼의 '스페큘러(Specular) 채널'을 커스텀 ID 맵으로 재활용했음도 언급했다. 앞머리 메시에만 특정 스페큘러 값을 부여하고, 포스트 프로세스에서 이를 감지해 앞머리 영역에서만 눈썹 라인을 그리도록 한 것이다. 더 나아가 소벨(Sobel) 필터로 헤어 경계 마스크를 추출해 앞머리와 맞닿는 부분의 눈썹 라인만 살짝 지워줌으로써, 머리카락이 얇고 투명해 보이는 극도의 디테일까지 완성했다.

    이 부장은 그림자의 제어에 대해 이야기하며 포스트 프로세스와 메탈릭 채널의 활용에 대해 설명했다. 가짜 라이트를 사용하면 오브젝트 간의 그림자가 생기지 않아 캐릭터가 배경과 겉도는 문제가 생기는데 이를 해결하기 위해 최종 렌더링 결과물과 조명이 적용되기 전의 베이스 컬러 차이를 계산해, 조명에 의해 어두워진 '그림자 영역'만 포스트 프로세스 단계에서 따로 추출해 냈다고 전했다. 여기에 G-버퍼의 서브서피스(Subsurface) 채널에 저장해 둔 셰이드 컬러를 덮어씌워 깊이감을 더했다고 덧붙였다.

    또한 2D 작화 특유의 '디테일 그림자'를 강제하기 위해 '메탈릭(Metallic) 채널'을 커스텀 ID로 활용했다고도 이야기했다. 헤어는 빨간색, 얼굴은 노란색으로 메탈릭 값을 부여한 뒤, "현재 픽셀이 노란색이고 바로 위 픽셀이 빨간색이면 그림자를 그려라"라는 강제 규칙을 포스트 프로세스에 설정했다. 이를 통해 빛의 방향과 완벽히 독립된, 정교하고 국소적인 2D 그림자 연출이 가능했음을 전했다.

    상상의 영역을 최대한 줄였다, 파이프라인의 혁신


    언리얼 애니메이션
    각종 툴을 조정하고 개선하며 파이프라인의 혁신을 꾀하기도 했다. ©INVEN 김찬휘 기자

    이 TA는 "결과물을 엔진 내에서만 확인 가능하다면, 아티스트는 결과물을 나름 지례 짐작 해야하고 그로 인한 스트레스가 자연스레 동반되게 된다"라고 말하며 네오플 팀이 이를 어떻게 완화해 냈는지도 공유했다. 그 결과로 아티스트들의 주력 툴인 DCC 소프트웨어 안에서 엔진과 유사한 최종 룩을 실시간으로 프리뷰할 수 있도록 파이프라인을 완전히 뜯어 고쳤다고 언급했다.

    그는 주요 개선 사항으로 모델러를 위한 3D 맥스 환경 개선, 애니메이터를 위한 마야 워크플로우 최적화, 그리고 텍스처 아티스트를 위한 서브스탠스 페인터 포팅을 꼽았다. 모델러를 위한 3D 맥스 환경 개선으로 언리얼 머티리얼 에디터의 핵심 로직(라이트, AO, 베이스 컬러, 림, 아웃라인)을 분석해 공용 HLSL 셰이더로 변환한 뒤 맥스에 이식했다. 덕분에 불필요한 질감 표현 로직은 과감히 제거하여 가볍게 만들었고, 모델러들은 맥스 뷰포트에서 빛과 그림자의 영향을 실시간으로 보며 형태를 빚을 수 있게 되었다.

    애니메이터를 위한 마야 워크플로우 개선으론 기존에는 마야에서 작업한 뒤 언리얼로 익스포트해 라인이 깨지는지 확인하고, 문제가 있으면 다시 마야로 돌아가는 비효율적 작업의 연속이었다면, 맥스와 동일하게 HLSL 셰이더를 마야 문법에 맞춰 이식하고, 애니메이터가 직접 뎁스의 강도나 라인 두께 등을 조절할 수 있는 '미니 툴'까지 제공했다. 이 TA는 이 덕분에 "렌더링 방식의 차이로 노멀 라인까지 완벽히 구현할 순 없었지만, 뎁스 라인만으로도 작업 효율은 상승했다"라고 전했다.

    서브스탠스 페인터 포팅의 경우, PBR 렌더링에 최적화된 서브스턴스 페인터는 툰 셰이더 작업을 하기에 몹시 불편한 점을 고려하여 HLSL 셰이더를 GLSL로 변환해 페인터에 포팅했다. 이를 통해 특정 라인을 지우는 흑백 마스크를 페인터 내에서 실시간으로 확인하며 칠할 수 있게 되었고, 툰 스타일의 림라이트를 메탈릭 채널을 응용해 직관적으로 제어할 수 있게 만들었다. 더 나아가 복잡하게 쪼개진 텍스처 셋을 엔진 규칙에 맞춰 자동으로 패킹하고 익스포트하는 시스템도 구축했다.

    이 TA는 발표를 마치며, 네오플 팀의 앞으로의 비전을 공유했다. 목표는 손으로 그린 듯한 2D 애니메이션의 감성을 비슷하게 나마 구현하는 것이라 밝혔다. 특히 아티스트가 까다로운 얼굴 노멀맵을 쉽게 직접 그릴 수 있는 환경을 제공하고, 프로모션 영상의 스케일이 커짐에 따라 배경 셰이더 역시 2D 애니메이션 스타일에 맞춰 전면 업그레이드할 예정임을 시사했다.

    언리얼 애니메이션
    이 TA는 네오플 팀의 앞으로의 비전을 소개하며 발표를 마무리했다. ©INVEN 김찬휘 기자