왜 게임 엔진 없이 만들었을까요
수박 키우기는 주소를 열면 바로 시작되는 게임입니다. 저는 이 가벼움을 끝까지 지키고 싶었습니다. 외부 물리 엔진 라이브러리를 붙이는 순간 로딩이 무거워지고, 페이지 하나로 끝나는 단순함도 흐려집니다. 그래서 서버도 계정도 없이, 최고 기록조차 브라우저의 localStorage에만 저장하는 구조를 택했습니다.
또 하나의 이유는 순전히 배우고 싶어서였습니다. 이 게임의 물리는 결국 "원과 원이 부딪히는 세계"입니다. 사각형도 다각형도 없습니다. 이 정도 범위라면 물리엔진을 직접 만들어 보면서 그 속을 이해할 좋은 기회라고 생각했습니다.
물리 구현의 뼈대
엔진이 대신해 주던 일을 직접 하려면, 세계의 규칙을 하나씩 손으로 정해야 합니다. 이 게임의 물리는 크게 중력, 질량, 충돌, 그리고 안정화 장치로 이루어져 있습니다.
중력과 질량 — 세계의 규칙 정하기
매 프레임 모든 과일에 아래 방향으로 2200px/s²의 중력 가속도를 더합니다. 현실의 중력보다 훨씬 큰 값이지만, 픽셀 단위의 작은 세계에서는 이 정도가 되어야 낙하가 시원하게 느껴집니다.
질량은 반지름의 제곱에 비례하게 두었습니다. 반지름 16px의 체리와 118px의 수박이 부딪히면 수박은 거의 밀리지 않고 체리만 튕겨 나가는데, 이 무게 차이가 쌓기 게임 특유의 안정감을 만듭니다. 과일 10단계의 정확한 반지름과 점수는 과일 도감에 정리해 두었습니다.
원끼리의 충돌 — 겹치면 조금씩 밀어낸다
원의 충돌 감지는 단순합니다. 두 중심 사이의 거리가 반지름의 합보다 작으면 겹친 것입니다. 어려운 부분은 감지가 아니라 "겹친 다음"입니다. 겹친 과일을 한 번에 확 밀어내면 옆의 과일과 새로 겹치고, 그걸 또 밀면 반대쪽이 겹치는 연쇄가 생깁니다.
그래서 위치 보정을 프레임마다 3번, 즉 3패스로 나누어 조금씩 반복합니다. 튕기는 정도를 정하는 반발계수는 0.12로 낮게 잡아 과일이 통통 튀지 않고 착 쌓이게 했고, 속도 상한 1600px/s와 저속 구간의 마이크로 댐핑으로 미세한 떨림을 눌렀습니다. 주요 값을 표로 정리하면 이렇습니다.
| 항목 | 값 | 역할 |
|---|---|---|
| 중력 가속도 | 2200px/s² | 낙하의 속도감을 결정합니다 |
| 반발계수 | 0.12 | 부딪힌 뒤 튕기는 정도 — 낮을수록 착 쌓입니다 |
| 위치 보정 | 3패스 | 겹친 과일을 프레임마다 세 번에 나눠 밀어냅니다 |
| 질량 | 반지름² | 큰 과일이 작은 과일에 밀리지 않게 합니다 |
| 속도 상한 | 1600px/s | 물리가 폭주하는 것을 막습니다 |
| 드롭 쿨다운 | 0.55초 | 과일을 연속으로 떨어뜨리는 최소 간격입니다 |
가장 재미있었던 버그 — 멈췄는데 멈추지 않은 과일들
증상: 게임이 영원히 끝나지 않는다
게임오버 판정의 첫 버전은 "빨간 선 위에 과일이 거의 정지한 채로 있으면 종료"였습니다. 속도가 충분히 낮으면 정지로 본다는, 언뜻 자연스러운 규칙이었습니다. 그런데 테스트에서 과일을 천장까지 쌓아도 게임이 끝나지 않았습니다.
원인: 중력과 보정이 만든 팽팽한 평형
디버그 값을 찍어 보고 한참 웃었습니다. 쌓인 더미의 과일들이 화면에서는 완전히 멈춰 있는데, 수직 속도 vy가 약 220px/s를 계속 유지하고 있었던 것입니다. 매 프레임 중력이 속도를 아래로 누적시키고, 위치 보정이 그만큼 위치를 도로 밀어 올리는 평형이 만들어진 결과였습니다.
위치는 그대로인데 속도는 늘 큰 상태. 즉 "속도가 낮으면 정지"라는 판정은 영원히 참이 될 수 없었습니다. 눈에는 멈춰 있어도, 물리엔진의 장부에는 쉬지 않고 낙하 중인 과일들이었던 셈입니다.
해결: 속도 대신 위치를 본다
그래서 속도를 아예 보지 않기로 했습니다. 판정을 순수 위치 기반으로 바꾸어, 과일이 빨간 선 위에 1초 이상 머물면 종료합니다. 새로 떨어지는 과일이 선을 스치는 것은 1초의 유예 안에 통과하기만 하면 아무 문제가 없습니다.
고친 뒤에는 자동 시뮬레이션으로 검증했습니다. 한 열에 빠르게 120개를 떨어뜨리는 시뮬레이션을 돌려, 더미가 빨간 선을 넘는 순간 게임오버가 어김없이 발동하는지 확인했습니다. 눈으로 열 판을 해 보는 것보다 훨씬 믿음직한 방법이었습니다.
소리도 파일 없이
효과음 파일도 하나 없습니다. 소리가 필요한 순간 Web Audio API로 파형을 실시간 합성해 재생합니다. 음원을 내려받을 일이 없으니 페이지는 계속 가볍고, 코드 몇 줄만 고치면 소리의 표정을 바꿀 수 있습니다.
작은 장치도 하나 넣었습니다. 합성되는 과일의 단계가 높을수록 음정이 올라갑니다. 화면을 보지 않아도 소리만으로 "지금 꽤 큰 게 합쳐졌구나"를 알 수 있습니다. 합성 후 1.4초 안에 다음 합성을 이어 가는 콤보를 노릴 때 이 소리가 좋은 신호가 되는데, 자세한 운영법은 콤보 공략에 따로 적었습니다.
만들며 배운 것들
- 물리는 정확함보다 느낌입니다. 반발계수 0.12는 물리적으로 옳은 값이라서가 아니라, 게임이 가장 재미있어지는 값이라서 골랐습니다.
- 판정은 내부 상태가 아니라 겉보기 기준으로. 플레이어에게 보이는 것은 속도가 아니라 위치입니다. 게임오버 버그가 남긴 교훈입니다.
- 자동 시뮬레이션은 배신하지 않습니다. 120드롭 시뮬레이션 하나가 수십 판의 수동 테스트를 대신해 주었습니다.
이렇게 다듬은 v1.0.0을 2026년 7월 14일에 출시했습니다. 난이도 모드, 새 과일 테마, 주간 챌린지 같은 아이디어도 있습니다만 아직 확정이 아니라 검토 중인 단계입니다. 버전별 변경 내역과 앞으로의 계획은 업데이트 페이지에서 확인하실 수 있습니다.