지그재그에 “포치의 선물가게”를 오픈하며

문제 & 배경: React·TypeScript·Next.js 기반 웹뷰에서 과일이 떨어지고 합쳐지는 물리 게임을 구현한 뒤, 단순한 기능을 넘어 자연스러운 연출과 정확한 게임오버 판정까지 짧은 기간 안에 완성해야 했습니다.

기술 & 해결책: 처음에는 물리 계산을 맡은 Matter.js와 화면 표시를 맡은 React를 사용했지만, 효과와 애니메이션을 강화하기 위해 Phaser.js로 전환하고, 랜덤 과일 생성에는 재현 가능한 시드를 적용했으며, 게임오버는 타이머와 위치만 보지 않고 ‘안착한 과일이 기준선 위에 있는지’ 상태로 판단하도록 바꿨습니다.

교훈 & 주의점: 게임에서는 물리 엔진의 특성과 기기별 화면·입력 차이를 고려해야 하며, 특히 타이머나 순간적인 좌표만으로 상태를 판단하지 말고 실제 게임 상태를 기준으로 검증해야 예기치 않은 오작동을 줄일 수 있습니다.