유니티를 활용한 콘솔, 모바일 VR에서 아트 리소스의 게임에서 적용 및 개발 사례 분석

1. 유니티 게임 그래픽스 개발 사례 분석
(Analysis of Game Graphics using Unity3D)

2. 하드웨어의 이해
사례분석
Unity Shader
I N D E X

3. 이상윤(Yi SangYun) illustor@gmail.com
JoyCity Technical Artist / Unity Masterz 1기
Unity RoadShow Seoul , IGC 2016 : 테크니컬 아티스트가 뭐하는 사람이에요?
Intel Buzz workshop Seoul 2016 : 게임 그리고 컨텐츠 개발로써의 VR, 토론회 제안/진행
Unite Seoul 2016, CGC2016 : 룸즈2 모바일에서 VR까지
Unite Seoul 2015 : Light Probes를 활용한 모바일 플랫폼에서의 게임환경 구축
GameTech 2015 : 모바일 플랫폼을 위한 유니티에서 게임환경 구축
KGC 2013 : 디펜스 테크니카 모바일 컨버팅
비엘북스 : The Game Graphics 유니티, 언리얼 그리고 VR : 유니티5로 살펴본 라이트맵핑의 이해
Facebook Game 3D 배경 아티스트 그룹 운영자.

4. Defense Technica
Steam, Android, IOS, PS3, XBOX360
The Mansion : A Puzzle of Rooms
IOS, Android
Rooms : The Unsolvable Puzzle VR
Oculus PC VR, Steam VR
야망의 영주님 for Kakao
Android
Gunship battle2
Android, IOS, Oculus mobile VR

5. 하드웨어의 이해

6. PC, PC VR 환경(GPU 그래픽스)
전통의 강자.
안정적인 라인업 구축.
호환성에서 큰 강점.
가성비가 좋다가도 한번씩 삽질
말많고 탈만은 드라이버(카탈리스트)
ATI를 AMD가 인수

7. VGA Hierarchy 2016
Geforce Radeon Intel Intergrated Graphics
Titan X(Pascal)
GTX 1080
GTX 1070 R9 295X2
Tintal X(Maxwell), 980Ti HD 7990, R9 Fury X
GTX 1060, 980, 960, Titan Black Fury Nano, R9 Fury
GTX 780, 780Ti, 970, Titan RX 480, 470, R9 290, 290X, 390, 390X
GTX 590, 680, 770 HD 6990, R9 280X, 380
GTX 580, 670, 960 HD 5970, 7870LE(XT), 7950, 280, 285
GTX 660Ti, 760, 950 RX 460, HD 7870, R9 270, R9 270X, R7 370
GTX 295, 480, 570, 660 HD 4870 x2, 6970, 7850, R7 265
GTX 470, 560Ti, 560Ti 448 Core, 650Ti Boost HD 4850x2, 5870, 6950, R7 260X
GTX 560, 650Ti, 750 HD 5850, HD 6870, 7790
9800GX2, 285, 460 256bit, 465 HD 6850, 7770, R7 260, R7 360 Iris Pro Graphics 6200
GTX 260, 275, 280, 460 192bit, 460SE, 550Ti HD 4870, 5770, 4890, 5830, 6770, 6790
8800Ultra, 9800GTX, 9800GTX+, GTS 250 HD 3870x2, 4850, 5750, 6750, 7750, R7 250 Intel HD530

8. Console / Console VR 환경
PS4 PS4 pro

9. PS4/PS4 Pro
PS4 PS4 Pro
CPU X86-64 AMD “Jaguar”, 8 Core 1.6GHz -> 2.1GHz
GPU
1.84 TLOPs Radeon based Graphics engine
(7870 – 7850 중간)
1.84 TFLOPs -> 4.2 TFLPOPs(FP32 단정밀도)
1.84 TFLOPs -> 8.4 TFLPOPs(FP16 반정밀도)
RAM
8G GDDR5 SDRAM
176GB/s
사우스 브릿지용 메모리 : 256MB
8G GDDR5 SDRAM
218GB/s
사우스 브릿지용 메모리 : 1GB
출력포트 HDMI 1.4 HDMI 2.0(4K UHD + 60Hz 지원)

