20년 전 PC 게임, AI로 부활! 브라우저에서 바로 플레이!
2003년 출시된 PC 게임 건즈 온라인(GunZ: The Duel)을 WebAssembly와 WebGL을 활용하여 브라우저에서 실행 가능하도록 이식
기존 C++ 소스코드(Source Code)를 거의 수정하지 않고, AI 기반 코드 생성 도구를 활용하여 윈도우 API(Direct3D)를 WebGL로 변환
게임 서버를 WebAssembly로 빌드하여 브라우저 내에서 로컬 서버(Local Server) 구동 및 SQLite + IDBFS를 활용한 데이터 영속성 확보
사운드(FMOD → Web Audio API), 입력(Win32 메시지 변환), 파일 시스템(2단계 로드 + Cache API) 등 다양한 기술적 난제 해결
AI 코딩 도구(Google Antigravity, Claude Code)를 활용하여 개발 시간 단축 및 윈도우 종속성 문제 해결
AI 기반 Direct3D to WebGL 변환 아키텍처
본문에서는 윈도우 전용 게임인 건즈 온라인(GunZ Online)을 브라우저에서 실행하기 위해 Direct3D 명령을 WebGL로 변환하는 래퍼(Wrapper)를 개발했다.
게임 코드 직접 수정 방식은 수만 줄의 코드 변경이 필요하고, 상위 호환성(Compatibility) 문제 발생
자동 변환 툴(Transpiler) 방식은 API 의미 차이로 인해 기계적 변환(Mechanical Conversion)의 한계 존재
래퍼(Wrapper) 방식은 Direct3D와 동일한 API를 가진 WebGL 래퍼를 구현하여 게임 코드 수정 없이 윈도우 종속성(Windows Dependency) 제거
결과적으로 AI 코딩 도구(AI Coding Tool)를 활용하여 래퍼 구현 비용만으로 브라우저 이식을 완료했다.
브라우저 내 서버 구현: WebAssembly와 Web Worker
건즈 온라인(GunZ Online)의 게임 서버(Game Server)는 C++ 코드를 WebAssembly로 컴파일하여 Web Worker(Web Worker) 환경에서 실행된다.
네트워크 통신(Network Communication)은 postMessage를 통해 클라이언트와 서버 간 메시지 교환(Message Exchange)으로 대체
서버 데이터(Server Data)는 SQLite와 IDBFS(IndexedDB 기반 파일 시스템)를 사용하여 영속성(Persistence)을 확보하여 탭 종료 시에도 데이터 유지
WebSocket을 통해 외부 서버(External Server)에 접속하여 온라인 멀티플레이(Online Multiplayer) 지원
이러한 아키텍처를 통해 다운로드 없이 브라우저에서 게임을 즐길 수 있는 환경을 구축했다.
사운드, 입력, 파일 시스템: 브라우저 환경 적응
건즈 온라인(GunZ Online)은 브라우저 환경에 맞춰 사운드, 입력, 파일 시스템을 재구현했다.
사운드: FMOD(FMOD)에서 Web Audio API(Web Audio API)로 변경하여 3D 사운드(3D Sound), BGM 스트리밍(BGM Streaming) 및 효과음 거리 컬링(Sound Effect Distance Culling) 구현
입력: Win32 메시지(Win32 Message)를 브라우저 이벤트로 변환하여 키보드 및 마우스 입력 처리 및 Pointer Lock API(Pointer Lock API)를 활용한 마우스 캡처(Mouse Capture)
파일 시스템: 게임 에셋(Game Asset)은 .mrs 형식으로, Emscripten MEMFS(Emscripten MEMFS)에 올리고 2단계 로드(Two-stage Loading) 및 Cache API(Cache API)를 활용하여 최적의 로딩 속도(Loading Speed) 확보
이러한 과정을 통해 브라우저에서도 쾌적한 게임 환경을 제공한다.
AI 코딩 도구 활용: Claude Code의 역할
본문에서는 AI 코딩 도구인 Claude Code(Claude Code)를 활용하여 건즈 온라인(GunZ Online)의 브라우저 이식 작업을 진행했다.
Google Antigravity(Google Antigravity)를 사용했지만, 쿼터 제한(Quota Limit)으로 인해 Claude Code로 전환
Claude Code는 윈도우 API(Windows API)를 WebGL로 변환하는 래퍼(Wrapper) 구현에 기여하여 개발 시간 단축(Development Time Reduction)
Antigravity에서 해결하지 못한 버그(Bug)를 몇 시간 만에 해결하여 생산성 향상(Productivity Improvement)
AI 코딩 도구의 활용은 기존 코드베이스(Codebase)를 유지하면서 브라우저 이식을 가능하게 하는 핵심 요소였다.
데이터 최적화: 용량 절감 및 CDN 활용
브라우저 환경에서 건즈 온라인(GunZ Online)의 데이터 로딩 속도를 개선하기 위해 다양한 최적화 작업을 수행했다.
게임 데이터(Game Data) 사이즈를 줄이기 위해 반복적인 최적화 작업 진행
음성 포맷(Audio Format)을 WAV에서 Opus로 변환하여 총 용량 88% 절감 (44.3MB → 5.30MB)
S3 + CloudFront(CloudFront)를 활용한 CDN(CDN) 구축으로 지역에 관계없이 빠른 에셋 다운로드(Asset Download) 지원
결과적으로 10초 이내에 게임 플레이가 가능하도록 로딩 속도를 개선했다.
