물리엔진으로 만든 블록 쌓기 게임 「높이 높이」 — 치우치면 진짜로 와르르

심심할 때 물리엔진 한번 제대로 써보고 싶어서 만든 블록 쌓기 게임입니다. 어릴 때 원목 블록 위태위태하게 올리다 무너뜨리던 그 느낌을 화면에 그대로 옮겨보고 싶었어요. 이름은 그냥 직관적으로 「높이 높이」.

규칙은 단순합니다. 블록 하나가 받침대 위를 좌우로 왔다 갔다 왕복하고, 탭이나 스페이스를 누른 순간의 위치에 뚝 떨어져요. 크레인으로 화물 내리듯 타이밍 하나로 승부하는 게임이죠. 잘 맞춰서 중앙에 얹으면 미동도 없이 단단한데, 살짝만 치우쳐도 탑이 스멀스멀 기울다가 어느 순간 와르르 무너집니다. 이 "무너지는 맛"이 사실상 게임의 전부라 거기에 제일 공을 들였어요.

물리는 matter.js라는 2D 강체 엔진을 썼습니다. 처음엔 이게 생각보다 말을 안 들어서 꽤 헤맸어요. 분명 잘 올려놨는데 블록이 바닥에서 부들부들 떨다가 저 혼자 스르륵 미끄러지질 않나, 반대로 마찰을 확 키우면 착 달라붙어서 물리 게임 특유의 아슬아슬한 맛이 사라지질 않나. 반발계수는 0으로, 마찰은 높이고, 슬리핑(멈춘 물체를 잠깐 계산에서 재우는 것) 값을 계속 만지작거리면서 "중앙에 잘 놓으면 몇 초를 기다려도 안 흔들리고, 일부러 치우치면 확실하게 넘어간다"는 그 경계선을 찾는 데 시간을 제일 많이 썼습니다. 받침대도 처음엔 좁아서 초반부터 너무 빡셌는데, 넉넉하게 넓혀서 앞쪽 몇 층은 여유 있게 얹도록 바꿨어요.

렌더링은 물리 세계랑 분리해서 Canvas 2D로 직접 그렸습니다. 그래야 미터(m) 치수 라벨이나 미니맵 같은 걸 위에 자유롭게 얹을 수 있거든요. 모든 블록엔 가로×세로 크기가 미터로 붙고, 지금 조준 중인 블록은 크게, 이미 쌓인 블록은 작게 표시돼요. 화면 오른쪽엔 바닥부터 꼭대기까지 전체 탑을 실제 비율 그대로 축소한 미니맵을 넣었는데, 이게 은근 삽질 포인트였습니다. 처음 버전은 블록들이 죄다 같은 폭 막대기로만 보여서 "이게 무슨 미니맵이야" 싶었거든요. 가로·세로에 똑같은 배율 하나만 적용하는 진짜 미니어처 방식으로 고치고 나서야 넓은 블록은 넓게, 삐뚤빼뚤한 탑은 삐뚤빼뚤하게 제대로 보이더라고요.

높이 올라갈수록 배경 하늘이 새벽에서 한낮, 성층권, 그리고 우주로 서서히 바뀌는 것도 소소한 재미 포인트입니다. 위로 올라가는 맛이 있어야 하니까요. 블록은 최대 100개까지 쌓을 수 있고 안 무너뜨리고 다 올리면 완주. 도달했던 최고 높이는 무너진 뒤 낮아진 값이 아니라 붕괴 직전의 peak 기준으로 확정해서 기록으로 남겨둡니다. 사소해 보여도 이거 안 하면 억울하거든요.

데스크톱이든 모바일이든 똑같이 돌아가고, 서버나 API 키 없이 100% 브라우저에서만 도는 정적 배포라 가볍습니다. 정사각형만 나오는 기본 모드랑, L자·T자·사다리꼴·반원·원까지 별별 모양이 다 나오는 도전 모드 두 가지가 있어요. 원이나 반원은 탑 절반쯤 올라가야 드물게 등장하는데, 이게 후반 긴장감을 다 책임집니다.

지금 바로 브라우저에서 플레이해볼 수 있어요 → https://higher.brag.io.kr

소스 코드는 여기 → https://github.com/jin6877/higher-higher

당신의 기록은 몇 미터인가요? 저는 아직도 도전 모드에서 원 나오면 손이 떨립니다.