10. PC VR
Oculus Rift(CV1) HTC Vive PS4 VR
Resolution 2160 x 1200 2160 x 1200 1920 x 1080
Refresh Rate 90Hz 90Hz 90~120Hz + Reprojection
Platform Oculus Home SteamVR PSN
Field of view 110 degrees 110 degrees 100 degree
Tracking Area 5x11 feet 15x15 feet -
Ram 8GB+RAM 4GB+RAM -
System requirement
NVIDIA GTX 970 / AMD 290 equivalent or greater
Intel i5-4590 equivalent or greater
PS4, PS4 Pro

11. Oculus touch vive controller Sony move stick

12. Mobile/Mobile VR 환경
Qualcomm SnapDragon AP 구성
Samsung Omnia Mobile AP
SoC 구성(System on Chip). 제한된 물리적 사이즈에 다양한 기능을 효율적으로 구성

13. Imagination
PowerVR
Nvidia
Tegra
Qulacomm
SnapDragron
ARM
Mali
Mobile GPU

14. Mobile Device Texture 지원 포맷
ETC 1 ETC2/EAC DXT(S3TC) PVRTC ATITC
iOS PoewrVR ES 2.0 ◎
iOS PoewrVR Series 6 ES 3.0 ◎ ◎ ◎
Android PowerVR ES 2.0 ◎ ◎
Android Tegra2/3/4 ES 2.0 ◎ ◎
Android Adreno200 ES 2.0 ◎ ◎
Android Adreno300 ES 3.0 ◎ ◎ ◎
Android Mali400 ES 2.0 ◎
Android Mali600 ES 3.0 ◎ ◎

15. Samsung Galaxy S4
4.99인치 1920x1080(FHD)
퀄컴 스냅드래곤 600 Adreno
320(PowerVR 사용 모델 있음)
SM 3.0
2G RAM
Samsung Galaxy S3
4.8인치 1280x720(HD)
엑시노스 4412 ARM Mali-400
SM 2.0
2G RAM
Android

17. Apple iPhone 5
4인치 1136x640
A6 PowerVR SGX543
SM 2.0
1G RAM
IOS
Apple iPhone 5s
4인치 1136x640
A7 PowerVR SGX6430
SM 3.0
1G RAM

18. Samsung Galaxy S7
5.1인치 2560x1440(QHD)
엑시노스 8890 ARM Mali-
T880
SM 3.1
4G RAM
Samsung Galaxy S6
5.1인치 2560x1440(QHD)
엑시노스 7420 ARM Mali-
T760
SM 3.1
3G RAM
Mobile VR

19. Mobile VR
Samsung GearVR Samsung GearVR2 Google DayDream
Platform Oculus Home Google
Field of view 96 degrees 101 degrees 100 degree
Position Tracking 불가 가능
Depth -9D ~ +0.0D -
호환 악세사리 블루투스 패드 지원 DayDream Controller

20. Qualcomm 820(SnapDragon) : Galaxy S7(해외용)
Apple A9 : iphone 6S, 6S Plus
Exynos 8890 : Galaxy S7, Note 7
Exynos 7420 : Galaxy S6, Note 5
Helio X25 : 미디어텍. ARM A72+A53, Mali-T880 탑재. 메이쥬
Kirin 955 : HISILICON. ARM A72+A53, Mali-T880. 화웨이 라인업

21. Qualcomm 820 : Adreno 530, 810 : Adreno 430, 805 : Adreon 420, 652 : Adreno 510

22. Hardware 확인프로그램
GPU-Z 대부분의 GPU 성능을 확인할 수
있는 프로그램
안드로이드는 CPU Z로 확인 가능. 모바
일 AP이므로 GPU 정보까지 모두 확인 가
능. IOS는 홈페이지나 위키 페이지 참조

23. Nintendo Switch
Customized Tegra AP 예정
K1에서는 OpenGL 4.5를 풀 프로파일로 지원. 거의 PC와 동일한 수준의 지원.(DX 포맷역시 지원한다)
nVidia 실드와 구글 픽셀 C에 탑재
Vulkan 지원역시 대부분의 명령어 칩셋을 지원

25. 개발 사례 분석

26. ART
Character
Environment
Effect
UI Logic
개발 파이프 라인에서 Graphics 예산의 책정

