[Android] [CEDEC 2016 번역] 데레스테 개발비화 1편 - 3D 그래픽 기술

[BP_Lord]

※ 해당 게시글은 CEDEC 2016에서 cygames 개발진이 강연한 내용의 번역입니다.

2편 - 3D 캐릭터 모델링으로 이어집니다.

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

  본 레포트는 CEDEC 2016에서 있었던 ‘아이돌마스터 신데렐라 걸즈 스타라이트 스테이지 제작 – 테크니컬 편, 다양한 기종의 스마트폰에서 5명의 아이돌이 활약하는 라이브의 뒷모습 (60fps 리듬게임 개발 비화) –의 강연을 서술하였다.
  기술적인 내용이 많아 3D 그래픽의 기본적인 지식을 습득한 상태가 아니면 이해하기 조금 어려울 수 있지만, 데레스테 개발진의 노하우가 엿보이는 내용이므로 부디 읽어줬으면 한다.

 

 

 

 

◆ 게임 엔진으로 Unity를 선택한 이유는?

 

  데레스테는 iOS와 안드로이드 기종을 지원하며, 기기 성능에 맞추어 그래픽을 묘사하는 방향을 세분화하여 60fps를 유지할 수 있게 만들었다. 이것을 어떻게 실현시키는 것이 가능하였는가, Cygames의 시니어 엔지니어인 카나이 마사루가 해당 주제로 강연을 시작하였다.

 

Cygames 시니어 엔지니어 카나이 마사루

 

  개발이 시작될 당시 팀에서는 Unity와 Cocos2d-x를 미들웨어 후보로 선정하고, 각각 1개월의 기간 동안 평가를 거쳐 Unity를 선정하였다고 한다. 이 과정이 후에 엄청난 도움이 되었다고 언급하였다.
  한 가지 예를 들면, ‘(본편에서 사용되는) 이미지 이펙트들은 그 1개월 안에 만들어진 것들이 대부분’이라고.

 

 

미들웨어의 선택에 고려한 것을 정리한 슬라이드. 특히 60fps 유지는 리듬게임에 필수불가결한 요소이다.

 

 

 

카나이 엔지니어는 Unity와 Cocos2d-x 검증 단계에서 포인트가 되는 요소를 몇 개 간추렸다. 데레스테가 리듬게임인 이상, ‘60fps 항시 유지는 결코 포기할 수 없는 부분이었다.’고 말하였다.
  게다가 개발에서 ‘그래픽에서 아이돌이라는 매력을 느낄 수 있도록’이라는 목표를 설정하고, ‘고스펙의 스마트폰에서는 성능에 걸맞는 고품질의 그래픽을 표현하자’는 목표를 처음부터 세웠다고 한다.

  평가는 2D 리듬게임 파트와 3D 파트로 진행하였고, 60fps가 실현 가능한지 어떠한지는 미들웨어가 제공하는 프로필 뿐만이 아니라, SoC 제조사가 제공한 프로필도 적극적으로 활용함으로써 쉐이더의 부하를 세세히 다룰 수 있었다고 하였다.

  60fps를 유지하기 위한 조정 요소로써 ‘이미지 이펙트’라는 항목이 언급되어 있었는데, 이것은 카나이 엔지니어의 아이디어였다고 한다. ‘스마트폰에서 그래픽을 매력적으로 보이게 하기 위해서는 블룸 효과와 피사계 심도를 사용하면 효과적이지 않을까’하고 생각하며, 개발에 참여하게 되었을 때부터 강력하게 주장하였다고.
  만에 하나를 위해 설명해두자면, 블룸 효과라는 것은 빛이 넘쳐흐르듯이 보이게 만드는 효과이며, 피사계 심도(Depth of Field)는 초점이 맞지 않는 부분이 흐릿하게 보이게 만드는 효과이다.

 

 

 

3D 그래픽의 표현에 부하가 높음을 고려하여, 3D 파트와 리듬게임 파트를 나누어 평가를 진행하였다.

이러한 시행착오의 결과, 데레스테에서는 Unity를 사용하게 되었다고 한다. Cocos2d-x는 소스 코드가 공개된 Unity에 없는 이점이 있지만, Unity의 개발 효율과 현재 진척도를 바로 확인할 수 있으며, 사내에서 노하우가 축적된 점을 고려하여 선택을 했다고.
  그리고 무엇보다 결과물의 상태가 Unity 쪽이 더욱 높았다는 게 결정적인 요인으로 작용하였다.

 

 

 

