2015년 1월부터 2016년 3월까지, 1년 2개월. 세 사람 남짓의 팀에서 모바일 게임 하나를 만들었다. 나는 프로덕트 디자인을 맡았고, 이 프로젝트에서 내 몫은 UI였다. 어떻게든 출시해 보려 했지만 우리는 테스트 빌드까지 가고 멈췄다. 팀은 자연스럽게 흩어졌고, 각자 살길을 찾아 갔다.
오래 묵혀둔 이야기지만, 지금의 눈으로 그때의 화면들을 다시 꺼내 본다. 결과가 아니라 거기서 배운 태도 때문에.
화면 속 캐릭터 일러스트는 팀원의 작업이고, 이 글에서 다루는 UI 설계가 나의 몫이었다.
정식으로 배운 적 없이, 포토샵으로 부딪히며
솔직히 그때 나는 UI 디자인을 정식으로 해본 적이 없었다. 포토샵을 붙잡고 수십, 수백 번 시행착오를 거치며 겨우 지금 보이는 정도의 결과를 만들었다. 화면설계서라는 게 있는 줄도, 개발 프로세스가 어떻게 도는지도 모르던 때라 — 문서를 쓰는 대신 포토샵 위에 동작과 설계 의도를 직접 그려 넣어 이미지로 소통했다. 지나고 보니 서툰 방식이었지만, "화면이 어떻게 동작해야 하는지"를 어떻게든 남기려던 그 시도 자체가 훗날 배운 화면설계서·인터랙션 명세와 닿아 있었다.
무엇을 만들었나 — 화면이 아니라 시스템
한 장씩 예쁜 화면을 그린 게 아니라, 게임 전체가 공유하는 UI 시스템을 만들었다. 상단 재화 바, 탭 구조, 카드 레이아웃이 화면마다 일관되게 반복되도록 컴포넌트를 정리했고, 슬롯 크기까지 픽셀 단위로 표기해 개발에 넘길 수 있게 정리했다. "예뻐 보이게"가 아니라 "구현되게" 만드는 일이었다.
영웅 목록 화면 — 재화 바·카드·상태 뱃지가 반복되는 UI 시스템
화면이 아니라 '변하는 규칙'을 설계했다
가장 공들인 건 정적인 화면이 아니라 상태(state)였다. 레벨업 조건이 충족되면 슬롯이 흑백에서 컬러로 바뀌고, 버튼이 노란색으로 활성화된다 — 이런 전환 규칙을 화면마다 번호를 매겨 정의했다. 화면을 그린 게 아니라, 화면이 언제, 어떻게 변하는지를 설계한 것이다. 지금 생각하면 이게 인터랙션 디자인의 시작이었다.
영웅 스탯 화면 — 조건이 충족되면 활성화되는 랭크업 버튼
이기고 지는 순간까지 — 흐름 설계
전투가 끝난 뒤도 설계 대상이었다. 승리 화면은 보상으로, 패배 화면은 곧바로 진형 강화·스킬·장비·레벨업이라는 다음 행동으로 이어지게 짰다. 진 유저를 탓하지 않고, 다시 도전할 이유를 손에 쥐여주는 흐름 — 리텐션을 UI로 설계한 셈이다.
전투 결과 화면 — 승리 보상과 패배 후 다음 행동 유도
방향을 바꾸다 — Lite 버전
개발자의 중도 이탈로 일정이 밀렸다. 팀원을 계속 찾았지만 쉽지 않았고, 앞서 짜둔 코드가 거의 쓰지 않는 언어로 되어 있어 사실상 처음부터 다시 개발해야 하는 상황이었다. 겨우 개발이 가능한 팀원이 합류했을 땐 이미 일정이 많이 늦어져 있었다. 그래서 결정했다 — 원래 게임을 처음부터 다 만드는 건 무리다. 대신 더 단순한 Lite 버전을 만들어 출시하자. 세로형 화면의 클리커 게임으로 방향을 다시 잡았다.
아래 화면이 그 Lite 버전의 인게임 UI다. 크게 벌린 걸 접고 완성 가능한 범위로 줄이는 것 — 아쉽지만 그것도 결국 기획의 판단이었다.
방향을 바꾼 Lite 버전 — 세로형 클리커 게임의 인게임 UI
피드백이 갈렸을 때
이 작업을 두고 평가가 갈렸다. 팀 밖에서는 좋다는 이야기를 들었지만, 안에서는 다시 하자는 요구가 있었다. 누가 옳은지 감정으로 우기는 건 아무것도 증명하지 못한다. 그래서 나는 방법을 바꿨다 — 내 판단을 스스로 검증하기로 했다. 이 일을 계속할 수 있을지도 모르는 상황에서, UX를 정식으로 배우러 갔다.
그곳이 라이트브레인 UX 아카데미였고, 나는 거기서 처음으로 UX를 제대로 배웠다.
남은 결론
배우고 나서 내린 결론은 이거였다 — 다 맞지는 않았지만, 다 틀리지도 않았다. 그거면 충분했다. 이 게임은 출시하지 못했지만, 여기서의 아쉬움이 나를 UX라는 일로 데려갔다. 지금 돌아보면, 멈춘 프로젝트가 아니라 시작점이었다.