웹페이지를 게임 공간으로 만들기
DOM 요소의 위치와 크기로 이동 구역, 장애물, 경비의 시야를 계산합니다. requestAnimationFrame으로 화면을 갱신하면서 경비의 상태와 게임 진행을 처리합니다.
게임을 기획하고 직접 플레이하며 수정할 점을 전달했습니다. 코드 작성·수정과 자동 테스트는 주로 Codex가 맡았습니다.
웹페이지의 버튼과 패널을 길로 바꾸고 경비를 피해 퍼즐을 푸는 게임입니다. OpenAI 해커톤에서 게임을 기획하고 플레이 피드백을 맡았으며, 코드는 주로 Codex로 작성했습니다.

OpenAI 해커톤에 참가하며 만든 개인 게임입니다. 저는 주제와 분위기, 캠페인 구성, 퍼즐 난이도와 힌트 방식을 정하고 직접 플레이하며 수정할 점을 전달했습니다. Codex가 피드백을 바탕으로 코드 작성·수정과 자동 테스트를 주로 맡았습니다.
브라우저의 버튼·카드·패널이 길과 장애물이 됩니다. 플레이어는 단서를 모으고 경비의 시야를 피해 다음 구역으로 이동합니다. 플레이 중 발견한 경비 순찰 버그는 Codex와 수정하고, 같은 문제가 다시 생기는지 확인하는 테스트를 추가했습니다.
6개 장, 12개 작전으로 구성했습니다. 작전마다 경비를 피해 이동한 뒤 길을 다시 만들고 핵심 퍼즐을 풉니다. 신호 미끼로 경비를 유인하거나 조작을 되돌려 다른 방법을 시도할 수 있습니다.
DOM 요소의 위치와 크기로 이동 구역, 장애물, 경비의 시야를 계산합니다. requestAnimationFrame으로 화면을 갱신하면서 경비의 상태와 게임 진행을 처리합니다.
회로·경로·순서 등 퍼즐별 규칙과 정답 판정, 작전 완료 시 다음 콘텐츠를 여는 기능을 만들었습니다. Codex가 작성한 검사 스크립트로 정답 입력이 실제 퍼즐 해결로 이어지는지, 언어를 바꿔도 진행 상태가 유지되는지 확인합니다.
진행 상황을 브라우저에 저장합니다. 이전 캠페인의 저장 데이터를 변환하고 백업에서 복구할 수 있으며, 일시정지·되돌리기·사운드·한국어와 영어 전환을 지원합니다.
경비가 멈추는 버그를 수정하고 순찰 자동 테스트를 추가했습니다. 당시 별도의 60초 테스트에서 목표 지점은 21회 바뀌었고, 가장 오래 멈춘 시간은 약 0.3초였습니다. 캠페인 검사 스크립트로 12개 작전·36개 구간의 정답 경로도 확인합니다.
플레이 중 경비가 순찰 경로를 따라가지 않고 멈췄습니다. 당시 개발 기록에는 한 구간에서 약 37초 동안 서 있던 사례가 있습니다.
AI와 함께 버그를 재현하고, 애니메이션 중 읽은 화면 좌표가 갱신되지 않거나 경로의 이동량이 0이 되는 경우를 확인했습니다. 화면 전환 후 경로를 다시 계산하고 이동이 불가능한 경우를 처리했습니다. 이후 순찰을 오래 실행해 보는 테스트를 추가했습니다.
게임 기획과 플레이 피드백은 제가 맡았습니다. 코드 작성·수정과 자동 테스트는 주로 Codex로 진행했으며, 버그 관련 수치는 당시 개발 중 측정한 값입니다.