2D 배틀 화면, 왼쪽에 설까 오른쪽에 설까

 

 

이 글은 일본의 UI 디자이너 tkm님의 글을 번역한 것입니다. (번역/게시 허가를 받았습니다.)

글에 언급된 두 번째 관점, '연극적 개념'은 한국의 정서에는 익숙하지 않은데, 이 관점이 새로워서 번역을 시작했습니다. 

체험을 중시한 UI 디자인, 특히 일본 시장 진출을 고려한 게임의 경우 참고할 만한 인사이트가 있지 않을까 합니다.

 

번역 시 이해를 돕기 위한 의역, 설명 추가, 가독성 향상을 위한 문장 편집 등을 가한 부분이 있습니다. 

원본 기사는 이쪽에서 읽을 수 있습니다. 

note.com/torinegi/n/n44fbaf628c07

2Dバトル画面、左に立つか右に立つか｜tkm｜note

 

---

 

2D 배틀 화면에서 캐릭터는 왼쪽/오른쪽 중 어느 쪽에 서야 할까?

2D 게임, 특히 RPG 등의 장르에서 '배틀 화면'이라 불리는 장면은 대부분 옆에서 본 시점을 그리는 경우가 많습니다. 

이러한 배틀 장면에서 '주인공과 적, 어느 쪽이 왼쪽이고 어느 쪽이 오른쪽인가' 문제가 자주 부상하곤 합니다. 

문제라고 표현하긴 했지만 정답은 딱히 없기 때문에, 이 글에서는 좌우 어느 쪽에 서느냐에 따라 어떤 의미를 갖는지에 대해 고찰해 보았습니다. 

 

필자가 스마트폰 어플의 UI 디자이너이기 때문에, 예시가 주로 스마트폰 게임이 많은 점 양해 부탁드립니다. 

 

 

1. 시간의 흐름

 

 

 

일반적으로 시간을 시각화했을 때, '왼쪽에서 오른쪽으로 흘러가는 것'이 자연스럽다고 느끼는 경우가 많습니다. 

달력, 연표, 진화론의 도식화 등을 떠올리면 알기 쉽습니다. 주로 왼쪽에서 오른쪽으로 진행되는 경우가 많죠. youtube의 재생바도 마찬가지입니다. 

 

UI나 웹 디자인에서도 화면 동선은 기본적으로 왼쪽에서 오른쪽입니다. 

 

사람의 눈은(시간의 개념과도 관련이 있습니다만) 정보를 얻기 위해 왼쪽에서 오른쪽으로 움직이는 것이 자연스러운 움직임이라고 합니다. 

좌측에 급소가 많기 때문에, 좌측을 경계하는 본능적인 이유도 있다고 하는데 정말인지 아닌지는 모르겠습니다. 

 

아무튼 이 때문에, 화면 오른쪽에서 무언가가 등장할 경우 시선의 움직임과 부딫혀 가속도가 증가하고, 정보를 좀 더 쉽게 얻게 되는 것이 아닐까 생각됩니다. 

알기 쉽게 예를 들자면, 니코니코동화(*1)의 경우 문자량이 그렇게 많음에도 불구하고, 시선과 문자가 교차하기 때문에, 눈의 이동 피로를 억제할 수 있고, 결과적으로 대량의 정보를 쉽게 처리할 수 있는 것입니다. 

비슷한 예시로, 태고의 달인(*2)에서 노트가 왼쪽에서부터 등장한다면 아마 난이도가 몇 배로 증가하겠죠.

 

 

 

(*1 니코니코동화 : 일본 DWANGO에서 운영하는 동영상 사이트. 코멘트를 남기면 동영상 오른쪽에서 왼쪽으로 코멘트가 흘러가며 등장한다.)

(*2 태고의 달인 : 일본 NAMCO에서 제작한 북치기 리듬 게임. 노트가 오른쪽에서 왼쪽으로 흘러가며 나온다.)

 

 

즉 다시 말하면, 사람(특히 현대인)은 왼쪽 끝을 0이라고 생각하는 습관을 갖고 있기 때문에, 새로운 일은 기본적으로 오른쪽에서 발생한다고 예상하는 경우가 많다는 의미입니다. 

왼쪽이 과거/오른쪽이 미래라는 사고방식에 기초하면, 배틀 중 스테이지가 이동하는 것(화면 구성 상 '진행'을 느낄 수 있는 것)은 왼쪽에서 오른쪽으로 흘러가게 되고, 이에 따라 주인공이 왼쪽에 서고, 새로운 적들이 오른쪽에서 등장하는 형태의 게임이 많은 것도 굉장히 설득력이 있습니다. 

 

 

