[GDC] 파괴 만들기; 데드 스페이스 UI의 진화

https://youtu.be/pXGWJRV1Zoc

미학적 필라와 직관, 기능성 사이 균형을 어떻게 맞추는가? 의 고민과 <HP, 인벤토리, 무기 셀렉터, (지도의 실패로 인해 개발된) 로케이터, 프론트엔드 개발과정, 업그레이드 벤치의 실패와 해결>의 실제 사례로 이루어져 있습니다.

프레젠테이션과 거의 비슷하게 발표하셔서 글 위주 번역하였지만 이미지는 생략했기 때문에 영상과 함께 보시면 좋습니다

 

(의역, 오역 있을 수 있음)

 

파괴 만들기

데드 스페이스 UI의 진화

Dino Ignacio

 

 

• 전반적으로 -중심 아이디어들 / 미학
• 구체적인 사례 -조작 / 프론트엔드 / 진화 / (무기 업그레이드) 벤치
• Q n A

 

 

 

중심

• Dead space의 UI를 말하기 전에, UI와 게임 전반의 관계에 대해 논의할 것

• Dead space는 몰입할 수 있고, 이야기 중심이고, SF적으로 인식되었음

• 우리는 불신을 멈추고, 게임 플레이를 통틀어 호러를 유지할 수 있게 만들고 싶었음

• 이러한 거대한 미션은 UI를 형성하는 결정을 할 때 도움이 되었음

 

 

배경 이야기

• Dead space는 디스토피아적이고 열화된 미래의 세트장임

• 첫 게임 대부분은 이시무라라고 불리는 버려진 채굴 우주선에서 일어남

• 모두 죽었고, 우주 좀비들에 의해 우주선은 감염되어 있음

• 수리 미션을 받은 엔지니어로서 플레이함

 

 

접근

• 중심과 배경이야기를 아는 것;  UI가 모두 게임의 다른 부분을 서포트하고 통합해야 한다고 결정했음

• 이시무라를 우리가 만든 세계에서 그럴듯한 하나의 캐릭터로서 디자인했음

• UI를 이시무라의 연장선이라고 보았음

• SF는 UI를 굉장히 영화적 효과로서 접근할 수 있게 해줌

 

 

영화적 효과

 

*Diegetic: (사전적 의미) 영화의 음악 등이 배경으로 쓰인 것이 아닌, 영화상의 사건에서 나온

 

• 요소(UI)는 가상 세계 안의 캐릭터와 관객 모두에게 존재함 (DS의 경우 플레이어에게)

• 예시: 영화적 효과로서 소리는 영화 속 캐릭터가 차 라디오를 틀고, 그는 선율을 듣는다.

• 그러나 그 소리는 다음 신에서 관중을 위한 배경음악으로 계속됨

  (ex - jj 에어브람스의 스타트랙 첫 시퀀스 - 커크가 노래를 틀고, 와이드 씬에서 배경음악으로 계속해서 흐름)

 

 

디자인에 의한 영화적 효과

• SF는 우리에게 이걸 가능하게 만듬

• 로딩 페이지나 세이브포인트 같은  전형적인 게임 관례를 있을 법한 세상의 부분으로 포장할 수 있었음

• 예시: 문 홀로그램은 아이작에게 실제 세상 일부로서 존재하면서 동시에 플레이어에게는 UI로 적용

• 로딩 스크린은 트램과 우주 택시 여정에 합쳐져있음 (이후 여러 예시 보여줌)

 

 

개발 중의 영화적 효과

• 게임 세계에 실제 존재하는 UI를 만드는 것.. 이것을 하기 위해 혁신적인 방법을 찾아내야 했음

• 전통적인 UI는 플래시 같은 2D 툴로 반들어졌음

• 3D 공간에 UI를 투영할 필요가 있었고, 게임 엔진의 파티클 시스템을 사용하기로 결정

  영상에서는/ 스케일폼 사용했냐고 진짜 많이 질문이 들어왔다 ..  그건 아니고 어썸한 우리 엔지니어들이 

  파티클 시스템을 이용할 수 있게 했다 .. 필요하면 개발해서 사용한다 /늬앙스로 이야기함

  (1 개발 시점이 08년임을 감안)

 

 

법칙

• 좋은 디자인의 기반 중 하나는 좋은 법칙을 갖는 것

• 아이작은 항상 화면의 왼쪽에 있음; UI와 상호작용 하는 순간 포함 (플레이어는 항상 제3자로 존재)

• (영화적 효과가 아닌) 배경으로서 UI는 아이작 뒤에 나타남

• 모든 상호작용 UI는 땅 위 1.5m 위에 항상 투영되어야 함