27. Scene에 있는 vertex들을 그리기 위해 CPU가 GPU에게 보내는 요청. 카메라를 통해 한 프레임의 화면을 만들어 내는
동안 1개의 셰이더 패스, 1개의 material로 오브젝트를 한번 그리는 작업의 단위.
그래픽 이슈에서 성능과 직결되는 중요한 요소 중 하나.
Texture
Shader
Mesh
Material
Mesh render
DrawCall
Drawcall

28. Defense Technica
PC Steam
PS3, XBOX 360
Android : 갤럭시 S2
IOS : iPhone 4

29. Defense Technica Steam steage 19 Defense Technica Mobile steage 19

30. 야망의 영주님 for Kakao
Android : 갤럭시 S3
IOS : iPhone 5
Unity 4.x

31. MJT Project 영지 관리 메뉴

32. MJT Project 영지전 전투 statics : 스킬 사용시 왼쪽 상단에 영웅에 근접한 카메라를 로드하여 연출하는 씬.

33. 유닛 연산 서버로 전송 결과 산출 디바이스에 전송 결과 반영
클라이언트의 연산을 서버로 가져오는 구조를 취함. 이로 인해 클라이언트에서 연산의 많은 부분을 비쥬얼 퍼포먼스
에서 확보 할 수 있었음
화면에 등장하는 유닛의 숫자가 많기 때문에 클라이언트 연산을 최대한 분산하기 위한 해결책으로 개발(서버쪽 작업
진행여부에 따라서 수시로 타겟 디바이스에서 퍼포먼스 체크)
연산, 충돌처리, 길찾기 등 전투에서 발생하는 많은 부분을 서버에서 처리 해줌으로 퍼포먼스 확보. 전투에서 서버에서
처리되는 부분에서 지연되는 현상을 줄이기 위해 여러 방법 고려(패킷 줄이기, 쓰레드 추가 등)

34. Drawcall을 소비하여 그려진 mesh를 다시 그릴때 연산을 줄이기 위한
기법
Static Batching(정적배칭)
정적배칭 처리를 할 경우 드로우콜은 아낄수 있지만 카메라의 뷰에 걸리
지 않는 오브젝트 역시 계산을 하기 때문에 컬링 영역을 잘 계산해서 배
치하는 쪽이 좋다.(scene에 따라 오히려 끄는 쪽이 퍼포먼스에 좋은 경
우도 있다)
Dynamic Batching(동적 배칭)
움직이는 object가 해당. 정적 배칭에 비해 조금 더 무겁게 처리된다.
Project의 batching을 활성화 할 경우 별도로 체크하지 않더라도 자동으
로 활성화 된다
Batching

35. 영웅유닛용 말
스킨된 메쉬로 구성
Drawcall : 1
Probe light 사용으로 Batching 불가.
최대 scene에 5unit 등장.
병사유닛용 말
Mesh animation 사용
Drawcall : 12
동적배칭 사용
Probe light 미사용
최대 100unit까지 등장.

36. Vertex수 900 이하에서 처리되나 UV0, UV1, Tangent, Vertex Normal 등을 사용하면 180까지
Material Instancing 사용시 해제됨
Lightmap Index가 다른 맵을 사용할 경우
Multi-pass shader에서는 사용 불가
Batching 처리시 combine된 vertex 수가 65535를 넘을 경우
Skinned mesh 처리 불가

37. Model 옵션의 제어
Vertex Normal을 사용하지 않는 Unlit 기반의 Shader를 사용할 경우
Model 옵션에서 이를 꺼주는 쪽이 좋다.
또한, 노멀을 사용하지 않는 메쉬라면 Tanget & Binormal을 꺼주는
것이 좋다

38. FBX Export 옵션의 제어
fbx export 옵션의 binormal과 tangents를 포함할때와
그렇지 않을 경우, fbx의 용량차이가 발생
Caculate 옵션을 사용해서 결과의 차이가 없다면(길티
기어 xrd처럼 강제로 조절하는 경우가 아니라면) 엔진에
서 계산해주는 것을 권장...
자세한 내용은 : http://illu.tistory.com/1175 참조