미들웨어로 Unity가 선택된 이유. 덧붙여서 디메리트로 언급된 스파이크(スパイク)란,

메모리의 가비지 콜렉션 등으로 인해 순간적으로 fps가 하락하는 현상을 가리킨다.

 

 

 

 

 

◆ 60fps를 유지하기 위한 최적화 노력

  그런데, 시행착오의 단계에서 카나이 엔지니어는 ‘서멀 스로틀링 문제에 부딪혔다’고 하였다. 스마트폰과 태블릿PC에서는 부하가 걸려 SoC가 과열되는 경우, 클럭과 전압을 낮추어 발열을 스스로 억제하는 기능이 있다. 일반적으로 이것을 서멀 스토틀링이라 부른다. 그런데 이것이 미들웨어 검증단계에서 이미 문제로 언급되었던 것.
  카나이 엔지니어는 서멀 스로틀링에 대하여 ‘구체적인 해결책을 갖고 있는 사람은 없지 않느냐’는 생각과 동시에, ‘적절한 비주얼을 적절한 타이밍에 터뜨려주는 게 최선의 해결책일 것이다.’라는 견해를 보였다.

  이렇게 Unity를 사용하여 개발이 진행된 데레스테는 스마트폰에서 60fps를 유지하기 위하여, 저성능의 스마트폰에서도 즐길 수 있도록 이펙트를 간소화시킨 ‘3D 경량’과, 하이엔드 스마트폰을 위한 고품질 설정인 ‘3D 표준’을 준비하여 세분화한 것이 특징이다.

 

 

데레스테에는 3D경량과 3D표준이라는 두 가지의 3D 그래픽 선택 옵션이 준비되어 있다.

선택권을 주어 60fps 유지를 가능하도록 하였다.

 

  iPhone 시리즈의 경우 기기 가짓 수도 적을 뿐더러 성능도 기종에 따라 명확하게 차이가 나므로, iPhone 5 이전의 제품들은 3D 경량으로, iPhone 6 이후는 3D 표준으로 체크되도록 설정되어 있다.

  한편, 기종도 많고 성능도 제각각인 안드로이드의 경우, 그렇게 단순히 설정하기란 너무 어려웠다. 그리하여 앱에서 SoC를 자체적으로 판단한 기준으로 성능을 조절하는 방식을 택하였다. 다만, 유저가 직접적인 조작을 하지 않는 MV 모드에서는 ‘프레임 영향을 주는 것들이 대거 사라지므로, 성능이 비교적 낮은 기종이라도 3D 표준으로 즐길 수 있게끔 하였다.’고 언급하였다.

3D 경량과 3D 표준의 구분. iPhone에서는 기종별로 판별할 수 있지만,

안드로이드는 SoC로 판별하여 3D 그래픽의 품질 설정을 구분한다.

  그럼 여기서 카나이 엔지니어가 특별히 신경썼던 이펙트를 짚고 넘어가보자.
  아래에 게재된 2장의 슬라이드는 이펙트의 차이를 표시한 샘플이며, 왼쪽이 3D 경량이고 오른쪽이 3D 표준이다. 같은 부분이지만 왼쪽은 피사계 심도와 블룸이 제거되어 있고, 오른쪽은 충실히 재현되어 있다. 자세히 설명하자면, 스테이지 바로 앞측(이미지에선 아랫쪽)의 바닥과 계단이 만나는 곳을 보면 알아차리기 쉽다.

 

3D 경량(왼쪽)과 3D 표준(오른쪽)의 이펙트 차이를 표시한 슬라이드. 이미지의 왼쪽 아래를 확대해보면 차이가 두드러진다.

3D 표준은 피사계 심도를 사용하여 약간 흐릿하게 보이는 것이 특징.

  이것을 어떻게 구현하였는가. 먼저 1프레임을 1/4로 축소시켜 뿌옇게 만든 것과 Depth Texture를 사용하여, 사진에서 광도를 추출한 것과 합성을 시키면 위 그림과 같이 나온다고 하였다.
  3D 경량에서는 이펙트 처리를 할 수 없는 이유도 여기에 있다. Unity에서는 Depth Texture를 생성하기 위해 1패스 분의 렌더링 처리가 필요한데, 이것이 저성능 SoC에서는 과부하의 원인이 된다는 것.
  더욱이, 이 블룸 효과는 스테이지 뒤쪽 모니터 영상에도 사용되고 있다.