• 엄격한 컬러 룰을 세웠음

 

파랑, 하양-상호작용 가능함

빨강-잠금, 그 순간에는 상호작용 불가

오렌지, 노랑 - 주변(ambient)

 

 

 

룩

• 미래적인것 만큼이나, 고갈되고 부서진 미래

• 스타 트랙이 아님(대표적인 긍정적 SIFI 미래관이 스타트랙); 버려진 채굴 우주선에서 시작하고 계속함(set in)

• UI는 종잡을 수 없고 부서져 있을 필요가 있음

• 깜박거리는 형광색 빛들과 치과 전등에서 영감을 얻음

• 또한 정지 상태의 주사선은 뚜렷한 미감에 더해짐

• 스큐어모피즘을 향수를 불러일으키는 것에 이용

 

스큐어모픽

• 오리지널에서 필수적인 구조를 본따 장식적인 디자인을 유지한, 새롭지 않은 물체

• 새로운 것을 편안하게 오래되고 익숙한 것으로 만들기 위해 계획적으로 사용

• 예시; 메이플 시럽 통의 핸들, 차의 나무 패널, 아이폰 노트패드의 종이 텍스쳐

 

스큐어모피즘: 어떤 도구의 형태, 형식이라는 뜻, 원래 도구의 형태를 그대로 따라가는 양식
쓰임새 또는 재료에 따라 자연스럽게 발전한 도구의 형태와 요소들이, 재료나 매체가 변화함에 따라 재구실을 못하게 되더라도 형태와 요소들이 의도적으로 유지되는 것을 가리킴 - 애플 초중반 gui, 그러나 window 10, OS X 이후 미니멀리즘으로 바뀜
dead space1이 2008년 나왔으니 당시 UI 룰을 반영했다 볼 수 있음

08년도 개발 당시 참고했던 것이고, 지금은 인터페이스에 사람들이 익숙해진 점, 직관적, 편리함을 위해서 꼭 필요한 경우가 아니면 장식을 제거하고 있음, 따라서 모델링에 어떻게 합칠 것인지(hp 표시라던가) 방법적 부분 참고하고, 룩이나 장식은 접근을 달리해야 한다

 

 

 

(이 이미지가 초반 Dead space UI- 화면 상하좌우 UI가 펼쳐져 있음)

장치

단순하게 말해서 UI를 서사에 포함시려 고민했다 .. 연극이나 서사 이론에 쓰이는 단어 나옴

• Dead space UI의 가장 눈에 띄는 부분

• 게이머의 몰입 유지를 위한 필요성에서 진화한 것

• 게임 화면에 어수선하게 채우는 대신, HP, 인벤토리, 갑옷 개수와 지도 위 위치를 알리는 방법이 필요했음

• 장치는 이 모든 핵심적인 게임 UI를 접을 수 있는 구조에 담으려는 시도였음

• 많은 게임들이 정보들을 모두 HUD에 담아서 게임과 유저의 유리감이 뚜렷하게 느껴지게 만들었기 때문에 (제 4의 벽을 부쉈다고 표현),

  그러지 않기 위해서 우리는 이 모든 시스템을 가상 세계(diegesis)의 것처럼 위장하려 시도 했음

 

제 4의 벽; 관객과 배우 사이의 가상의 벽
diegesis(디에게시스); 어떤 스토리와 그 스토리에 관련된 실제의 말하기를 구분하기 위해 서사이론에서 사용하는 용어. 단순하게 말하면 '허구의 세계'

 

 

 

HP 막대

• 헬멧을 제외하고 아마도 게임에서 가장 상징적인 부분

• 이것을 개발하는 도중 많은 반복들이 이루어짐

• 많은 디자인들을 시도했음...

• 어떤 것들은 다른것에 비해 더 정교함

• 마지막에는 단순함이 최고

• 가장 절제된 룩이 결국 가장 명료하고 상징적었음

• 세 게임에서 조금씩 진화됨(Dead space 시리즈 3개 전반)

• 시리즈를 거듭하며 수정된 디자인들은 깊이가 없음

  (핵심 시스템을 바꾼게 아니라 껍질만 바꿨다 정도의 늬앙스)

 

DS1 - 빛의 튜브 
DS2 - 홀로그램으로 변함
DS3 - 빈티지한 전기회로망 디테일을 살짝 더함

 

 

 

인벤토리

(변천사 계속 보여줌, 영상 참고)

• 인벤토리 중심 시스템을 만들기 위해 많은 시도를 함

• 더욱더 정교한 시도를 했지만, 마지막에는 편의성이 이김

