실무 게임 기획서 해부 3편: UI/UX 흐름과 예외 처리

 안녕하세요. '호랭이 물어갈 기획놈들' 입니다.

아바타 조합 시스템 기획서 해부 3부작의 마지막 시간입니다. 

1편에서는 시스템의 목적(BM)과 룰을 짰고, 2편에서는 그것을 서버가 알아들을 수 있는 데이터 테이블(ItemMixTable)로 번역했습니다.

이제 완벽할까요? 아닙니다. 

이대로 프로그래머에게 기획서를 넘기면 욕을 한 바가지 먹고 반려 당합니다. 

유저가 우리가 의도한 대로만 얌전히 버튼을 눌러줄 리도 없고 프로그래머 아저씨들도 예외 사항에 대한 질문을 쏟아낼 생각만 하기 때문입니다. 

그렇지 않으면 혼자 고민하고 개발하면 이거 아닌데요 바꿔주세요! 라고 개선 요청을 하기 때문입니다.

그럼 오늘은 기획자가 QA 테스트 시 쏟아지는 버그 리포트 재앙과 프로그래머의 이건 어떻게 해요? 라는 예외 사항을 처리하기 위해 반드시 설계해야 하는 'UI/UX 흐름(Flow)'과 '예외 처리(Exception)' 파트를 뜯어보겠습니다.


UI/UX: 물 흐르듯 흘러가는 흐름 설계



신입 시절에는 UI 기획을 하라고 하면, 단순히 화면에 네모난 슬롯 몇 개 그리고 "여기에 아이템을 올리세요"라고 씁니다. 

하지만 실무의 UI 기획은 '어떤 순서로 조작하게 만들 것인가'를 통제하는 과정입니다.

당시 제 기획서의 [UI 슬롯 오픈 순서]를 살펴보겠습니다.

[조합 UI 조작 순서]

  1. 초기 UI 오픈 시, 메인 아바타 슬롯(1번)만 활성화되고 나머지는 잠금 처리.

  2. 유저가 1번 슬롯에 '일반' 등급 아바타를 등록.

  3. 시스템이 등급을 체크한 뒤, 촉매제(큐브) 슬롯에 필요한 아이템을 자동 등록하고, 서브 아바타 슬롯(2번)을 활성화.

  4. 2번 슬롯에는 1번과 동일한 '일반' 등급 아바타만 등록 가능하도록 필터링.


  • ItemMix UI의 슬롯이 열리는 순서

No

상황

표시

1

UI를 열었을 때

메인 슬롯만 표시

2

메인 아바타 등록

필요 아이템[큐브] 슬롯 오픈(큐브 자동 등록)

재료 아이템 슬롯 오픈

3

서브 아바타 등록

결과 아이템 슬롯 오픈


아바타 조합 슬롯 오픈 순서 그림

   
   

왜 처음부터 슬롯을 다 열어두지 않았을까요? 

만약 다 열어두었다면 유저는 '일반' 아바타를 메인에 넣고, 서브 재물 슬롯에 실수로 '고급' 아바타를 넣고 합성 버튼을 눌러버릴 수 있습니다. 

그리고 실패해서 '고급' 아바타가 날아가면 곧바로 고객센터에 쌍욕이 담긴 복구 요청 CS가 날아옵니다.

기획자는 UI의 순서(Flow)와 필터링을 통해 유저가 실수 할 수 있는 가능성 자체를 시스템적으로 차단해야 합니다.

물론 저 때는 자동 합성 같은 시스템이 없던 시절이라 저렇게 복잡한 내용으로 작업을 진행했지만 그래도 항상 유저들이 어떻게 행동하고 반응하는지 이 부분에 큰 중점을 두고 UI/UX를 작업해야 합니다.

지금 만약 만든다고 하면 일괄 합성 시스템 만들어서 싹 돌렸을 것 같은데 아.. 지금 이 생각을 가지고 과거로 돌아가면 진짜 천재 기획자 소리 듣지 않았을까? 란 생각도 잠깐 해봅니다.



 예외 처리: 프로그래머의 야근을 막는 방패