피사계 심도와 블룸 효과가 표현되는 과정. 방법 자체는 일반적으로 쓰이는 것.

Depth Texture를 얻기 위해 1패스 분의 처리가 필요하기 때문에 3D 경량에선 이펙트를 생략.

  라이팅은 리얼 타임으로 구현되는 것은 아니라고 하며, 환경광(Ambient Light)을 ‘타임라인 툴’이라는 툴로 제어하고 있을 뿐이라고 한다. 타임라인 툴로 미세하게 조정함으로써 마치 스포트라이트 같은 효과도 표현할 수 있었다고.
  또한, 캐릭터 아웃라인(외곽선)은 culling면을 반전시켜 구현한다는 툰 렌더링의 고전적인 방법을 사용하고 있다. 그리고 아웃라인의 색과 폭은 정점 컬러로 제어하고 있다고 밝혔다.

라이팅은 비교적 간단하게, 아웃라인 표현은 고전적인 방법으로 성능 부하를 최소화.

실제로 표현된 라이팅과 아웃라인의 예시.

효율성은 낮을지 몰라도 캐릭터를 매력적으로 표현하였기 때문에 신경쓰면 진다.

   그러나, 캐릭터 아래에 표현되는 그림자는 페이크, 즉 라이팅을 반영하여 산출한 결과물이 아니라 모의적인 계산으로 나타난 것을 채용한 모양이다. 카나이 엔지니어는 이에 대해 두 가지의 이유를 들어 설명하였다. 하나는 쉐도우 맵핑 방식으로는 Depth Texture가 필요하므로 3D 경량에서는 구현을 못한다는 것. 때문에 ‘그림자가 없으면 입체감이 떨어진다’는 생각에, 3D 경량이라도 그림자는 나오게끔 일부러 그랬다고.
  또 하나는, 스테이지 위에서는 조명이 수도 없이 많기 때문에 쉐도우 맵핑으로는 정확한 재현이 불가능하기 때문.

그림자는 3D 경량, 3D 표준에서 모두 페이크로 처리.

쉐도우 맵핑은 사용하지 않는다.

  이외에도 60fps를 구현하기 위해서 경량화를 위한 노력과 시간이 상당 부분 투자되었다.
  카나이 엔지니어는 ‘드로우 콜(DrawCall)’를 삭제하는 것이 CPU 부하와 직접적인 연관성이 있다는 점에 ‘꽂혔다’고 강조하였다. Unity에 기본적으로 탑재된 드로우 콜 삭제기능인 ‘드로우 콜 배칭(Static batching과 Dynamic batching)’을 사용함으로써, 결과적으로 드로우 콜의 수를 대폭 삭감하는 것이 가능했다고 한다.

드로우 콜 삭감 효과를 표시한 슬라이드. 드로우 콜 배칭으로 40%의 드로우 콜을 감소시켰다.

또한, 3D 표준에서 3D 경량으로 바꾸는 것만으로도 30%를 줄일 수 있다.

◆ 캐릭터 움직임은 의도적으로 흐트러지게 만들어서 리얼리티를 강조

  데레스테에서 가장 중요한 부분 중의 하나인 캐릭터 모션은 모두 다 알지도 모르겠지만, 모션캡처를 통하여 제작되었다. 그런데, 실제로 움직일 때에는 IK(Inverse Kinematics, 역운동학)을 사용하지 않고 애니메이션을 전부 로테이션으로 하고 있다고 한다.

로테이션에 따른 흔들림(노이즈)는 투명 오브젝트 설치로 눈속임을 하였다고 한다.

  로테이션에서는 캐릭터의 움직임 끝에 흔들림이 발생할 수 있다. 예를 들자면 뻗은 손이 뻣뻣하게 움직일 수 있다는 것. 이에 대해 마이크 스탠드처럼 스테이지에 고정된 투명 오브젝트를 배치하여 여기에 손을 닿게 하여 모션의 불안정성을 완화하였다.

리얼리티를 연출하기 위해 모션에는 일부러 흐트러짐을 추가.

  다음 사항인 모션에서는 캐릭터마다 랜덤으로 신체의 흔들림을 추가하였다고 한다. 댄스에 맞춰 움직임을 살짝 흐트리는 것으로 마치 인간이 춤추는 듯한 현실감을 연출하려는 방법을 취했다고. 이로 인해 유저가 MV 재생 도중에 일시정지를 하여도 캐릭터의 포즈가 모두 똑같이 않고 미묘하게 다른 것을 보여줄 수 있다는 것이다.