• 프랜차이즈를 거듭하며 시스템이 꽤 많이 업데이트됨

• 환경의 변화와 게임의 요구는 인벤토리의 진화에 직접적으로 영향을 줌

 

무기 선택창

• 인벤토리에 가지 않고, 빠르게 무기를 바꾸는 방법을 찾기 위한 아이디어

• 아이디어는 단순한 형태로 머물렀고, 살짝 바뀜

• DS3에서의 교훈; 더 정교하고 강력한 무기를 만들 수 있을 만큼 많은 무기들을 가지고 다닐 수 있어야 한다

 

지도

• DS1에서 제일 좋아하는 시스템 중 하나

• HUD 지도의 아주 아름다운 재해석

• 불행하게도 완전히 사용할 수 없음

 

위치 표시기

• 첫 게임의 프로덕션 마지막 달, 지도를 도저히 구제할 수 없다는 것을 깨닫고

  유저가 게임을 횡단할 수 있도록 돕는 또다른 방법을 찾아냈음.

• 위치 표시기는 절망에서 태어난 아이...(ㅋㅋ) 

  우리는 그저 플레이어에게 맞는 방향을 가리키는 방법이 필요했음

• 게임의 가장 사랑받는 특징 중 하나로 판가름이 남

• 이 이스템을 프렌차이즈 전반으로 확대함

• 아이작이 기동력을 더 가질수록,.. 위치 표시기를 무중력에서 더 잘 작동할 수 있도록 리디자인 해야했음.

 

프론트엔드

• 게임은 하나의 꽉 짜여진 매끄러운 경험으로 디자인되었음

• 속편들에선 트럼본 샷과 빠른장면으로 조금 벗어났지만, 기본적으로 데드 스페이스는 시작부터 끝까지 끊김 없이 플레이하는 게임

• 프론트엔드는 경험의 시작점으로서 디자인되었음

• 게임 안으로 이끄는 포탈(입구)로서 이것을 사용했음

 

• 프론트엔드: 사용자들에게 보여지는 부분 (여기서는 게임 화면~경험도 포괄하는 듯)
• Trombone shot: 줌아웃을 하며 앞으로 나가는 샷 

 

 

DS1의 프론트엔드

• 처음의 프론트엔드를 위한 아주 정교한 계획을 갖고 있었음

• 사람이 뼈와 근육이 뒤틀리고 짓이겨지며 좀비로 변하는 이미지, 영상들과 함께, 유기적 물체에서  홀로그램 메뉴를 보는 것을 포함함

  (DS 도입부에서 괴물 변이 보여주는 것 말하는 듯)

• 프로덕션 후반부 고해상도의 뼈, 근육을 만들기 위한 애니메이션과 모델링 예산이 없었기에 비싸다는 것이 증명됨

• 있는 것으로 어떻게든 해보자고 결정 ... (ㅠㅠ)

• 프로듀서에게 500 달러를 달라고 함

• 비디오 녹화와 해부를 위해 정육점 전등을 삼

(오프라인에서 고기를 도축하고 사진찍어 그 이미지 리소스로 인게임 이미지 제작, 관련된 여러 이미지들 지나감, 영상참조)

 

 

DS2의 프론트엔드

• 게임은 아이작의 뇌 속 잠겨진 Marker에 대한 정보가 중심

• 이것과 스토리텔링을 돕는 UI를 만듬

• 메타게임을 추가; 게임을 진행하다보면 바위의 조각들이 아이작의 뇌 속 Marker로 모임

 

메타게임: (Wiktionary) 게임들에 대한 게임; 단순히 게임을 평범하게 플레이하는 것보다 높은 관점에서, 다른 게임의 룰들을 사용하는 것에 기반한 게임
게임의 메타적인 접근을 말하는 듯- 상위 인지, 생각에 대한 생각
게임 속에서 나=플레이어지만, 나는 플레이어를 바라볼 수 있다(상위 인지)
그런 관점에서 아이작을 메타적 접근해서 프론트엔드에 대한 아이디어를 냈다

 

 

 

DS3의 프론트엔드

• 우리가 해낸 비주얼적으로 가장 야망찬 것 중 하나

• 추상의 한계를 벗어나 환경에 UI를 배치함

• 프론트엔드는 얼음 덩어리 속 괴물의 고기조각이 얼려져있는 실험실에 나타남

• 두번째 게임과 마찬가지로 게임을 진행할수록 더 많은 괴물이 드러나게 했음

 

컨텐츠마다 컴퓨터를 배치하고, 그 컴퓨터에 다가가 접속하면 UI가 띄워짐

다만 이부분은 개인적으로 뎁스가 한단계 늘어나 불편해진 듯 함

 

 

 

