개발 이야기

구르고 쌓이면서도 과일답게 만드는 일

Banana Game은 익숙한 과일 합성 판에서 출발했습니다. 하지만 바나나는 곧 다른 문제를 만들었습니다. 오목하게 휘어진 모양이 플레이에 영향을 주면서도 더미 전체를 불안정하게 해서는 안 됐습니다.

Mainu Studio · 최초 게시: 2026년 8월 18일 · 수정:

원 하나로는 부족했던 이유

원형 충돌체는 계산이 가볍고 굴러가는 움직임을 예측하기 쉬워 쌓기 게임에 잘 맞습니다. 대신 모든 과일이 비슷하게 느껴집니다. 바나나 전체를 원으로 감싸면 안쪽 빈 공간까지 막혀 다른 과일이 떠 있는 것처럼 보입니다. 원을 작게 하면 끝부분을 통과합니다. 어느 쪽도 플레이어가 보는 그림과 맞지 않았습니다.

그래서 바나나는 휘어진 몸체를 따라 안쪽에 실제로 빈 공간이 남는 충돌 모양을 사용합니다. 포도처럼 불규칙한 실루엣도 같은 원칙을 따릅니다. 눈에 보이는 접촉을 설명할 수 있어야 하지만 모든 픽셀을 따라갈 필요는 없습니다. 지나치게 자세한 윤곽은 작은 모서리를 늘려 다른 물체를 붙잡거나 떨리게 합니다.

플레이 중에는 블루베리가 바나나 안쪽에 자리 잡고, 큰 과일이 바깥 곡면을 타고 넘어가는 차이로 드러납니다. 이를 보이지 않는 원으로 바꾸면 기술 문제는 줄어들어도 게임에서 중요한 선택 하나가 사라집니다.

양 끝 사이 안쪽이 비어 있는 게임의 실제 픽셀 바나나
실제 바나나 이미지입니다. 충돌체도 안쪽 공간을 열어 두어야 합니다.

과일이 많이 쌓인 뒤 드러난 문제들

빈 판에서는 놓치기 쉬운 문제가 초기 버전에서 나타났습니다. 과일 세 개일 때는 안정적이다가 같은 접점으로 큰 더미의 압력이 전달되면 떨리기 시작했습니다. 합성 결과가 생기는 순간 옆 과일과 겹치기도 했고, 작은 과일이 큰 오목한 충돌체 안에 갇히기도 했습니다. 느린 기기에서는 화면 프레임 사이에 더 많은 움직임이 진행되어 같은 더미도 다르게 보였습니다.

이들은 따로 떨어진 네 가지 시각 버그가 아니었습니다. 접촉 모양, 합성 시점, 혼잡한 공간에서의 겹침 해소가 함께 작용한 결과였습니다. 마찰만 늘리면 미끄러짐 하나는 멈춰도 과일이 붙어 버렸고, 탄성을 늘리면 겹침은 풀려도 판 전체가 튀었습니다. 하나의 만능 물리값보다 여러 동작의 한계를 함께 정하는 것이 중요했습니다.

읽을 수 있는 충돌 모양

매끄럽고 의도적인 구간으로 윤곽을 구성합니다. 실루엣을 바꾸지 않는 작은 픽셀 홈은 제외합니다. 모서리 하나하나가 압력 아래에서는 걸림점이 될 수 있기 때문입니다.

일관된 합성 교체

원래 과일을 한 번의 처리로 비활성화한 뒤 결과를 활성화합니다. 주변 공간을 고려해 새 물체를 놓아 이웃을 삼키는 대신 바깥으로 밀어내게 합니다.

적당한 마찰과 감쇠

불안정한 꼭대기의 과일은 굴러야 하지만 자리를 잡은 더미는 결국 멈춰야 합니다. 목표는 조금씩 자리를 바로잡는 움직임이지, 빙판 같은 미끄러짐이나 붙박이 쌓기가 아닙니다.

속도 제한

빠른 낙하와 겹침 해소에도 한계를 둡니다. 과도한 이동·회전 속도를 막으면 관통이 줄고 한 접촉이 더미 전체에 큰 에너지를 전달하는 것을 예방할 수 있습니다.

자동 합성으로 달라진 타이밍