39. • Poly counter를 줄이는 작업대신 모바일용 타워를 새롭게 제작
• 같은 계열 타워는 하나의 texture 소스로 통합하여 사용(color는 illumination color로 구분)
• 작게 보이는 화면 특성상 유닛 특성을 실루엣으로 보여지도록 디자인
• 높은 단계의 Tower를 먼저 모델링하고 줄여나가는 방식으로 작업
Polygon and Textures

40. Lineage II Revolution(Netmarble)
하드웨어의 발전과 PC보다 오히려 나은 비쥬얼 퀄리티를
내는 프로젝트가 많아짐에 따라 플랫폼에 따른 폴리곤 수
제약은 많이 사라진 상태
HIT(NAT Games)

41. 디스플레이 픽셀 수 비교
Resolution Pixel Count
qHD(quarter FHD) 960 x 540 518,400
HD(High Definition) 1280 x 720 921,600
FHD(Full HD) 1920 x 1080 2,073,600
QHD(Quad HD / 2K) 2560 x 1440 3,686,400
WQXGA(Wide Quad eXended Graphic Array) 2560 x 1600 4,096,000
UHD(Ultra HD / 4K) 3840 x 2160 8,294,400
Mobile 플랫폼에서는 초기 기기들에 비해 고 해상도화. QHD가 일반적인 해상도로 사용

42. Advanced option을 활성화하면 구체적인 옵션을 제어할 수 있음
야망의 영주님의 경우 Mipmap 적용시 정보창에서 케릭터 얼굴의 디더링
증상때문에 케릭터 텍스쳐의 경우는 mipmap을 사용하지 않음
배경은 Kaiser 옵션을 사용.
밉맵을 끌경우 픽셀 포맷용량이 줄어들지만 메모리 대역폭이 늘어나는 단
점을 지니며 텍스쳐가 지나치게 쨍하게 보임.
프로젝트 아트 성격에 맞추어 선택
Texture 옵션

43. Unity 5.5에서는 Advanced option이 사라지고 아래에 Advanced 항목 생성. 기존보다 조절하기 좋아짐.

44. ES 2.0(S3 까지)에서 타겟 디
바이스가 ES 3.0(S4 이상)인
프로젝트가 많아짐에 따라
ETC 1보다 ETC2를 기본으로
사용하는 프로젝트가 많아지
고 있음
텍스쳐 용량과 관리에서 보
다 용이할 것으로 보인다.

45. Pixel Format 용량
(512 기준. 밉맵 사용)
Alpha Channel 용량
(1024 기준. 밉맵 사용)
ETC 4bits 170.7kb X 0.7MB
ETC2 4bits 170.7kb X 0.7MB
1bit alpha ETC2
4bits
170.7kb
O
(1bit alpha)
0.7MB
ETC2 8bits 341.4kb O 1.3MB
RGBA 16bit 0.7MB O 2.7MB
RGB 24bit 1.0MB X 4.0MB
RGBA 32bit 1.3MB O 5.3MB

46. Project Setting의 Quality
Anisotropic Filtering(비등방성 필터링)
Texture option

48. Anti aliasing
MSAA 방식의 Anti aliasing 처리를 지원. SSAA처럼 모든 서브 픽셀
을 계산하는 것이 아닌 1개의 픽셀로 1회만 계산 하므로 빠르지만,
텍스쳐에 대해서는 대응되지 않음

49. Post Processing Anti aliasing
Fast Approximate Anti-aliasing. 주변 픽셀과 휘도차이를
계산해 이 휘도차를 통해 윤곽을 검출하고 주변의 픽셀로
가 색을 혼합하는 구조

50. 그래픽에서 공간상의 위치를 인지하고 입체감을 더해주는데 있어 중요한 요수중 하나.
그림자를 그리게 되면 아래 설명한 계산이외에도 그려지는 케릭터의 숫자만큼 폴리카운터가 증가.
유니티에서 제공해주는 그림자는 그림자맵(ShadowMap) 기법을 사용하고 있습니다. 이 기법은 모든 굴곡에 대응하고 자기 그림
자(self-shadow)가 처리되는 등 높은 퀄리티를 보여주고 있지만 문제는 성능입니다. ShadowMap 기법은 그림자의 깊이를 저장
하는 버퍼를 만들고난 뒤 픽셀 셰이더(Pixel Shader)에서 깊이를 비교하는 과정을 거칩니다.
또한, 넓은 영역을 커버하기위해 여러 구역으로 나누기도하고(cascade) 계단 현상을 없애기 위해 여러번 샘플링하여 필터링을
처리하는 등 부가적인 행위들이 추가됩니다.
- 유니티 코리아 오즈라엘님 글 中
Shadow