의상 시뮬레이션은 연산 자체가 힘들어서 네이티브 코드로 구현.

  그리고 모션 관련으로 하나 더 포인트로써 언급된 것이 의상의 물리 연산 처리다.
  데레스테에서는 그리 구체적이지는 않아도 간단한 물리 효과가 구현되어 있는데, 최소한이지만 컬리전(접촉) 판정을 설정. 다만, C#으로 그걸 전부 처리하기엔 부하가 심하게 걸리기 때문에 연산 과정에 네이티브 코드를 사용하고 있다고 한다. 덕분에 10~20% 정도는 CPU 부하를 최소화시킬 수 있었다고.

  그리고 꽃가루나 콘서트 라이트에 관한 설명도 있었으나, 전반적으로 전세대의 거치형 게임기에 활용된 그래픽 기술을 설명하는 인상이 강하였다. 현재의 스마트폰은 전세대의 거치형 게임기에 필적하는 3D 성능을 가지고 있어, 전세대의 그래픽 기술이 사용되는 것은 어찌보면 당연한 것일지도 모르겠다.

출처 : http://www.4gamer.net/games/307/G030796/20160829088/

[月山明博]

언어의 압박으로 접었지만 진짜 갓겜..

[Lamant]

데레스테 정도면 모바일에서 최적화와 퀄리티 모두 압도적이라고 생각하는데 여기에는 개발자 분들의 세심한 손길이 있어서 그런듯..

[독서만세4]

아트편 다룬 기사만 봐서 테크니컬편 내용도 궁금했었는데 번역 감사합니다.

[Yuki⌒]

뭔가 거창하게 기술적으로 노력했썽~ 이라고 하는데. 요즘폰 gpu가 꽤나 막강하다보니 그래픽이 별로 좋아 보이진 않는데..
피사체 심도니 블룸이니 이전에 엑티브쉐도우랑 셀프쉐도우가 먼저지 않아? 겜옵션질할때 피사체보다 그림자on이 먼저라고!!

[아마다 코코로]

폴리곤이 대략 1만3천정도 쓰엿다고하는데 이정도면 노말들어가는 게임 캐릭터 모델링과 다를바가 없습니다. 그래픽 지향점이 달라서 2D를 3D화 시키기위해서는 핸드텍스쳐링을 주로하는데 실사같은 느낌을 줄려고 만든거였으면 이미 그래픽지향성이 다르죠.. 저정도폴리면 국내에서는 온라인게임 클로져스랑 비슷한 폴리곤이라고 보여집니다.손맵기반이 로우폴에 칠해서 표현한다는 구시대적인 발상을 깨고 하드웨어가 발전함에 따라 하나의 장르로되어버렸습니다. 그러므로 폴리곤을 쓸만큼쓰고 부드럽게가는 2D처럼나오게하자는방식으로 많이 바뀌었죠.. 애초에 노오말텍스쳐링을 사용한 게임이였으면.. 저런 질감을 내기엔 너무 힘들죠.. 길티기어는 그 상식을 깨고 하이폴 데이터에 -> 로폴을 노말을 떠서 그림자를 2D처럼 내는 기법도 나오긴했지만.. 데레스테가 그정도넣엇으면 아마도 60프레임 최적화하기 힘들었을거라고 생각듭니다. 카툰풍 랜더링이 생각보다 사양을 많이 잡아먹는... 지금 일본 3D게임들중에서는 리얼타입보다는 그들의 장점인 2D를 3D화시키는게 요즘 많이 노력하더군요.. 3D가 2D처럼보이게하는..

[쿠나린]

무조건 하이스펙에 맞추면 유저풀이 적어져서 수익 안 납니다

[굿거리장단]

5캐릭터 모두 똑같은 모션을 쓰면서도 완전 똑같은 칼군무는 아니라는 점, 그리고 언제부터인가 각성해서 카메라워크를 적극 활용한다는 점이 어색함을 줄이고 있죠
아시타마타 뮤비가 특히 그 약간의 시간차가 두드러짐

[타임엘레멘트]

러브데스티니 같은것도 훌륭하죠

[영원히내리는]

번역 감사합니다. 흥미있게 읽었어요.