https://imseongkang.wordpress.com/2016/03/21/scrollback/ -번역본 원주소

'mushroom 11' 이라는 안티-횡스크롤 게임을 만든 개발자 itay karen이

GDC 2015에서 발표한 횡스크롤 게임(사이드 스크롤러)의 카메라워크에 대한 연구자료인디

보다보니 유익하기도 하고 재밌어서 몇달전부터 번역하다가

반쯤 번역했을때 이미 어떤 분이 완벽하게 번역본을 올렸었다는 것을 알게됨...

암튼 전에 했던 번역이 넘모 아깝기도 해서

이 번역본이랑 전에 했던 번역본을 섞어서 짬뽕 번역본을 만들어 봤삼

찐 번역본은 원문이 나타내는 의미가 모호해지는 경우를 우려해서

원본에 등장하는 관련 용어같은 경우는 최대한 영어 표현을 따르게 번역했는데

요 짬뽕 번역본은 영어 용어들 중에서 한글로도 충분히 설명가능한 것들이 쪼금더 보이길래 몇 개 좀 바꿔놨고

(anchor point -> 앵커 포인트 -> 기준점으로 재번역)

가독성을 좀 높여볼라구 엔터 남발하면서 문단도 다 떨어트려봤삼

그리고 나름 내좃대로 글을 다듬으려고 한 부분도 끼워져 있을 것임

요 짬뽕 번역본을 만들면서 찐 번역본보다 좀더 맥락에 맞으면서도 읽기 쉽게 만들려고 노력은 해봤는디

몬가.. 몬가 좀 불편할 부분이 있을 것도 같삼

그러니 읽다가 이쌔끼 짬뽕번역본 존내맘에안드내??? 이런 생각이 든다면

바로 위에 링크타고 찐 번역본을 보러가는 것이 현명한 선택일 것이라 생각하삼...

================================================================

Scroll Back : ‘사이드 스크롤러(횡스크롤 게임)’ 의 카메라 시점에 대한 이론과 관례들

Untame 스튜디오의 대표이자, 곧 발매하는 게임인 Mushroom 11의 제작자 - Itay Keren 저

- 개요