UI로 1차 방어를 했다면, 이제 게임 내부의 온갖 변수들을 막아낼 2차 방어선, '예외 처리'를 작성해야 합니다. 

기획서의 꽃이자, QA(품질보증) 팀이 테스트 케이스를 짤 때 바이블이 되는 파트입니다.

1.2.1. 예외 상황

No

상황

처리

1

조합 버튼 클릭 시 캐쉬 인벤토리에 공간이 부족할 경우

가방에 빈 자리가 없습니다. 

경고 팝업 출력.

2

슬롯에 조건이 일치하지 않은 아이템을 등록할 경우

조합할 수 없는 아바타 입니다. 

경고 팝업 출력.

3

메인, 서브 아바타를 등록한 상태에서 메인 아바타를 제거할 경우

등록한 서브 아바타까지 모두 제거

4

필요 아이템이 없을 경우

조합 큐브가 없습니다.

경고 팝업 출력


  • MessageTable.csv를 참조합니다.

No

테이블 이름

StringID

내용

1

MessageTable

MSG_COMMON_NOTENOUGH_INVENTORY

가방에 빈 자리가 없습니다.

2

MSG_ITEM_UNABLE_AVATA (수정)

등록할 수 없는 아바타입니다.

3

MSG_CUBE_NOTENOUGH_ITEM

조합 큐브가 없습니다.


1.2.2 조합 연출

  • 합성 버튼 클릭 시 연출입니다.

  • ItemResult.uip의 프로그레스 바를 출력하고 3초 후 프로그레스 바가 100%가 되면

  • 조합결과를 표시합니다.

  • 성공 시 새롭게 획득한 아이템 아이콘을 표시합니다.

  • 실패 시 메인에 등록한 아이템 아이콘을 표시합니다.

테이블 이름

StringID

내용

MessageTable

MSG_PROGRESS_ITEMMIX

조합 중입니다.

MSG_ITEMMIX_SUCCESS

조합에 성공하여 새로운 아이템을 획득했습니다.

MSG_ITEMMIX_FAIL

조합에 실패하였습니다.

조합 결과가 나올 때(프로그레스 바 출력 시 90% 까지는 ESC로 취소 가능) 취소 하면 첫 번째 화면 출력 등과 같이 다양한 상황에 예외 처리 로직을 클라 및 서버 프로그래머와 상의 후 넣어야지 CS 폭탄 또는 QA 버그 리포트가 날아오지 않습니다.

하나부터 열까지 발생 가능한 모든 상황이라 예측되는 부분은 프로그래머 분들에게 무조건 이야기 하고 관련 내용을 두 파트 모두 주의 깊게 생각하고 자신의 게임 플레이 경험에 비추어 볼 때 어느 지점에 사건 사고가 많았는지 꼭 돌다리도 두들겨 보고 건너가는 꼼꼼함을 보여주셔야 하는 부분이 예외 처리 부분 입니다.



3부작을 마치며: 진짜 기획자의 역할



지금까지 3편에 걸쳐 17년 전의 '아바타 조합 시스템' 기획서를 해부해 보았습니다.

  1. 목적과 룰 (BM 기획): 잉여 아이템을 캐시 아이템으로 소진 시키고 현금 결제를 유도한다.

  2. 데이터 테이블 설계: ItemMixTable을 분리하고 만분율로 확률을 통제한다.

  3. UI/UX와 예외 처리: 유저의 실수를 막고 서버의 안정성을 지킨다.

멋진 세계관을 짜고 화려한 스킬을 상상하는 것도 기획의 일부분입니다. 

하지만 현업에서 진짜 대우받는 기획자, 프로젝트의 중심을 잡는 기획자는 비즈니스 모델(BM)을 이해하고, 그것을 정교한 데이터로 치환하며, 수많은 예외 상황을 통제하여 시스템을 안전하게 라이브 서버에 안착시키는 사람입니다.

제 과거의 부끄러운 기획서가 여러분의 포트폴리오를 다듬고 실무의 감을 잡는 데 작은 힌트가 되었기를 바랍니다.