..이어 하편 나갑니다.


----------------------------------------------------------------------------------------------------------------


원문: http://jp.gamesindustry.biz/article/1609/16090703/
번역 및 요약: http://gall.dcinside.com/m/streetfighter/151

작성자: 디씨인사이드 스트리트파이터 마이너 갤러리 "스파갤러"


배경 디자인에 숨겨진 '색깔'의 비밀


2D 시대의 SF 시리즈의 특징을 계승하는 요소는 그 밖에도있다. 그것은 배경 그래픽이다.

아래 그림은 "STREET FIGHTER ZERO '(이하 SFZ) 시리즈의 전투씬의 스샷인데 히스토그램을 따보면 재미있는 것이 보인다.



캐릭터 그래픽은 RGB의 3 원색이 0 ~ 255의 범위 전체적으로 골고루 사용되고있는 반면, 배경 그래픽은 암부 계조의 색상을 중심으로 사용되고있다.

전체적으로 배경 그래픽이 어두운 것은 그러한 이유에서인데, 그럼에도 불구하고 배경 그래픽은 칠흑에서 최고 암부의 색깔은 쓰이지 않는 것도 재미 있다.

이는 배경 그래픽을 소극적인 톤(계조)으로 처리하는 것으로, 앞의 캐릭터들의 그래픽을 상대적으로 돋보이게 할 의도에서 디자인된 것이다.

배경 그래픽으로 칠흑과 암부 계조가 이용되지 않는 것은, 콘트라스트를 줄이기 위한 것이다. 반면 캐릭터 그래픽에서 칠흑과 암부 계조는 물론 가장 어두운 계조까지도 사용하는 것은 반대로 콘트라스감을 명확하고 선명하게 표현하고 외형도 선명히 두드러지기 때문이다.

3D 그래픽의 SFV는 SFZ 시리즈만큼 극단적이지는 않지만 이에 가까운 색 농도 보정 (COLOR GRADING)이 이루어지고 있다고 한다.



윗 그림 중 윗쪽스샷은 실제 제품 버전 SFV의 한 장면인데, 보다시피 배경은 어두운 빨간색 기조의 색온도가 낮은 색조로써 정리되어
있는 반면, 캐릭터 그래픽은 다소 색 온도가 높다. 배경도 캐릭터도 3D 그래픽 특유의 입체감있는 조명으로 아름다운 캐릭터가
제대로 눈에 띄게 배색되어 있고, SFZ적인 색상 연출이 이루어지고 있는 것을 알 수있다.

반면 아랫쪽 스샷은 색 농도 보정없이 출력한 스샷이다. 영상의 현실성은 이쪽이 더 높을지 모르겠으나, 캐릭터가 배경에 녹아있어 격투게임으로써 플레이하기 어렵다.


3D 그래픽을 2D처럼 보이기위한 궁리

3D 그래픽은 3D 장면을 중심 위치에서부터  멀리를 향하여 펼쳐지는 듯한 시계 (시추대)로 잘라 그리는데, 그 때, 본래는 반구 형태(돔모양)으로 그려져야 할 시계를 GPU는 TV 화면의 형태인 사변형에 투영되어 그리게 된다. 따라서 화면의 가장자리로 갈수록 약간씩 퍼지게 그려져 버린다.

SFV는 3D 그래픽을 채용하고는 있어도 게임의 메카닉은 2D 격투이므로, 화면의 위치에 따라 캐릭터가 "마르거나 뚱뚱해지거나"해버려서는, 기술이 닿는 판정 효과가 알기 어렵게 된다.



류를 보통의 3d그래픽스로 화면 가장자리와 화면중앙에서 배치한 테스트용 비교샷.캐릭터는 화면 끝으로 갈수록  뚱뚱해보이고 중앙으로 올수록 말라보인다. 화면가장자리 버전은 카메라의 방향도 조금씩 다르게 보인다.