51. HIT(NAT Games)
실시간으로 그림자를 그리고 있으나 성능이 낮은 디바이스에서는 그림자를 아예 그리지 않고 있다.(그외, 블룸 라이트
등 몇몇 옵션들이 작동하지 않고 있음)

52. 리터너즈(Nexon)리니지 레드나이츠(NCSoft)
캐쥬얼한 스타일이라 할지라도 리얼타임으로 그리는 경우도 있음. 프로젝트 성격에 따라 선택
플랜 쉐도우라고 할지라도 모바일 디바이스의 작은 화면에서 괜찮은 비쥬얼을 보여줄 수 있다

53. Lightmapping
Lighting을 미리 계산한 텍스쳐에 만들어 덧씌워 고품질의 환경을 제작하는 기법.
라이팅만으로 동일 리소스를 다양한 스테이지로 활용할 수 있다.
Unity 4까지는 Beast를 사용하였으나 Unity 5부터 Enlighten이 탑재.

54. Defense Technica Mobile

55. Theme01 : Spring
Rooms VR Play Scene theme
Theme02 : Summer
Theme03 : Autumn Theme04 : Winter

56. Main Scene VR
Exit
Trophy
Trophy
?
UI
UI
Theme select

57. PC와 Mobile Platform에 따라 사용할수 있는 리소스의 크기가 달랐으나 최근 모바일 디비이스가 좋아지고 사용자의 퀄리티
니즈가 높아져 이 부분에서는 경계가 많이 사라진 상태.
Model 옵션의 Generate
Lightmap Uvs으로 Lightmap
UV를 생성할수 있으나 사용할
수 있는 공간의 낭비가 많으므
로 최적화를 생각한다면 직접
작업하는 것을 권장

58. 엔진 버젼업 이후 Generate Lightmap Uvs 옵션을 사용했을 때 왼쪽과 같이 라이트맵 인덱싱이 깨지는 증상이 발생
5.3 >> 5.4
5.4 >> 5.5
라이트맵이 어둡게 나오는 증상은 5.5.0 p4에서 발생하지 않음.(5.5 사용시 이 버전이상 권장)

59. Multi-sub로 복수의 Material을 사용하는 Mesh라도 attach되어 있다면 하나의 2ndUV로 취급해서 계산에 포함됨
추가적인 유니티 Lightmapping에 관한 문서는 ‘필드에 빛을 입히다’ 문서 참조 : http://illu.tistory.com/1178
비엘북스 유니티, 언리얼 그리고 VR

60. Defense Technica DLC Stage 26

61. Console stage 17 mobile stage 17
Linear Interpolate(Lerp) 함수를 사용한 Splatting의 지양
Core Effect 수정

62. Fog
Linear Fog 사용.
퍼포먼스에 크게 영향을 끼치지 않는 항목.

63. Linear Graph Exponential Graph
Post Process에서 사용되는 Global Fog는
exponential 기반으로 fog가 생성

64. Skinned Mesh를 사용하지 않고 각각의 오브젝트의 Transform 값만을 사용해 움직임을 부여하는 작업
Unity3D는 vertex animation은 지원하지 않으나 mesh animation은 지원한다.
병사 말의 skinned mesh 숫자를 줄이기 위해 사용하여 dynamic batching을 적용
Mesh, Material animation등을 제어할수 있으며 만들어둔 클립을 object에 드래그하여 붙
임으로 손쉽게 제어할 수 있다. Material에 적용해 사용하는 애니메이션의 경우 셰이더안에
서 _Time으로 제어하기 보다 가급적 C#으로 작성된 코드를 컴포넌트에 붙여서 사용
Mesh Animation

65. 배경 오브젝트 구성 예

