배경#

요즘 군대에서 휴대폰으로, 포켓몬 팬게임 중에서 핫하다는 어나더레드와 올라라포켓몬타워를 자주 하고 있다. 문제는 게임 난이도 자체보다, 내가 모르는 포켓몬이 너무 많다는 점이었다. 세대가 계속 쌓이면서 처음 보는 포켓몬이나 폼이 자주 나왔고, 타입이나 종족값을 모르니 어떤 기술을 눌러야 할지 매번 다시 찾아봐야 했다.

기존 위키도 사용하기에 충분했지만, 실전 중에 같이 쓰기에는 번거로운 부분이 있었다. 검색창 포커스를 자주 다시 잡아야 했고, 초성 검색이 안 돼 이름을 끝까지 입력해야 했고, 전투에서 먼저 보고 싶은 정보가 바로 위에 보이지 않았다.

구현에서 집중한 부분#

구현에 들어가기 전에 기준을 세 가지로 고정했다. 앱 진입 직후 입력 가능할 것, 키보드만으로 검색과 선택이 끝날 것, 선택 직후 상성 핵심 정보가 먼저 보일 것. 핵심 평가지표는 정보량이 아니라 정보를 얻기까지의 시간과 클릭 횟수였다.

먼저 입력 흐름을 전투 입력 패턴에 맞췄다. /와 Ctrl/Cmd + K로 즉시 재포커스가 되게 했고, 방향키와 Enter로 선택을 끝낼 수 있게 했다. 여기서 가장 크게 고민한 부분은 단축키 충돌과 입력 안정성이었다. 브라우저 기본 단축키, IME 조합 입력, 포커스 손실 상황을 같이 처리하지 않으면 체감이 금방 흔들렸다.

검색 정확도는 단순 포함 매칭으로는 부족했다. 도감번호, 한글/영문 이름, 폼 정보, 초성을 함께 고려하는 점수 기반 정렬로 바꿨고, 특히 초성 검색은 짧은 입력으로도 후보를 빠르게 좁히는 데 효과가 컸다.

모바일에서 초성으로 빠르게 검색하는 화면

로딩 전략도 초기에 다시 설계했다. 처음에는 데이터를 한 번에 로드했지만 모바일에서 파싱 지연이 바로 드러났다. 그래서 초기에는 가벼운 목록만 로드하고, 상세 기술/부가 정보는 선택 이후 단계적으로 불러오는 구조로 분리했다. 초기 반응 속도와 데이터 완전성 사이의 균형을 이 방식으로 맞췄다.

상세 화면은 정보 배치 순서를 바꿨다. 4배/2배 약점과 무효 타입을 먼저 보여주고, 이후에 종족값·특성·진화·기술 정보를 이어서 보게 했다. “많이 보여주는 화면”보다 “먼저 판단하게 하는 화면”을 우선했다.

선택 직후 상성 중심으로 확인할 수 있는 상세 화면

회고#

이번 작업에서 가장 크게 체감한 변화는 포켓몬 검색과 판단에 들어가는 클릭 횟수가 압도적으로 줄었다는 점이다. 상대 교체 상황에서 조회 루틴이 일정해졌고, 턴 사이에 손이 끊기는 구간이 줄면서 플레이 피로감도 확실히 낮아졌다.

다만 포켓몬 관련 콘텐츠는 라이선스 이슈가 엄격해서 퍼블릭 서비스로 크게 운영하기는 조심스러운 면이 있다. 그래서 지금은 개인용으로 띄워서 실제 플레이할 때 쓰는 도구로 운용하는 중이다.

개인적으로는 군대에서 심심할 때 이런 걸 만들다 보니 시간이 훨씬 잘 가는 점도 좋았다.