제 게임인 Mushroom 11(http://mushroom11.com/)을 개발하는 동안, 저는 디자인/기술적인 면에서 여러 난제에 부딪쳤습니다.

동적으로 모양을 변하게 만드는 것이나 버텍스 애니메이션 등에 대해 참고 자료가 있을 거라고 생각하지는 않았지만,

게임이란 분야에서 30년 이상의 역사를 가지고 있는 ‘카메라 워크’ 가 거의 논의되지 않았다는 점은 꽤 놀라운 부분이었습니다.

그래서 저는 ‘2D 게임의 역사’ 에 대한 여정을 시작하면서,

지금까지 어떠한 난제들이 있었고, 그 난제들에 대해 어떻게 접근했고, 각자의 해법이 어떻게 진화해왔는지 적어보기로 했습니다.

해법들이 수없이 많고 다양한 데에 비해 그에 대한 적절한 용어도 부족했기 때문에

저는 그것들을 모아서 그룹으로 분류하고, 제가 용어를 만들어 붙였습니다. 그냥 제 개인 참고 자료로 삼으려고 말이죠.

==

- 스크롤링

'스크롤링' 또는 '패닝' 은 한 화면의 크기보다 더 큰 씬을 보여주려는 모든 방법을 가리킵니다.

사이드-스크롤러에는 수많은 난제들이 있습니다.

플레이어가 어디를 보게 선택할 것인지,

우리 디자이너들은 플레이어가 무엇에 집중하길 바라는지,

그리고 이를 어떻게 하면 플레이어 입장에서 끊김없이 부드럽게 이어지면서도 편안하게 만들지 같은 것들 말이죠.

제 글은 2D 카메라 시스템에 집중하겠지만, 일반적인 개념들은 3D에도 잘 적용되는 것이 많습니다.

==

- 신경학 배경 지식

다른 게임들을 살펴보기 전에 스크롤링 관련 신경학 배경 지식을 살짝 다뤄보겠습니다.

그럼 우리들의 시각과 인지에 대해서 좀 더 잘 이해할 수 있을 테고,

그 결과로 어떻게 하면 스크롤링이 어떻게 잘못될 수 있을지를 알 수 있게 될 겁니다.

- 망막의 중심와(fovea-centralis)는 우리 안구 안쪽에 있는 수용체로서

중심 시각이 뚜렷하고 자세히 보이게 하는 일을 합니다.

제2, 제3의 수용체 대인 부중심와(parafovea)와 중심와주위(perifovea)는

이미지와 동작을 패턴으로 축소시켜, 변화를 빨리 인지할 수 있게 하는 것에 뛰어납니다.

익숙한 경고 모양을 인지하거나 동작의 속도나 방향이 변하는 일 같은 것 말이죠.

이런 시각 입력 신호는 뇌의 편도체로 바로 연결되는 통로를 이용해서,

시각 피질이 입력 신호를 해독하는 동안에도 경고 반응을 할 수 있도록 합니다.

뇌를 훈련시키면 - 특히 주변 시각에서 움직이는 것을 마음대로 고정할 수 있게 훈련하게 된다면 꽤 쓸만하답니다.

- 내이 속의 전정계(vestibular system)는 평형 유지와 공간 방향 제시를 담당합니다.

특정한 세부적인 것에 시각을 집중하면서도 몸이 평형을 유지할 수 있는 건 전정계에서 신호를 보내기 때문입니다.

저에게도 일어나는 일이지만,

차 안에서 책을 읽으면 메스껍거나 현기증이 나는 사람들이 있습니다.

몸은 가속되는데 그에 맞는 시각적 피드백이 부족하기 때문이죠.

그리고 그 반대의 경우에도 마찬가지입니다.

중심와주위가 배경의 변화를 빨리 알아차리면,

전정계에서 그에 맞는 피드백이 올 거라고 기대하죠.

그런데 컴퓨터 앞에 똑바로 앉아있음으로 인해 피드백이 오지 않는다면,

그로 인한 결과는 똑같게 될 수밖에 없습니다.

그러니 이 감각 신호, 즉 시각계와 전정계가 충돌할 때, 몸이 불편하거나 멀미가 날 수 있습니다.

3D, 특히 VR에서 이런 현상이 더 심하긴 하지만, 2D 게임에서도 이런 일이 꽤 많습니다.

- 주목성과 상호 작용, 그리고 편안함

사이드-스크롤러에서 일어나는 문제점에 대한 이해를 돕기 위해,

저는 사이드 스크롤러의 요소를 세 가지의 주요 과제로 분류했습니다.

주목성 :

카메라워크를 이용해서 플레이어에게 게임 정보와 피드백을 충분히 제공하는 것 (플레이어가 봐야할 것)

상호작용성 :

화면에 표시되는 것에 대해 플레이어가 명확하게 컨트롤 할 수 있게 할 것.

배경 변화를 예측가능하게 하고 컨트롤에 밀접하게 연관시킬 것. (플레이어가 보고 싶어하는 것)

편안함:

플레이어가 이해할 수 있도록 배경 변화를 쉽게 만들고 맥락에 맞출 것

(플레이어가 봐야할 것과 보고 싶어하는 것이 어떻게 부드럽고 편안하게 조화를 이루는가)

- 사이드 스크롤러의 향수(鄕愁)

자, 이제 1980년대로 거슬러 올라가 봅시다.

30년 뒤인 현재로서는 상상하기도 어려운 기술적 제한들을

디자이너들이 완전히 새로운 디자인 구조를 발명해서 극복하던 시절이죠.

지난 10년 간 있었던 여러 뛰어난 인디 게임들도 참고 자료로 넣었습니다.

인디 아티스트들에게서 기대할 법한 혁신, 집중, 세심함들을 항상 선보이려던 게임들입니다.

카메라 워크도 물론 예외가 아니죠.

- 액션의 발자취를 좇으며

컨트롤하는 대상에 집중하라.

기초부터 시작해보죠.

대체로 여러분의 플레이어는 메인 캐릭터에 대해 조작권을 갖고 있습니다.

즉, 플레이어의 주의 집중이 메인 캐릭터에서 이뤄져야 한다는 뜻입니다.

그 캐릭터를 카메라로 바싹 좇아가는 식으로 말이죠.

80년대 초반, 사이드 스크롤러의 개발은 어려운 일이었습니다.

개발자들은 CPU나 메모리 용량, 메모리 분할 등의 기술적 한계를 마주해야만 했습니다.

그렇지만, 이런 난제들이 있음에도 이 한계들을 우아하게 극복하는 훌륭한 횡스크롤 게임들이 출시되었습니다.

하지만 대부분은 동작을 겨우 알아볼 수 있을 정도로 단순하거나 저해상도였죠.

Rally-X © 1980 Namco

포지션-락: 카메라가 플레이어의 위치에 고정되어 있음

(이 글에서 다루는 용어는 제 자신이 참고하고 작업하려고 만든 거에요.

하지만, 유용하다고 생각하거나, 개선안을 주거나, 제게 피드백을 주시면 기쁘겠네요.)

그렇기에 1980년에 ‘랠리-X’ 와 같은 게임이 기술의 한계를 극복하고

진정한 이중 축 카메라를 선보일 수 있었다는 것은 놀라운 일입니다.

이 게임은 기본적인 포지션-락 메커니즘을 이용해,

포커스를 항상 자동차에 맞춰 카메라 동작을 완전히 예측가능하게 만들었죠.

Kung-Fu Master © 1984 Irem

포지션 락

엣지 스냅: 카메라 위치의 가장자리(엣지)를 특정 값으로 고정함

(엣지 스냅은 게임마다 다 언급하기엔 너무 흔한 거라 지금부터는 무시할게요.)

‘쿵푸 마스터(Kung-Fu Master)’는 포지션 락을 훌륭하게 다룬 또다른 예입니다.

타카시 니시야마가 디자인했는데,

이 분은 ‘문패트롤(Moon Patrol)’도 디자인했고, 후에 ‘스트리트파이터(Street Fighter)’도 만드셨죠.

이 게임은 제가 엣지 스냅(edge snap)이라고 부르는 또 다른 기본적인 메커니즘도 사용하고 있어요.

각 레벨의 가장자리에서 카메라 움직임을 끊어버려서, 캐릭터가 기준점에서 멀어질 수 있게 하는 거죠.

Terraria © 2011 Re-Logic

포지션 락

포지션 락 방식은 기본적이지만 아주 유용합니다.

테라리아(Terraria)처럼 화면에 비해 캐릭터가 작고 점프도 낮은 제작 어드벤처 게임에서는,

모든 방향에 대해 충분한 공간을 보여주기 때문에 아주 잘 통합니다.

-카메라 모션에 제한을 걸기

불필요하거나 예측불가능하게 부딪치는 걸 피하라.

꼭 필요한 게 아니라면 카메라를 움직이지 않을 방법은 없을까요?

30년 전에는 화면을 스크롤하는 것에 여러 문제가 있었습니다.

CPU를 많이 써야 했고 화면의 주요한 부분을 재생시켜야 했습니다.

성공 사례에서조차 당시에는 픽셀이 커다랬기 때문에 스크롤이 뚝뚝 끊기는 것처럼 보였습니다.

그렇다면 가장 훌륭한 접근 방식은 필요한만큼만 최소한으로 스크롤하는 것이었습니다.

그중 하나는 캐릭터가 특정 화면(window) 안에서만 움직이도록 하되,

캐릭터가 그 화면의 가장자리를 밀 때만 스크롤하는 것이었습니다.

Jump Bug © 1981 Hoei/Coreland (Alpha Denshi)

카메라 윈도우: 플레이어가 화면(Window) 가장자리에 닿으면 그 방향으로 카메라 위치를 밀어냄

‘점프 버그(Jump Bug)’는 최초의 플랫포머 게임이라 널리 알려져 있습니다.

기술적으로 보면, 플레이어는 자동으로 반복해서 점프할 뿐이고,

컨트롤은 왼쪽과 오른쪽 중 어디로 갈 것인지, 얼마나 높이 점프할 것인지에 한정되어 있었습니다.

게임의 대부분은 카메라가 자동으로 움직여서 플레이어가 계속 올라가게 강제하는 것이었습니다.

당시의 다른 많은 스크롤 게임처럼 장애물을 피하면서 말이죠.

하지만 마지막 레벨에서 사용된 카메라 윈도우(camera window) 테크닉은,

많은 디자이너들이 그런 게 있는 지도 몰랐었던 문제를 풀어냈고,

이후 수천 개의 플랫포머가 그 뒤를 따르게 될 표준을 만들었습니다.

카메라 윈도우 테크닉은 또한 여러 문제도 만들어냈는데요.

플레이어가 출구를 향해 점프할 때, 플레이어의 전방이나 위에서 뭐가 다가오는지 아주 조금만 볼 수 있다는 것이 그 중 하나죠.

Rastan Saga © 1987 Taito

카메라 윈도우

제가 정말 좋아하는 게임 중 하나인 ‘라스탄 사가(Rastan Saga)’에서는,

플레이어가 두 방향으로 움직일 수 있고, 그에 따라 여러 다양한 경로를 선택할 수 있는 방식을 도입했습니다.

카메라와 게임 역학의 관계를 정말로 진화시킨 최초의 게임들 중 하나이기도 하죠.

이 게임에서 화면의 높이는 통상 점프 높이와 같습니다.

따라서 캐릭터가 화면 안에서 이미 움직이지 않았다면,

점프를 하는 것만으로는 수직 카메라 이동이 일어나지 않았습니다.

재빠른 카메라를 원하는 얼간이들의 수요를 없애버렸죠.

이 방식의 주요 결점은, 위에서 다가오는 적은 덜 눈에 띈다는 겁니다.

특히 캐릭터가 윈도우 안에서 이미 수직으로 움직였을 땐 말이죠.

또한 왼쪽으로 움직일 때(성 스테이지에서는 그럴 일이 많았음)는 전방 시야가 아주 좁았기 때문에 정말로 불편했습니다.

Fez © 2012 Polytron Corporation

카메라 윈도우* (수평) – (차원 이동 동안에도 강제됨)

포지션 락 (수직) - [선형 보간 스무딩 / 리전 기반 앵커/ 수동 조작 – (오른쪽 스틱으로 좀 더 멀리 패닝할 수 있음)]

카메라 윈도우 테크닉은 현대 게임에도 여전히 쓰이고 있습니다.

‘페즈(Fez)’에서 차원 이동을 하는 중에도 수평적인 카메라 윈도우가 어떻게 유지되는지 보세요.

사실 이동 축은 캐릭터를 화면 안에 두는 쪽으로 결정됩니다.

페즈에서 카메라 윈도우를 선택한 것은 통상적인 선택은 아녜요.

이런 독특한 게임 메커닉을 위해 아주 이상적인 카메라 해법을 택한 것이죠. 관련해선 나중에 더 보죠.

수직적으로는 단순한 포지션 락을 쓰는데, 선형 보간 스무딩(lerp smoothing)으로 좀 더 부드럽게 다듬었죠. 이건 뒤에 더 얘기할게요.