'이 책은 게임 개발 도구의 사용자 경험을 개선하기 위한 궁극적인 가이드입니다.'
관련 분야: 게임 기획, 프로그래밍, 콘솔, PC, 자료 조사
작성자: 데이비드 라이트본(David Lightbown), 블로거
작성일: 2026년 1월 7일
다음 발췌문은 데이비드 라이트본의 저서 '게임 개발 도구의 사용자 경험 디자인(Designing the User Experience of Game Development Tools)' 제2판에서 인용되었습니다.
발췌문:
B. 등잔 밑이 어둡다
이 책을 읽기 전에도 이미 일부 디자인 개념과 그것이 게임 도구에 어떻게 적용되는지 알고 있었을지도 모른다는 사실을 알고 계셨나요? 그 모든 것은 바로 여러분 앞에 항상 있었던 익숙한 원천, 즉 게임에서 나옵니다!
속도와 정확성이 중요한 경쟁 게임(실시간 전략 및 격투 게임 등)은 도구에 적용할 수 있는 다양한 사용자 경험 개념을 이해하는 데 도움이 될 수 있습니다. 이 몇 가지 개념을 살펴보면, 여러분이 생각보다 더 많은 것을 알고 있다는 사실에 놀라게 될 것입니다!
실시간 전략 게임과 청킹(Chunking)
먼저, 실시간 전략 게임을 아는 것이 어떻게 여러분이 청킹[1]의 개념을 이미 이해하고 있음을 의미할 수 있는지 살펴보겠습니다.
브루드 워의 챔피언 BoxeR
스타크래프트: 브루드 워의 역대 최고 선수 중 한 명은 BoxeR(임요환)입니다. 프로 스타크래프트 선수의 여러 기술 중 하나는 공격에 방어하기 위해 정확히 적절한 유형과 수의 유닛을 뽑는 능력입니다.
스타크래프트는 많은 훌륭한 RTS 게임과 마찬가지로 각 유닛이 특정 유닛에 강하고 다른 유닛에 약한 "가위바위보"식 디자인을 가지고 있습니다. 이것이 의미하는 바는 만약 BoxeR의 상대가 가위에 해당하는 유닛으로 공격하면, BoxeR는 보가 아닌 바위에 해당하는 유닛으로 빠르게 방어한다는 것입니다.
그림 B.1: 스타크래프트 © 블리자드 엔터테인먼트
예를 들어, BoxeR의 상대가 저그(Zerg)이고 뮤탈리스크(Mutalisks)와 저글링(Zerglings) 조합으로 공격한다고 가정해 봅시다. 이 조합은 매우 흔해서 "뮤탈링(Mutaling)"이라는 별명까지 있습니다. BoxeR는 이를 보는 즉시 시즈 탱크(Siege Tanks)와 마린(Marines)을 뽑기 시작하는데, 이들이 해당 조합에 매우 효과적인 유닛들이기 때문입니다.
그렇다면 어떻게 BoxeR는 이렇게 빨리 대처할 수 있을까요? 상당 부분은 청킹을 효과적으로 사용하는 그의 능력 덕분입니다.
그림 B.2: Unsplash의 Nick Fewings 사진
체스와 청킹
게임과 청킹에 관한 가장 훌륭한 시연 중 하나는 심리학자 크리스토퍼 차브리스(Christopher Chabris)와 다니엘 시몬스(Daniel Simons)[3]에 의해 수행된 복제 연구[2]에서 나옵니다.
그들의 연구에서 그들은 참가자들에게 다양한 위치에 기물들이 놓인 체스판 사진이 담긴 카드들을 한 번에 하나씩 보여주었습니다. 그들은 참가자들에게 카드를 학습할 시간 30초를 준 뒤, 그것을 치우고 실제 체스판 위에 방금 본 카드와 같은 위치에 기억을 더듬어 기물들을 배치하도록 했습니다.
연구 참가자들의 실력 수준은 초보자부터 그랜드마스터까지 다양했습니다. 이러한 이유로, 특정 카드에 대해서는 그랜드마스터가 초보자보다 훨씬 뛰어났다는 사실을 알아도 놀랍지 않을 것입니다. 하지만 여러분은 어떤 다른 카드들에 대해서는 초보자가 그랜드마스터와 대등했다는 사실은 예상하지 못했을 것입니다. 어떻게 그것이 가능했을까요?
그 이유는 그랜드마스터가 초보자보다 더 잘했던 카드는 그럴듯한 체스 포지션이 있는 실제 게임의 카드였고(그림 B.3의 왼쪽), 초보자와 대등했던 카드는 체스 기물들이 무작위로 배치된 카드였기 때문입니다(그림 B.3의 오른쪽).
그림 B.3: 체스 연구에 사용된 카드의 재현.
그랜드마스터의 관점에서 볼 때, 카드의 체스판은 개별 기물들로 구성된 것이 아니라 수많은 체스 게임을 통해 보아온 포지션에 있는 기물들의 "군집(clusters)"입니다(그림 B.4의 왼쪽). 시간이 지나면서 이들은 청크로 내면화됩니다.
하지만 무작위로 배치된 기물이 있는 카드는 두 명의 왕이 나란히 있거나, 같은 색깔 칸에 두 명의 화이트 비숍이 있는 등 불가능한 시나리오를 담고 있을 수 있습니다(그림 B.4의 오른쪽). 이것들은 체스 선수가 결코 볼 수 없는 것이며, 따라서 청크로 내면화될 수 없습니다.
그림 B.4: 기물들의 일반적인 2x2 "청크"(왼쪽)와 불가능하거나 희박한 체스 포지션(오른쪽).
따라서 각 기물의 위치를 개별적으로 암기하는 대신, 그랜드마스터는 반복적으로 보며 이미 내면화된 몇 개의 청크를 암기했습니다. 반면 그랜드마스터만큼의 수와 다양성의 청크를 발달시키지 못한 초보 플레이어들은 대부분의 기물 위치를 개별적으로 기억해야 했습니다.
그러나 카드가 무작위 체스 포지션으로 구성되었을 때, 그랜드마스터는 카드를 암기하는 데 도움을 줄 청크를 사용할 수 없었습니다. 이러한 이유로 그들은 초보자와 실력이 같았습니다.
이제 이것이 BoxeR에게 어떻게 적용되는지 알 수 있습니다: 그가 뮤탈리스크와 저글링의 조합을 볼 때, 그는 개별 유닛을 보는 것이 아니라 하나의 청크를 보며, 그것이 훨씬 더 빠르게 반응하여 방어에 필요한 것을 정확히 뽑을 수 있게 해줍니다.
TRS 청킹하기
그렇다면 이 모든 아이디어를 도구 디자인에 어떻게 적용할 수 있을까요?[4]
레벨 에디터나 3D 애니메이션 소프트웨어에서 가장 흔한 사용자 인터페이스 패턴 중 하나는 Translate Rotate Scale 컨트롤, 줄여서 TRS입니다. 이것은 이동(때로는 위치라고 불림), 회전, 크기를 나타내는 X, Y, Z 값을 나타내는 숫자 입력창의 3x3 그리드입니다.
이것은 거의 항상 같은 순서로 보입니다: 첫 번째 가로줄인 3개의 숫자 입력창은 이동 XYZ(오브젝트의 위치)를 나타내고, 두 번째 줄은 회전의 세 축을 위한 것이며, 세 번째 줄은 크기(오브젝트의 크기)를 위한 것입니다.
사람들이 이러한 종류의 TRS 컨트롤을 사용함에 따라, 그들은 숫자를 빠르게 해석하기 위해 청크를 발달시키기 시작합니다. 예를 들어, 첫 번째 줄이 3개의 0이고, 두 번째 줄이 3개의 0이며, 세 번째 줄이 3개의 1이라면, 그들은 오브젝트가 회전이나 크기 변형 없이 세계의 중심에 있다는 것을 압니다(그림 B.5 참조).
그림 B.5: Unity와 Maya의 TRS 컨트롤 기본값, © Unity, © Autodesk
그러나 TRS 컨트롤이 같은 순서나 방향이 아니라면 어떻게 될까요? 그림 B.6에서 게임 엔진 Stingray의 에디터는 숫자 입력창의 방향을 가로가 아닌 세로로 뒤집어 놓았고, 3D DCC Softimage|XSI는 크기(Scale)를 먼저 두고 그다음에 회전(Rotation), 그다음 위치(Position/Translation)를 두는 것을 볼 수 있습니다.
이렇게 하는 것의 단점 중 하나는 사람들이 다른 소프트웨어를 사용하며 배운 것과 같은 청크를 사용할 수 없다는 점입니다. 따라서 첫 번째 줄의 0 세 개, 두 번째 줄의 0 세 개, 세 번째 줄의 1 세 개를 보는 것이 완전히 다른 것을 의미하게 됩니다.
또한 만약 누군가 두 개의 서로 다른 도구(하나는 자산을 생성하고 다른 하나는 자산을 레벨에 배치하는 도구)를 번갈아 가며 작업하는데 각 도구의 TRS 컨트롤이 다르다면, 그들이 도구를 전환할 때 혼란을 야기할 수 있습니다.
그림 B.6: Stingray와 Softimage XSI의 TRS 컨트롤 © Autodesk
여기서의 교훈은 사람들이 도구의 한 부분에서 다음 부분으로 정보를 청킹할 수 있도록 도구의 모든 부분에서 데이터를 일관된 순서로 제시하는 것이 중요하다는 점입니다. 만약 같은 데이터가 도구의 다양한 부분에서 다르게 제시된다면, 사용자들이 정보의 청크를 내면화하고 이를 사용해 더 효율적으로 작업하기가 더 어려워질 것입니다.
나아가, 만약 사용자가 이미 익숙한 다른 소프트웨어와 같은 패턴(TRS 컨트롤 같은)을 사용하는 도구를 제작한다면, 그들이 이미 내면화한 청크를 활용할 수 있도록 같은 순서와 구성을 사용하십시오.
그림 B.7: Unsplash의 Jack Pierce 사진
격투 게임과 인간의 시각
다음으로, 격투 게임을 아는 것이 눈과 뇌가 어떻게 함께 작동하는지에 대해 이미 조금 알고 있음을 의미할 수 있는지 살펴보겠습니다.[5]
사카드 억제(Saccadic Masking)
사카드 억제를 이해하려면 먼저 사카드(Saccades)와 고정(Fixations)을 이해해야 합니다. 고정은 눈이 집중하고 있는 지점이며, 사카드는 초점이 한 지점에서 다른 지점으로 이동할 때입니다(그림 B.8 참조).
그림 B.8: 사카드와 고정
우리 눈이 사카드할 때, 우리 뇌는 세상을 안정적으로 인식하고 모션 블러를 줄이기 위해 일시적으로 시각 처리를 차단합니다. 이것이 의미하는 바는 우리가 인지하지도 못한 채 아주 짧은 순간 동안 눈이 먼 상태가 된다는 것입니다!
사카드 억제의 효과를 보여주는 가장 훌륭한 연구 중 하나는 팀 스미스(Tim Smith)에 의해 수행되었습니다[6]. 연구에서 그는 시선 추적 장치를 사용해 참가자들의 눈을 추적하는 동안 이미지를 보여주었습니다. 장치가 사카드를 감지했을 때, 이미지의 요소들이 바뀌거나 사라졌습니다. 참가자들은 대부분의 변화를 알아차리지 못했는데, 그 순간에 사실상 눈이 먼 상태였기 때문입니다.
중심시(Foveal) 대 주변시(Peripheral)
중심시는 때때로 "중앙 시력"이라고 불리며, 가장 선명한 시야의 가운데 부분입니다. 주변시는 중앙 주변의 다른 모든 부분입니다. 그것은 중심시만큼 선명하지 않습니다.
일부 측정에 따르면 우리 주변시의 극단적인 가장자리 해상도는 1피트당 3픽셀 수준으로 낮습니다(하지만 색상과 움직임을 감지하는 데는 더 뛰어납니다). 우리 뇌는 특히 이전에 본 적이 있는 것이라면 해상도의 일부를 "채워 넣음"으로써 보완합니다. 이것은 우리가 무언가를 똑바로 쳐다보지 않는 한, 우리가 생각하는 것만큼 그것을 명확하게 보지 못한다는 것을 의미합니다.
그렇다면 이 모든 것이 격투 게임과 어떻게 연결될까요?
Sako와 센트리(Sentry)
Sako는 스트리트 파이터에서의 기술로 주로 알려진 최고의 격투 게임 플레이어 중 한 명입니다. 그는 자신의 이블 류(Evil Ryu)로 매우 잘 알려져 있어서 그의 이름을 딴 콤보가 있을 정도입니다.
2010년대 초반, 스틸시리즈(Steelseries)라는 회사는 게임 커뮤니티에 시선 추적을 도입하기 위해 센트리 아이 트래커(그림 B.9)라는 장치를 출시했습니다. 이것의 목적은 게이머들이 자신의 눈 움직임을 확인하여 성능을 향상할 수 있도록 돕는 것이었습니다. 그들은 Sako와 팀을 이루어 그가 센트리 아이 트래커를 사용하며 스트리트 파이터를 플레이하는 영상을 공개했습니다.
그림 B.9: 스틸시리즈의 센트리 아이 트래커. SteelSeries®는 SteelSeries ApS의 등록 상표입니다.
영상을 보시면[7], 그는 두 캐릭터의 바로 중간 지점에 시선을 고정한다는 것을 알 수 있습니다(그림 B.10의 왼쪽). 이것이 두 캐릭터 사이를 번갈아 가며 사카드하고 고정하는 경향이 있는 초보 플레이어들과 그를 구분 짓는 요소 중 하나입니다(그림 B.10의 오른쪽).
이렇게 함으로써, 그는 날카로운 중심시를 사용하여 두 캐릭터를 동시에 시야에 담아 그가 수행하는 사카드의 수를 최소화합니다.
이것은 상대방이 기술을 시전할 때 그가 첫 몇 프레임을 놓칠 가능성이 줄어든다는 것을 의미하며... 격투 게임에 관한 한, 몇 프레임을 놓치는 것은 승패를 가르는 차이가 될 수 있습니다.
그림 B.10: 초보 플레이어와 비교한 Sako의 눈 움직임 © 캡콤
추가로, Sako는 아마도 자신과 상대방이 취하는 다양한 포즈들을 청크로 내면화했을 것이며, 이를 통해 상황을 읽고 더욱 빠르게 반응할 수 있었을 것입니다(그림 B.11 참조). 청킹의 또 다른 좋은 사례입니다!
그림 B.11: 스트리트 파이터의 포즈 청킹 © 캡콤
레이블 배치 시선 추적
UX Matters 블로그에서는 시선 추적 장치를 사용하여 사람들이 다양한 사용자 인터페이스에서 무엇을 보는지 이해하기 위한 일련의 연구를 수행했습니다. 한 흥미로운 연구[8]는 양식(form)에서 레이블을 배치하는 세 가지 옵션인 왼쪽 정렬, 오른쪽 정렬, 위쪽 정렬을 비교했습니다. 결과는 다음과 같습니다.
위쪽 정렬 및 오른쪽 정렬된 레이블은 사카드 횟수가 가장 적었으며(그림 B.12의 왼쪽과 중간), 이는 사용자가 사용자 인터페이스의 데이터를 해석하는 데 훨씬 더 효율적이었음을 의미합니다. 그러나 왼쪽 정렬된 레이블은 사카드 횟수가 거의 두 배였으며, 이는 사용자가 필요 이상으로 인터페이스 주변으로 눈을 훨씬 더 많이 움직였음을 의미합니다(그림 B.12의 오른쪽).
그림 B.12: 오른쪽 정렬, 위쪽 정렬, 왼쪽 정렬된 레이블에 대한 시선 추적
그렇다면 이 모든 것을 도구 디자인에 어떻게 적용할 수 있을까요?
양식(Forms)은 우리 도구의 많은 부분에서 발견되는 사용자 인터페이스 요소인 속성 에디터(property editors)와 매우 유사합니다. 그것들은 대개 입력창(대개 텍스트 입력이지만 다른 유형일 수도 있음)과 연관된 레이블로 구성됩니다.
예를 들어, Maya 어트리뷰트 에디터의 레이블은 오른쪽 정렬되어 있어 사용자가 중앙에 시선을 고정하고 앞뒤로 사카드할 필요 없이 레이블과 값을 모두 읽을 수 있게 해줍니다(그림 B.13의 왼쪽). 이를 레이블과 값을 읽기 위해 사용자가 앞뒤로 사카드해야 하는 Stingray와 비교해 보십시오(그림 B.13의 오른쪽).
그림 B.13: Maya의 오른쪽 정렬 레이블 대 Stingray의 왼쪽 정렬 레이블, © Autodesk
이 문제는 속성 에디터의 가로 크기를 조정할 때 더욱 악화되는데, 이는 레이블이 입력창에서 훨씬 더 멀어짐을 의미합니다.
마지막으로, 비록 위쪽 정렬 레이블이 오른쪽 정렬 레이블만큼 우수한 성능을 보였지만, 속성 에디터에서 이를 사용하는 것은 대개 수직 공간의 사용 증가로 인해 사용자가 스크롤해야 하므로 문제가 될 수 있습니다. 그것들은 입력창의 수가 적은 상황에서만 사용되어야 합니다. 속성 에디터는 대개 매우 많은 수의 입력창을 가지고 있으며, 이러한 이유로 오른쪽 정렬 레이블이 더 나은 선택입니다.
마무리하며
이제 특정 유형의 게임이 도구 디자인 개념을 배우는 데 도움을 줄 뿐만 아니라, 그러한 개념을 다른 사람에게 설명하는 데에도 사용될 수 있다는 것을 알 수 있습니다!
하지만 일부 게임은 게임플레이의 일부로 의도적으로 마찰을 증가시킨다는 점을 유념하십시오(디자인 챕터의 부수 작업(excise) 참조). 이것이 게임에서는 재미있을 수 있지만, 작업을 완수하려고 할 때는 재미없으므로 속도와 정확성이 중요한 경쟁 게임의 사례를 찾는 것이 가장 좋습니다.
이제 여러분은 도구 디자인 개념을 배우기 위해 사용할 수 있는 또 다른 훌륭한 리소스를 알게 되었습니다. 이 모든 시간 동안 등잔 밑에 숨어 있었던 바로 그것, 게임입니다!
그림 B.14: Unsplash의 Hadyn Cutler 사진
[1] 우리는 5장에서 청킹에 대해 더 자세히 배울 것입니다!
[2] 원래의 체스 연구는 아드리안 드 그루트(Adriaan de Groot)에게서 나왔습니다.
[3] 여러분은 선택적 주의력에 관한 그들의 연구, 이른바 보이지 않는 고릴라 영상으로 그들을 알고 있을 것입니다: https://www.youtube.com/watch?v=vJG698U2Mvo
[4] 5장에서 우리는 16진수 색상 값을 해석하는 데 청킹이 어떻게 사용될 수 있는지에 대한 예를 볼 것입니다.
[5] 우리는 5장 시작 부분에서 인간의 시각에 대해 더 자세히 배울 것입니다.
[6] 여기 연구 영상이 있습니다: https://www.youtube.com/watch?v=qIF3FRwbG6Y&ab_channel=edz44
[7] 여기에서 영상을 확인하십시오: https://www.youtube.com/watch?v=RmAwAefKZ8o
[8] 여기 연구에 대한 블로그 게시물 링크가 있습니다: https://www.uxmatters.com/mt/archives/2006/07/label-placement-in-forms.php
'게임개발 > 가마수트라' 카테고리의 다른 글
| 라리안 CEO, 어떠한 AI 도구도 '잘 사용된다면' 기술이나 숙련도를 대체하는 것이 아닌 보조적인 것이라고 언급 (1) | 2026.01.14 |
|---|---|
| 🏆 ‘베이비 스텝(Baby Steps)’ 제28회 IGF 어워드 후보 명단 선도 (1) | 2026.01.13 |
| 🏆 다니엘 리엔도 선정 올해의 게임 TOP 3 - 2025년 결산 (1) | 2026.01.07 |
| 🎨 '데몬스쿨(Demonschool)'의 시선을 사로잡는 게임 기획 선택, 그 이면의 이야기 (1) | 2026.01.06 |
| 🏆 브라이언트 프랜시스 선정 올해의 게임 TOP 10 - 2025년 결산 (1) | 2026.01.05 |
댓글