이것은 3D 그래픽에서 2D 게임 메카닉을 구현하려고하면 누구나가 부딪 치는 문제로써 「GUILTY GEAR Xrd -SIGN-」에서도 같은 과제에 대한 독자적인 대처를하고 있었다.
　
SFV는 일반적인 3D 그래픽에서 사용되는 가까운 사물은 크게, 먼 사물은 작게 그리는 투시투영법과 공업 일러스트 등에서 사용되는 원근에 관계없이 사물의 크기를 상대적으로 그리는 평행 투영법을 혼합하여  이 문제에 대처하고있다.
　
구체적으로는 투시 투영 50 %, 평행 투영법 50 %의 혼합 투영법으로 그리는 것으로,이 "마르거나 뚱뚱해지거나"하는 문제를 저감시킨 것이다.

"마르거나 뚱뚱하거나" 문제만을 해결하고 싶다면 평행 투영법 100 %로하면 되겠지만, 카메이씨에 따르면, 그렇게 되면 3D 그래픽같은 입체감이 사라져 버리기 때문에 원근감이 나오는 투시 투영법도 끼워 넣은 것.

덧붙여서, GGXS에서는 투시 투영 30 %, 평행 투영법 70 %에서 SFV보다 평행 투영의 비율이 많다. 이 차이는 흥미 롭다.

또한 이 투시 투영 법:평행 투영 법=1:1의 균형은  메인 캐터들에게만 적용되며 배경 그래픽은 박력을 중시하여   투시 투영법이 지배적으로 적용되고 있다.


SFV 그래픽의 구조  

회화풍 쉐이딩은 SFIV와는 다른 방법으로


여기서, 카메이 씨의 이야기는 약간 기술 쪽으로 되어 간다. 구체적으로 말하면 쉐이딩에 얽힌 화제로 옮겼다.

SFV의 그래픽은, 전술한 것과 같이 " 보기 쉬움"" 알기 쉬움" "기호적으로 이해하기 쉬움"을 구현하고자  리얼계가 아니라 회화적, 일러스트적인 NPR(Non-PhotorealisticRednering)표현 방법이 채용됐다.

노선이 정해지면 곧바로 "무슨 NPR표현으로 갈까?" 논의가 들어가는데,"리얼계를 버린다"라는 방침이 결정된 이상, 망설임 없이 "어떤 한가지 방침"으로 결정했다고 카메이씨는 되돌아 본다. 그 방침이란 것은 바로 스트리트 파이터 시리즈의 역대 이미지 일러스트를 구현한다는 것이다. 아래샷은 이번 작품 개발을 위해 그려진 컨셉 아트.

"

그리고 이 컨셉 아트를 실기로 실시간 재현함에있어 쉐이더 디자인 이미지로는 '유채풍 "이면서"라이팅이 풍부한'이라는 기본 방침을세웠다. 이 "유채풍"이라는 것은 "정보량이 많은 것"이라고 카메이씨는 설명했다. SFV는 1920 × 1080 픽셀의 풀 HD 해상도에서 렌더링을 전제로하고 있었으므로, NPR적인 표현이라고는 해도, 디테일 표현 등을 빠짐없이 재현하고 싶었던 것이라고한다.  실제로 게임에 등장하는 캐릭터 그래픽은 아래와 같다.



그런데,이 SFV의 독특한 음영은 어떻게 실현 된 것일까. 일반적으로 애니메이션 풍의 셀 음영 법은 라이팅 결과를 일부러 대략적으로하여 단계적인 계조를 만들어내는 방법으로 실현된다.

SFV는 게임 엔진으로 Epic Games의 Unreal Engine4 (UE4)를 채용하고있는 것이지만, UE4의 그래픽 엔진은 Deferred Rendering 기반이다. Deferred Rendering 특징의 하나로 「광원을 장면에 많이 배치 "라는 게 있는데, 실제로 SFV는 복수의 광원을 설치하고,이 상태에서 셀 음영을 처리하면 목표로 하던 그래픽  표현과는 다른 결과가 된다.
그래서 UE4에서의 쉐이더 설계는 특별한 일을하지 않고 다른 방법으로 "유채풍"× "풍부한 라이팅 '을 구현하기로했다.