초기 시제품은 플레이어가 닿은 그룹을 직접 고르는 방식이었습니다. 현재는 같은 과일의 유효한 접촉이 생기면 바로 합쳐집니다. 이 장르에서 기대하는 즉각적인 반응에 가까워졌지만 처리 과정은 더 까다로워졌습니다. 같은 접촉이 여러 번 보고될 수 있고, 한 움직임에서 여러 조합이 생기며, 이미 사용한 과일이 보이지 않는 충돌체로 남아서는 안 됩니다.

그래서 합성에 사용된 과일은 애니메이션이 끝날 때가 아니라 즉시 다시 사용할 수 없게 처리합니다. 점수, 토큰, 소리, 그림 교체와 물리 정리는 같은 합성 사건을 기준으로 움직입니다. 그림만 사라지고 충돌체가 떠 있는 이른바 유령 과일 문제를 막기 위한 방식입니다.

딸기 6개나 사과 4개도 전체가 하나로 연결됐을 때만 바나나가 되어야 합니다. 판 어디에 있든 같은 종류의 개수만 세면 관계없는 무리까지 합쳐져 눈에 보이는 접촉으로 결과를 예상할 수 없게 됩니다.

완성된 특별 조합을 먼저 검사하고, 부족하면 즉시 두 개 합성으로 넘어갑니다. 따라서 안내에서도 딸기 여섯 개를 천천히 붙여 모으라고 해서는 안 됩니다. 처음 두 개가 이미 합쳐지기 때문입니다. 이 타이밍을 조합 설명에도 명확히 적었습니다.

한 판을 시작할 때의 Banana Game 세로 화면
같은 세로 판을 웹, Android, Windows의 기준으로 삼습니다.

하나의 세로 판, 여러 실행 환경

게임의 기준 화면은 가로 720, 세로 1280입니다. 브라우저, Android 휴대전화, Windows 화면은 사용할 수 있는 영역, 안전 영역, 확대 필터와 입력 방식이 다릅니다. 플랫폼마다 배치를 따로 정하게 두면 웹에서는 맞던 버튼이 휴대전화에서 움직이거나 늘어나는 문제가 생겼습니다.

현재는 기준 배치를 하나로 유지하고 같은 비율로 확대·축소합니다. 남는 공간은 플레이 영역 바깥에 두고 판 자체를 늘리지 않습니다. 터치 영역은 보이는 버튼보다 클 수 있지만 중심은 같은 기준 좌표에 묶습니다. 글자와 미리보기 과일도 같은 배율 기준을 사용해 창이 바뀔 때 따로 어긋나지 않게 합니다.

픽셀 아트에는 추가 제약이 있습니다. 최근접 필터는 정수 배율에서 선명하지만 대부분의 휴대전화는 720×1280의 정확한 배수가 아닙니다. 그래서 먼저 상대적인 크기와 위치를 일치시키고, 논리적인 배치를 바꾸는 대신 에셋 종류에 맞춰 필터를 선택합니다.

성능도 물리 설계의 일부입니다

후반에는 접촉이 많아지지만 모든 과일이 계속 비싼 계산을 할 필요는 없습니다. 안정된 과일은 다른 물체가 깨울 때까지 쉬게 할 수 있습니다. 장식 애니메이션과 메뉴 글자를 매 프레임 새로 만들지 않고, 랭킹 행과 언어 미리보기도 재사용합니다. 그만큼 실제 플레이에 중요한 과일 더미에 계산 시간을 쓸 수 있습니다.

테스트는 플레이어가 체감하는 실패 상황에 집중합니다. 작은 과일을 연속으로 빠르게 떨어뜨리기, 큰 이웃 두 개 옆에서 합성하기, 바나나 위에 무게 쌓기, 움직이는 중 일시정지하기, 브라우저 창 크기 바꾸기, 메뉴에서 돌아와 입력 애니메이션 확인하기 등입니다. 빈 편집기 장면에서만 괜찮은 판을 안정적이라고 보지는 않습니다.

일부러 남겨 둔 예측 불가능함

과일은 언제나 예상한 정확한 자리에 멈추지는 않습니다. 조금씩 구르고 회전하고 움직임을 전달하는 것이 이 게임의 재미입니다. 목표는 납득할 수 있는 의외성입니다. 결과가 불리해도 어떤 표면 때문에 그렇게 됐는지 되짚어 볼 수 있어야 합니다.

휘어진 바나나는 앞으로도 원보다 덜 예측 가능할 것입니다. 그 차이는 유지하되 관통, 계속되는 떨림, 보이지 않는 충돌체, 플랫폼마다 달라지는 배치는 오류로 다룹니다.