10초 고냥이 휴식시간

(자기가 키우는 고양이라고 함)

• 보셈

 

(사이사이 자료 많음, 영상 체크)

룩의 진화

• 이야기는 언제나 게임의 핵심

• UI가 정말로 이야기와 통합되기를 바람

• 이 경우 항상 개성과 arc를 가져야만 함

• 거주하는 환경을 반영하는 것을 확실하게 함으로서 생명을 주었음

• 또한 진전과 성장의 감각을 주고자 함

• (앞서 말했다시피) DS1의 UI는 이시무라 함선의 상태를 반영함

• 부서져있고 불규칙함

• DS2의 UI는 타이탄 스프라울의 광대함을 반영함

• UI는 진보한 환경을 반영해 조금 더 발전하고 매끈해짐

• DS3는 200년 전 유물들이 있는 행성이 무대임

• 레트로 퓨쳐 스타일의 UI로 디자인

• 앞선 2 게임들에서는 유동적인 빛에 기반한 홀로그램이었음 ... DS3는 정제된 프레임의 유리 위에 기반한 홀로그램으로 특정지음

 

(업그레이드) 벤치

• 아이작이 지혜로 도전을 극복해야만 하는, 언제나 지적이고 슬기로운 개인으로서 보여지기를 원했음

• 그의 모든 독창적인 무기들은 건설 장비를 수선한 것임

• 원본 BENCH는 유저에게 그의 무기를 비틀고 수정하도록 업그레이드 트리를 따라 회로를 더하게 함

• 이 특징을 사랑하는 만큼 ... 언제나 여기에 더 많은 것을 하고 싶다는 것을 알았음

• DS3에서는 이 피쳐에 전념하고 리디자인하기로 결정

 

벤치 2.0 디자인하기

• 코어 유저들에게 충분하게 깊지만, 평균적인 게이머들에겐 충분히 간단한, 탄탄한 무기 제작 체계 만드는 것에 도전

• PC 게임들에서 직관적인 제작 체계들을 봤지만, 콘솔에는 은유가 잘 전달되지 않는다는 것을 알았음

• 컨트롤러로 잘 플레이할 수 있는 시스템 만드는 것이 필요했음

 

벤치 2.0 컨셉들

• 본래는 더 아날로그한 은유를 사용했음

• 모든 무기 파츠는 유리 뒤 운반 장치를 가로지르는 작은 박스들임

• 제조 과정을 더욱 "현실감"과 적은 UI로 만들고 싶은 희망이었음

• 이 버전을 정말 오래 진행했음

• 이건 예쁘지만 ... 유저 친화적이지 않다는 것을 인정함

 

벤치 2.0의 문제들

• 다중 스크린은 오래된 DS에서 UI를 이해하는 데 도움이 됬음

• 새 벤치에서 다중 스크린은 스크린에 올린 순전히 많은 정보들과 함께 쓸모 없었음

• 과거에 아이작은 어느 순간이고 화면을 떠나지 않음

• 아이작은 항상 시야에 있음 ... 우리는 풀 스크린 UI를 절대 하지 않음

• 보여줘야 하는, 더 많은 디테일이 있었던 새로운 벤치

• 데브 팀은 벤치 대신 총을 만드는데에 디버깅용으로 계속 사용함

  (이건 벤치를 개발하는 것이 잘못되었다는 것의 명백한 신호였음)

 

벤치 2.1, 2.3, 2.5, 3

• 마지막 반복은 아주 많은 간소화와 사용하게 쉽게 하는 것

• 아날로그 막대의 아주 직관적인 사용으로 실행됨

• 총을 3번의 클릭으로 만드는 것을 허락함

• 표준에서 아주 벗어남에도 불구하고 시스템은 여전히 아주 데드 스페이스 다웠음

 

벤치로부터 배운 교훈들

• 사용하기 쉬운 직관적인 인터페이스를 갖는 것은, 미학적인 관례를 유지하는 것보다 더 궁극적으로 중요하다는 것을 받아들여야 했음

 

마지막 생각들

• 데드 스페이스는 앞으로도 참여 했던 놀라운 프로젝트일 것

• 게임의 세계는 놀라운 혁신들을 고려해야 했음

• 우리의 헌신들이 다음 세대의 게임들에 울려 퍼질 것을 개인적으로 느낌

• 이 게임에 참여할 수 있어 굉장히 행운이라고 느낌

• 이 프렌차이즈에 들어간 순전히 많은 재능들은 믿기 어려울 정도

• 여정을 위해 함께한 모든 당신들에게 감사

 

(QnA는 시간 나면 추가)