프린세스 코넥트 Re:Dive, 시노앨리스, 라스트 피리오드 등

 

 

 

2. 무대의 개념(카미테, 시모테)

 

 

한편 연극/영화/애니메이션의 표현에 있어서는, 관객(시청자)가 봤을 때 오른쪽이 '카미테(上手)', 왼쪽이 '시모테(下手)'라는 개념이 있습니다. 

 

* 카미테 : 관객이 봤을 때 무대의 오른쪽. 상위의 것, 주역, 강자가 서는 자리

* 시모테 : 관객이 봤을 때 무대의 왼쪽. 하위의 것, 부정적인 것, 약자가 서는 자리

 

이 개념을 빌려 오자면, 무대 중 '높은 것, 중요한 것, 주역'은 오른쪽에 배치되고, 악역이나 대항 세력은 왼쪽에 배치되는 일이 잦습니다. 

 

연극 중에서 등장인물은 기본적으로, 관객이 봤을 때 오른쪽(카미테)에서 등장하여 왼쪽(시모테)로 사라져 갑니다. 즉 이 동선에 따르자면 '오른쪽에서 왼쪽으로(←)' 흘러가는 것이 자연스럽다고 할 수 있습니다. 

 

* 아래는 '카미테, 시모테란. 영화에서도 사용되는 연극적 용어와 연출법'에 관한 기사입니다. 

enshutsu-kyokasho.seesaa.net/article/369723121.html

上手・下手とは。映画でも使われる演劇用語と演出法

 

이 사고방식에 기초하여, 무대 연출을 참고하여 디자인한 게임에서는 '주인공이 오른쪽'에 서는 것이 자연스럽기 때문에 '캐릭터가 오른쪽에 선다'는 사고방식이 차용됩니다. 

파이널판타지, 로맨싱 사가 등 서사가 뛰어난 RPG에서 '오른쪽 배치'가 자주 보이는 것도 아마 이러한 이유일 듯합니다. 

캐릭터가 중심이 되어서, '적들이 몰려온다'는 연출을 사용할 경우가 이에 해당하죠.

 

 

FGO, FFRK 등

 

 

 

3. 조작의 주축

시간의 흐름, 무대의 개념 등은 비교적 보편적인 이유입니다. 한편, 게임 독자적인 이유에서 위치가 정해지는 경우도 있습니다. 

바로 '조작법과 손가락의 관계성'입니다. 

 

일반적으로 아케이드 게임이나 콘솔 게임에서는, 조이패드의 왼쪽에 있는 스틱을 사용해 이동을 하고, 오른쪽에 있는 버튼을 통해 결정 등의 행위를 행하는 경우가 많습니다. 

이처럼 물리 디바이스에서는 '왼쪽이 주된 조작/이동', '오른쪽이 결정'이라는 문맥이 존재하기 때문에, 게임 내에서 플레이어의 조작이 어떤 식으로 캐릭터에게 영향을 미치는지에 따라 위치가 결정되는 일도 있습니다. 

 

 

 

 

* 왼쪽 : 이동, 선택

* 오른쪽 : 결정, 취소, 전환

 

필자가 좋아하는 '테일즈' 시리즈나, 아까도 예를 들었던 '파이널 판타지' 시리즈는 둘 다 캐릭터의 개성이 강한 RPG입니다. 

 

테일즈 시리즈에서 전투는 '플레이어 스스로가 액션 게임처럼 활발하게 캐릭터를 움직이는 것'입니다. 이 때문에 조작의 주축이 되는 스틱이 위치한 '왼쪽'에 캐릭터도 위치하는 것이 자연스럽습니다. 자신의 신체의 연장선상에서 캐릭터를 움직이는 감각을 얻기 쉽죠.

 

한편 파이널 판타지의 경우, 플레이어가 큰 행동(공격한다/방어한다)을 지정하는 것이 전투입니다. 이에 따라 주된 조작을 행하는 결정 버튼이 위치한 오른쪽에 캐릭터가 서는 것이 자연스럽습니다. 캐릭터의 사상과 동작을 오른쪽으로 결정하는 이미지에 가깝습니다. 

 