66. Mobile flame tower effectConsole flame tower effect
파티클 입자의 수 감소
연출을 최대한 심플하게
입자가 변화하는 것보다 짧
고 임팩트 있게 변경
Mobile mortar tower effectConsole mortar tower effect
Effect

67. Core Effect 수정
Console core 파괴 연출 effect
Mobile core 파괴 연출 effect
강렬하게 연출한 effect 효과를 최대한 단순하게 표현. 연출 시간도 간소화

68. Unity Shader

69. Standard Shader
Unity5에서 도입된 PBS(Physically Based Shader)의 이름.
하나의 Shader로 대부분의 표현이 가능할 정도로 매우 편리하고 좋은 품질을 보여준다.
모바일에서는 자동으로 최적화 해준다고 하지만 아직은 많이 무거움(사용하지 말것.)

70. Light
Cubemap
(Environment Reflection Source)
Standard Shader의 구성
Albedo
Smoothness
(1-roughness)
Metalic
Normal
A.O
(Ambient Occlusion)
Emissive
Detail Normal

71. Albedo
Smoothness
Metallic
Skybox
Standard shader의 Metallic texture 항목에 R채널
값을 Metallic으로 A채널의 값을 Smoothness 값으
로 사용하게 된다.

72. Unity에서 기본으로 제공하는 built-in shader의 경우 의도대
로 표현하는데는 한계가 있으므로 보통 모바일 프로젝트에서
는 Custom shader를 작성하여 사용하거나 Asset Store에서
Shader를 구매하여 사용하게 됨.
Unity Surface Shader는 기존의 GLSL, HLSL, Cg 언어에 비해
작성이 매우 간단한 편으로 접근하기가 용이.
Custom Shader

73. Fixed/Function Shader
가볍고 빠르다. 오래된 하드웨어에서 호환이 좋음
키워드 구성으로 사용이 단순
제약이 많음

74. Vertex and Fragment Shader
CG 기반 셰이더 언어.
버텍스, 픽셀 셰이더 제어
셰이더관련 다양한 매크로 및 함수 제공
기존의 셰이더 언어체계와 가장 유사

75. Unity Surface Shader
Matrix 변환없음.(행렬안해도됨)
전처리가 대부분 되어 있기 때문에 코드가 짧고, 살
펴보기 편하다.
스크립트 기반이므로 구조만 파악하면 수정 및 작성
이 수월하다.

77. Surface Shader의 Compiler 선언
Surface Shader는 전처리 된 코드를 적절히 잘 사용할 수 있는 반면, 많은 경우의 수에 대하여 Shader가 컴파일 되므로
Compiler 구문에서 막아서 최적화 해 줘야한다.

78. Surface Shader의 Compiler 선언

79. 야망의 영주님 Character shader 테스트 이미지 스크린 샷
라이트 프로브 활용을 위해 리소스 텍스쳐에서 추가적으로 보완

81. Texture atlas를 이용해 UV 이동으로 배경 프랍이 작동할때 연출을 표현. (이펙트 없이 텍스쳐 UV 이동만으로 구현)
Prop이 scene에서 서서히 사라지는 효과를 위한 shader
Shader에서의 연출

82. Shader Animation
Vertex animation을 활용한 식생의 움직임 UV scroll과 Emissive clamp를 활용한 용암의 표현

83. Terrain에서 Splatting texture
Lerp 함수 사용(Linear Interpolate)
Lerp(A, B, Value)로 ETC1 기준으로 masking texture Base, R,G,B
총 네장의 texture blending이 가능

84. Masking texture 채널 색 오염 문제
ETC 포맷의 알고리즘에 따른 문제로 품질이 좋은 ETC2에서도 발생한다.
Terrain 같이 큰 영역에 사용되는 masking texture의 경우 scale을 줄여서 24bit RGB로 사용하는 것을 권장

85. RoomsVR에서 MainMenu의 유저 뒷 공간을 활용할 방법 중 하나로 사용.
Shader에서 viewDir(카메라 벡터) 사용시 양안렌더의 경우 이상하게 보이는 증상발생으로 rim light
제거.
VR에서 viewDir의 문제

86. Q&A
illustor@gmail.com
Facebook 게임 3D 배경 아티스트 그룹 : https://www.facebook.com/groups/3Dbackground/