처음 만든 프로토타입은 재미있었다. 딱 한 번은.
"점프!"라고 뜨면 아래로, "왼쪽!"이라고 뜨면 오른쪽으로. 카드가 시키는
것의 반대로 스와이프하는 게임. 아이디어는 단순했고, 파일 하나로 30분 만에
돌아가는 버전이 나왔다. 친구에게 보냈더니 "오 신기하네" 하고는 다시 열지
않았다. 나도 그랬다. 한 판 하고 나면 다시 켤 이유가 없었다.
게임의 뼈대는 있는데 살이 없었다. 그래서 냉정하게 프로토타입을 다시 뜯어
보며, 이걸 "실제로 남에게 내놓을 수 있는 물건"으로 만들려면 뭐가 없는지
목록을 적었다. 이 글은 그 목록을 하나씩 지워나간 기록이다.
■ 진단: 프로토타입에 없던 다섯 가지
1. 캐릭터가 없다. 화면에 도형이 하나 떠 있을 뿐, 애착이 생기지 않는다.
2. 맞아도 틀려도 아무 느낌이 없다. 정답의 쾌감도, 오답의 굴욕도 없다.
3. 다시 할 이유가 없다. 점수는 나오는데 그게 뭘 의미하는지 모른다.
4. 처음 하는 사람이 조작을 모른다. 스와이프인지 탭인지 헷갈려 한다.
5. 남에게 보여줄 방법이 없다. 자랑도, 공유도 안 된다.
문제는 명확했다. 하나는 "게임이 못생겼다", 나머지 넷은 "게임이 비어 있다"
였다. 순서대로 손대기로 했다.
■ 아트: 도형을 청개구리로
가장 먼저 캐릭터였다. "반대로 하기"라는 컨셉에 청개구리만큼 맞는 게 없었다.
말 안 듣고 반대로만 하는 그 청개구리.
먹색 도형을 CSS로 그린 청개구리로 교체했다. 초록 몸통에 흰 배, 볼터치,
그리고 머리 위로 솟은 큰 눈 두 개. 여기서 중요한 건 눈동자를 분리한 것이다.
대기 중일 때 눈동자가 카드가 뜬 방향을 힐끔거리게 했더니, 갑자기 캐릭터가
"살아 있는" 느낌이 났다. 숨쉬기 모션(1.2초 주기로 몸이 미세하게 눌렸다
펴짐)까지 넣으니 가만히 있어도 화면이 심심하지 않았다.
행동할 때도 상태별로 포즈를 다르게 했다. 점프는 쫙 늘어나고, 숙이면 납작
엎드리며 눈을 감고, 틀리면 X자 눈에 혀를 내민다. 사소해 보이지만 이 X자
눈 하나가 오답의 굴욕을 웃기게 만든다.
카드도 손봤다. 예능 자막처럼 하드 섀도를 주고, 등장할 때마다 살짝 다른
각도로 기울게 하고, 지시어 옆에 큰 방향 화살표 스티커를 붙였다. 이 화살표가
생각보다 중요했는데, 글자만 있을 때보다 "글자와 화살표가 다른 방향을 가리킬
때"의 혼란이 훨씬 강했다. 스트룹 효과가 세진 것이다.
■ 임팩트: 맞았을 때와 틀렸을 때
두 번째 문제, "아무 느낌이 없다"가 가장 오래 걸렸다. 판정 자체는 이미
되고 있었다. 문제는 그게 몸에 안 와닿는 것이었다.
정답일 때: 화면이 아주 잠깐(50밀리초) 멈췄다가 캐릭터 방향으로 툭 밀린다.
"빠밤!" "천재냐?" 같은 효과음 자막이 기운 각도로 튀어나오고, 점수가 즉시
바뀌는 대신 또로롱 굴러 올라간다. 이 "히트스톱 + 화면 킥 + 카운트업"
조합이 타격감의 정체였다. 하나만 빠져도 밋밋해졌다.
오답일 때: 화면이 흔들리고 잠깐 무채색이 된다. 그리고 카드가 확대되면서
정답 방향 화살표가 빨갛게 뜬다. "이거였다고!" 하고. 뭘 틀렸는지 즉시
학습되니까, 틀려도 화나는 게 아니라 "아 맞다" 하게 된다. 목숨 이모지는
툭 떨어져 회전하며 사라진다.
목숨이 하나 남으면 화면에 심장박동 저음이 깔리게 했다. 이 저음 하나로
마지막 한 판의 긴장이 완전히 달라졌다. 소리는 전부 Web Audio로 합성했고
외부 파일은 하나도 안 썼다.
여기까지 하니 프로토타입과는 다른 게임이 됐다. 같은 규칙인데 "한 판 더"가
나오기 시작했다.
■ 경쟁: 다시 할 이유
세 번째 문제. 점수는 나오는데 의미가 없었다. 그래서 두 가지를 넣었다.
하나는 데일리 모드다. 날짜를 시드로 문제 순서를 고정했다. 그러면 그날은
전 세계 모두가 같은 문제를, 같은 순서로 푼다. 운이 아니라 순수하게 반응
속도로만 비빌 수 있다. Wordle이 그랬듯, "오늘의 문제"라는 것 자체가 매일
돌아올 이유가 된다.
다른 하나는 성적표다. 게임이 끝나면 점수보다 "평균 반응속도"를 더 크게
보여주고, 그 속도로 칭호를 준다. 0.55초 아래면 "초인 반사", 느리면
"나무늘보급". 문제별로 맞고 틀린 걸 이모지로 늘어놓아서(Wordle의 그 초록
네모처럼) 한눈에 보이게 했다.
그리고 역바이럴 장치를 하나 넣었다. 게임오버가 황금 카드 오답이면 성적표에
"황금 카드에 낚임 🎣" 낙인이 찍힌다. 잘한 걸 자랑하는 것보다, 낚인 걸
억울해하며 공유하는 게 더 잘 퍼진다는 걸 노렸다.
■ 온보딩: 처음 하는 사람
네 번째 문제. 처음 온 사람이 조작을 몰라 첫 목숨을 그냥 날렸다. 신규 유저가
가장 이탈하는 지점이었다.
탭도 허용할까 고민하다가, 스와이프를 몸으로 배우게 하는 쪽을 택했다.
첫 플레이 때만 손가락이 위로 쓸어올라가는 애니메이션과 함께 "위로 쓸어
넘겨!"가 뜨고, 실제로 위로 스와이프해야 게임이 시작된다. 다른 방향으로
밀면 목숨을 깎지 않고 "아니아니, 위로!" 하고 다시 안내한다. 중요한 건
타이머와 기록은 이 튜토리얼이 끝난 뒤부터 돈다는 것이다. 온보딩이 기록을
오염시키면 데일리 경쟁의 공정성이 깨지니까.
■ 내보내기: 웹, 플랫폼, 앱
다섯 번째 문제이자 마지막. 게임을 어디에 어떻게 올릴 것인가.
여기서 처음부터 지킨 원칙이 빛을 봤다. 모든 게 index.html 파일 하나였다는
것. 외부 리소스가 없으니 이 파일 하나를 웹에도, 게임 플랫폼에도, 앱에도
그대로 넣을 수 있었다. 앱은 Capacitor로 네이티브 껍데기에 이 파일을
번들로 넣었다. iOS와 안드로이드가 같은 소스에서 나왔다.
스크립트 하나로 세 곳을 동시에 동기화하게 만들었다. 게임을 고치면 웹은
몇 분 만에, 앱은 다음 빌드에 자동으로 반영된다. 플랫폼마다 코드가 갈라지지
않는 게 핵심이었다. 나중에 버그를 고칠 때 이 구조가 사람을 살렸다.
■ 가장 크게 삽질한 것
플랫폼 심사를 통과했는데, 정작 광고가 안 나왔다. 반나절을 헤맸다.
코드를 의심했다. 광고 요청 로직을 몇 번이나 다시 봤다. SDK 초기화도 정상,
요청도 나가는데 광고만 안 떴다. 그러다 콘솔 로그를 끝까지 읽었더니 답이
있었다. 플랫폼이 광고를 "일부러" 꺼둔 것이었다.
신규 게임은 초반에 유저 지표부터 측정하는 기간이 있고, 그동안은 광고 방해
없이 순수 데이터를 모으려고 광고를 비활성화한다. 지표가 기준을 넘으면 그때
광고가 자동으로 켜진다. 우리 코드 문제가 아니라 정책이었다.
"멀쩡한 걸 계속 건드리는" 함정에 빠질 뻔했다. 진단 로그를 심어두고 끝까지
읽은 게 답이었다. 안 되는 것처럼 보일 때, 정말 안 되는 건지 원래 그런 건지
부터 확인해야 한다는 걸 다시 배웠다.
■ 남은 것
출시하고 나니 진짜 문제가 보였다. 앱 안에서 성적표를 공유하려는데,
"이미지를 길게 눌러 저장하세요"가 앱 웹뷰에서는 통하지 않았다. 저장
버튼을 눌렀더니 이미지가 전체화면으로 열려 게임에 갇히기까지 했다.
이걸 발견하고 고치는 데 또 몇 번의 업데이트가 나갔다. 출시는 끝이 아니라
다른 종류의 시작이었다.
■ 배운 것
재미를 만드는 것과 게임을 만드는 것은 다른 일이다. 프로토타입의 재미는
전체의 10분의 1이었고, 나머지 9는 "남에게 내놓을 수 있는 상태"로 다듬는
일이었다. 대부분의 프로토타입이 여기서 멈추는 이유를 알 것 같았다.
그리고 그 9할을 끝까지 밀어붙일 수 있었던 건, 문제를 목록으로 적고 하나씩
지워나갔기 때문이다. "다 만들자"가 아니라 "이 다섯 개가 없다"로 시작하니,
막막함이 할 일로 바뀌었다.
브라우저에서 바로 됩니다. 설치 없이 1분.
여러분은 반응속도 몇 초 나오시나요?