그것은 터치 (필치)의 재현 , 에지 색상 경계의 강조,  색상 채도 제어  이 3 요소를 포함시키는 것이었다.

터치의 재현이란 일러스트레이터가 그린 그림에 그 붓의 흐름 · 궤적이 남는 것이다.



붓으로 색칠한 것이다. 붓의 터치를 재현하고 싶다

전작 스파4는 붓의 흔적을 재현하기 위해 노멀 맵 텍스쳐에 포토샵필터를 적용하는 것으로 실현됬다. 스파5도 이 방법을 시도했지만 스파5는 전체적인 해상도 업이 이루어지고 미세한 붓터치가 보이지 않게 되었다. 그래서 다른 방안을 생각하게 됬고 스냅아트라는 플러그인을 선택하게 됬는데 이 스냅아트는 사진등을 일러스트화하여 유화처럼 변환할 수 있다. 하지만 이런 방법들을 사용해도 유화와 같은 효과가 나타나지 않았다고 한다.

그리하여 계속된 연구 끝에 결국에는 유화조의 붓터치를 구현하게 되었지만 문제는 필치가 일정하기 때문에 결국 인간의 일러스트레이터가 그린 분위기를 내기에는 부족한 느낌이 들었고 결국 다른 궁리를 할 수 밖에 없었던 것이다.

사실 일러스트레이터는 감상자의 시점에서 그리는 부위에 따라 붓터치의 상세도를 다르게 하고 있다. 다른 궁리의 힌트는 바로 여기에 있었다.



일러스트레이트가 그린 컨셉 아트는 정밀한 필치는 얼굴에 집중되어 있고 반대로 얼굴에서 멀어질수록 필치가 엉성해진다는 힌트가 숨겨져 있었던 것이다.

인간은 사람(캐릭터)의 얼굴에 시선이 모이기 쉽기 떄문에 여기에 가장 세부적인 붓터치를 넣도록 하였고, 얼굴, 몸, 의류, 소품 등의 순으로 붓터치의 세밀감을 조정했다고 한다. 이러한 연구로 훨씬 컨셉 아트다운 느낌의 재현을 성공했다.



스냅아트 처리에 의한 노멀터치 효과 off와 on 상태의 비교

이외에 엣지색상 경계의 강조 , 그리고  간접 조명 표현등을 통하여 보다 일러스트에 가까운 느낌으로 구현했다고 한다.( 이부분도 자세한 설명이 있지만 기술적인 부분이니

굳이 깊게 알 필요는 없는것 같아 생략하겠음..사실 기술적인 부분은 내가 이해를 잘 못해서 생략하는 게 더 큼 ㅠㅠ 미안..)


결론


카메이씨는 마지막으로 "아트 (그래픽)는 게임에서 게임의 상황을 순간적으로 플레이어에게 피드백하는 가장 중요한 항목이라고 생각한다. 그 속에서 게임의 아트는 어떤 역할을 할 것인가그리고 해야 하는가를 생각해보지 않으면 안된다 "고 강연을 마무리했다.

본 강연은 격투게임의 그래픽, 그것도 역사적으로 유명한 시리즈의 그래픽에 관련된 내용이었지만 3d그래픽의 다이나믹함을 표현하면서
동시에 2d게임의 메카니즘적 관점에서도 접근하기 쉬운 연구, 그리고 일러스트풍의 3d그래픽을 실시간으로 제공하는 기술에 관한
부분은 다른 게임장르에서도 폭넓게 활용이 가능할 것으로 예상된다.


여기까지고..


대충 뒷부분에 많이 생략되었는데 실은 게시물 작성하다 한번 날려버렸음...다시 쓰는게 지옥이라 그냥 생략하는 걸로..
혹시 전문이 보고 싶은 사람은 아랫 사이트 가서 보면 됨.
다들 읽느라 고생했음.

http://jp.gamesindustry.biz/article/1609/16090703/


-----------------------------------------------------------------------------------


원문: http://jp.gamesindustry.biz/article/1609/16090703/

번역 및 요약: http://gall.dcinside.com/m/streetfighter/151