<몰입하여 인격을 부여한 채로 조작하는 존재>로서의 캐릭터인지, 혹은 <객관적으로 바라보는 존재>로서의 캐릭터인지, 어느 쪽의 성향이 더 강한 게임인지에 따라 달라지는 부분이라고 할 수도 있겠습니다. 

 

(참고로 필자는 테일즈 시리즈는 레전디아, 파이널 판타지는 9를 좋아합니다.)

 

또한 스마트폰 게임 어플리케이션의 경우, 이러한 조작을 화면을 직접 터치함으로써 수행할 필요가 있습니다.

<Fate/Grand Order>의 배틀 화면을 예로 들어 보겠습니다. 전투의 주된 흐름은 다음과 같습니다. 

 

적의 정보를 본다
스킬을 사용할지 고민한다
Attack을 선택한다
아츠를 선택한다
결정 버튼을 누른다

 

페이트/그랜드 오더 공식 사이트에서 가져온 이미지입니다.

 

 

 

각각의 단계의 완료 행동을 의미하는 '결정' 버튼이 정보/시선의 흐름을 따라 배치되어 있습니다. 

즉, 조작의 규칙에 의거하여 우측 하단에 놓여 있는 것을 알 수 있습니다. 

 

'결정' 버튼을 눌러야만 캐릭터가 행동을 하기 때문에, 아군 캐릭터가 오른쪽에 위치해 있죠. 

<그랑블루 판타지>도 이와 비슷한 이유에서 유사한 UI를 구성하고 있다고 볼 수 있습니다. 

 

그랑블루 얘기가 나와서 첨언하자면, 스마트폰 게임에서 발생할 수 있는 예외적인 조작법으로 '스마트폰을 드는 방법'이 있습니다. 

세로 방향의 게임일 경우 오른손으로 플레이하는 사람이 많기 때문에, 메인 포인팅 장치인 오른손 엄지가 캐릭터와 겹치지 않도록 캐릭터를 왼쪽에 배치하는 등, 화면 외적인 물리적 제한도 UI에 영향을 주는 경우가 있습니다. (이는 단순히 캐릭터뿐만 아니라 UI 전체에 걸쳐서 적용되는 이야기입니다)

 

 

정리

캐릭터를 왼쪽에 두는 경우

- 게임(컴퓨터 장치)의 문맥

- 플레이어의 신체 감각의 연장선에서 플레이하는 체험을 제공하고 싶을 경우

(시선의 흐름을 따라 캐릭터를 움직이게 하기 쉽기 때문에, 액션 요소가 강한 게임이 어울립니다)

- 공간, 시간, 서사적으로 '진행되고' 있는 것을 표현하고 싶을 경우

- 모험, 침공, 강력한 적을 능동적으로 공격하러 가는 인상을 연출하고 싶을 경우

(주인공의 입장에서 봤을 때, 적/미개척지/새로운 영역으로 나아가는 상황이 되기 때문입니다)

 

움직임이 큰 액션 게임, 캐릭터가 미지의 장소를 모험하듯 진행하는 게임 등에 어울립니다. 

 

 

캐릭터를 오른쪽에 두는 경우

- 연극적 문맥

- 시선이 자연스럽게 움직이기 때문에, 수동적인 체험을 전달하는 것에 효과적

- 장소를 이동하지 않는 배틀(공간을 제한하는 경우)

- 캐릭터에게 지시를 내리는 듯한 전투(결정 동작이 중심이 되는 전투)

- 쳐들어온 적을 공격하거나 퇴격하는 인상을 주고 싶을 경우

- 캐릭터에게 강한 인상(개성)이나 제압감, 존재감을 부여하고 싶을 경우

(적이 '예정된 방문자, 주인공이 당연히 상대해야 할 존재'로 표현되기 쉽습니다)

 

캐릭터가 수동적으로 장애물과 맞서 싸우는 체험에 어울리고, 영화적/연극적 표현을 전투에 도입하고 싶은 게임, 액션보다는 지시에 중점을 둔 게임에 적합한 표현 방식입니다. 

 

 

---

 

길게 적었지만 최종적으로는, 게임 시스템/내러티브를 고려한 자연스러움, UI의 편의, 보기 좋음, 유사 장르의 암묵적 약속 등을 총체적으로 고려하여 판단하는 것이 제일 적합할 것입니다. 

그 상황을 고려하더라도 고민스러울 때 이 글이 판단 기준으로서, 지식으로서 도움이 되길 바라며 작성하였습니다.