Claude Opus 5.5와 Claude Code로 하루 만에 풀 PWA 게임 만들기 (실제 토큰 비용 및 Harness 설정)

일요일, 저는 세 문장짜리 아이디어를 브라우저 게임인 Montanha: Zero Day로 만들기로 했습니다. 프롬프트는 캐비닛 사진 하나였습니다. 모양은 보이지만, 커팅을 위한 지그(jig)가 없는 상태였죠.

지그가 없으니 모델이 작업실을 상상합니다. 프레임워크, 번들러, 새로운 폴더 레이아웃까지, 그리고 토큰 제한은 두 번째와 세 번째 시도에서 발생했습니다. 저는 이 과정을 지켜봤습니다. 어려운 부분은 아이디어가 아니었습니다. 첫 구조물이 잘못 나왔을 때 그 커팅을 유지하는 것이 어려웠죠.

이것을 가능하게 한 것은 더 긴 프롬프트가 아니었습니다. 이미 레포지토리 옆에 '하네스(harness)'가 자리 잡고 있었습니다. 모델이 작성하기 전의 가이드, 그리고 작업이 끝났다고 말한 후의 센서들이었죠. Opus 5.5는 Claude Code를 통해 사용량 패널의 일일 할당량 중 절반 정도를 사용하며 게임을 완성했습니다. 주인공은 저(Montanha)이고, 히로인은 Gle이며, 빌런은 RANSOM-TITAN이라는 랜섬웨어입니다. 이 게임은 PWA로서 브라우저와 휴대폰에서 오프라인으로 실행됩니다.

👉 실시간 플레이: tiagovilasboas.github.io/montanha-zero-day (브라우저 언어가 포르투갈어이고 시간대가 브라질일 때만 포르투갈어로, 그 외에는 영어로)

👉 소스 코드: github.com/tiagovilasboas/montanha-zero-day

Montanha: Zero Day Title Screen

초기 프롬프트: 생각보다 적게 필요하다

사람들은 종종 전체 게임을 처음부터 구동하는 데 어떤 종류의 5페이지짜리 프롬프트가 필요했는지 묻습니다. 실제로는? 거의 아무것도 아니었습니다.

시작 프롬프트는 놀라울 정도로 간결했습니다:

_

모델이 단 3문장짜리 프롬프트에서 어떻게 혼란스럽거나 환각적인 스파게티 코드로 빠지지 않고 24개의 모듈식 ES 아키텍처 파일로 나아갈 수 있을까요?

비밀은 프롬프트 엔지니어링(prompt engineering)이 아니었습니다. 바로 **하네스 엔지니어링(Harness Engineering)**이었습니다.

중앙 엔지니어링 하네스를 기반으로 구축되다

모든 대화에 거대한 단일 지침을 쏟아붓기보다는, 저의 로컬 설정은 중앙 하네스 코어(central harness core)(harness-core)에 의해 관리됩니다.

이 하네스는 지속적인 순전파 규칙(가이드)과 자동화된 피드백 루프(센서)를 제공합니다:

1. 깨끗한 아키텍처 경계: 모듈별 단일 책임 원칙(SRP, Single Responsibility Principle)을 적용하여 상태(state), 물리(physics), 렌더링(rendering), 입력(input), 오디오를 프레임워크 오버헤드 없이 이벤트 기반 ES 모듈로 분리합니다.
2. 행동 불변성: 가정 제로 개발(Zero-assumptions development). 에이전트는 실행을 통해 사실을 검증하고, DOM/캔버스 상태를 직접 검사하며, 완료를 주장하기 전에 확인해야 합니다.
3. 도메인 주도 커밋: 의미론적 도메인(feat(hero), fix(gameplay), style(mobile))으로 엄격하게 범위를 지정한 원자적 커밋을 가진 구조화된 git 워크플로우를 사용합니다.

이 부분이 Claude Code와 Opus 5.5가 유용했던 지점입니다. Claude Code는 로컬 도구(Python, ffmpeg, git)와 클라우드 추론을 같은 세션에서 실행했으며, 게임에 필요하지 않은 라이브러리를 추가하는 대신 그 제약 조건 내에 머물렀습니다.

수치로 보는 Opus 5.5

Anthropic은 2026년 9월 22일에 Opus 5.5를 출시했습니다. 아래의 수치는 Anthropic이 보고한 것이므로, 건강한 회의론을 가지고 읽으셔야 합니다. 아직 모든 최첨단 모델(frontier models)에 걸쳐 단일하고 독립적이며 동일한 하네스 비교는 존재하지 않습니다.

객관적으로 말하자면, GPT-6 Astra가 AutomationBench와 Terminal-Bench-Science에서 선두를 달리고 있습니다. 그리고 Vellum의 분석에서 언급했듯이, 특정 과학 평가 작업은 안전 분류기(safety classifiers) 때문에 Opus 5로 하락하여 5.5 종합 점수에 약간 영향을 미쳤습니다.

인공 분석 지능 지수 (The Artificial Analysis Intelligence Index)

Artificial Analysis는 독립적인 다중 측정 평가를 종합된 '지능 지수(Intelligence Index)'로 산출합니다:

가격 책정 및 토큰 경제 (Pricing & Token Economy)

Anthropic은 이 모델이 동일한 목표를 달성하는 데 더 적은 반복(iteration)이 필요하기 때문에 실제 워크플로우가 Opus 5 대비 약 40% 저렴하다고 주장합니다. 제가 일요일에 사용해 본 결과는 그 비율을 확증하지 못했습니다. 사용량 패널에는 코드, 아트, 디자인 및 플레이 테스트 실행에 대한 일일 할당량의 절반 정도가 표시되었습니다. 이 패널은 입력(input), 출력(output), 캐시(cache)를 분리하여 보여주지 않기 때문에 '절반'이라는 것은 토큰 청구서가 아닌 단순한 수치 읽기입니다.

게임 (The Game)

• 1단계: 당신은 Montanha를 조종합니다 (제트팩 수직 부스트 + 터미널 노드를 발사하고 오버라이드하는 해커 시계). 끝에 도달하면 냉동 캡슐에 갇힌 Gle가 모습을 드러냅니다. 하트들이 떠오르지만, RANSOM-TITAN이 하늘에서 추출용 집게를 떨어뜨려 Montanha를 납치합니다. 이것은 미끼였습니다.
• 2단계와 3단계: 격리 상태에서 풀려난 Gle는 황금 버스터 건틀릿과 고속 라이트 부츠로 무장하여 보복합니다.
• 결말: 그녀는 보스 코어를 산산조각 내고, 그의 복호화 키를 회수하며, Montanha의 감옥을 열어젖힙니다.

내부 작동 방식: Vanilla JavaScript ES 모듈 (24개의 단일 목적 파일에 걸쳐 약 2,700줄), HTML5 Canvas, 결정론적(deterministic) 60Hz 시뮬레이션 루프, 오프라인 PWA 설치를 위한 서비스 워커, 100% 합성된 WebAudio 절차 사운드트랙 (부피가 큰 MP3/OGG 에셋 없음), 그리고 HD-2D 아트 파이프라인. 프레임워크는 전혀 사용하지 않았고, 번들러도 사용하지 않았습니다.

Artlist 크레딧을 이용한 고화질 에셋 생성

복고적이면서 모던한 플랫폼 게임은 아트와 애니메이션에 생사가 달려 있습니다. 이를 위해 저희는 생성(generation) 크레딧을 사용하여 **Artlist.io**를 활용했습니다.

이 맥락에서 Artlist란 무엇일까요? Artlist는 비디오, 캐릭터 디자인, 음악을 위한 생성형 AI 모델을 갖춘 강력한 창작 스위트(creative suite)로 진화했습니다.

저희가 이 크레딧으로 수행한 작업은 다음과 같습니다:

1. Nano Banana 2를 사용한 캐릭터 스프라이트: 고해상도의 셀 셰이딩(cel-shaded) 캐릭터 아트를 생성했습니다. 참조 이미지를 제공했기 때문에, 캐릭터의 외모(Montanha의 검은 수염, 스냅백 모자, 후드티, 시계)가 여러 포즈에 걸쳐 매우 일관되게 유지되었습니다.
2. Seedance를 사용한 애니메이션 사이클: 정지된 캐릭터 포즈를 720p 24fps의 움직임 클립으로 변환했습니다.
3. 순수 크로마 분리(Pure Chroma Isolation): 모든 캐릭터를 단색 마젠타(#FF00FF) 또는 녹색 배경에서 생성했습니다.

Artlist와 로컬 Python 파이프라인 연결하기

세션 중, 컨테이너화된 런타임은 외부 Artlist 미디어 호스트에 접근하는 데 네트워크 제한을 겪었습니다. 에이전트는 포기하거나 인간의 개입을 기다리는 대신, 환경을 탐색했습니다:

• 로컬 브라우저를 사용하여 비디오 스트림을 검사했습니다.
• 원시 프레임(raw frames)을 HTML5 <canvas>에 직접 추출했습니다.
• 프레임 간 픽셀 변화량(pixel delta)을 측정하여 정확한 끊김 없는 2단계 사이클(24fps 기준 19프레임)을 계산했습니다.
• 이 프레임들을 프로젝트의 로컬 Python 파이프라인(tools/process_art.py)으로 스트리밍했으며, 여기서 scipy와 Pillow가 자동 크로마키 디스필(chroma-key despill)을 실행하고, 몸통/발 앵커 포인트를 중앙에 맞추었으며, 최종 스프라이트시트(spritesheet)를 WebP 형식으로 패킹했습니다.

총 비용: 590 Artlist 크레딧. 결과: 수동으로 픽셀 하나를 그릴 필요 없이 완전히 맞춤화되고 아름답게 애니메이션된 캐릭터들.

자율 Playwright E2E 테스트 및 탐색

세션 장면. 플레이어 원격 측정(telemetry)이 아닙니다. 이 봇은 채팅 내에서 실행되었습니다. 스크립트가 저장소에 없기 때문에, 게임을 클론해도 이 센서는 포함되지 않습니다.

단순한 컴파일 성공을 증거로 삼기보다는, 에이전트는 Playwright를 헤드리스 Chromium에서 시작하여 다음 작업을 수행했습니다:

• 플레이테스팅 봇: 단순히 페이지를 로드하는 것 이상을 했습니다. 게임의 물리 엔진(js/physics.js)을 따라 스크립트화된 봇을 움직였고, 간격을 뛰어넘었으며, 충돌 상자(collision boxes) 위를 눌렀습니다.
• 1픽셀 부족: 스테이지 3 확장(맥동하는 빔) 중, 봇은 절대적인 가장자리에서 1픽셀 떨어진 곳에 있는 플랫폼 점프 지점을 발견했습니다. 에이전트는 config.js의 청크를 이동시키고 점프를 다시 실행했습니다.
• 빔 통과: 봇은 무적 구멍(invulnerability hole)을 포착했습니다: 체력 3을 소모하며 깜빡이는 동안 활성 위험 지역을 지나가는 것이었습니다. 이 빔 충돌 로직이 수정되어 무적 상태일 때도 단단하게 유지됩니다.
• 세 단계 걸어보기: 타이틀, 컷신, 보스전, 엔딩까지의 세 단계를 거치며 포트레이트와 오디오 상태가 장면에 따라 변경되는지 확인했습니다. 이 과정 자체가 하나의 세션입니다. CI에서 재실행할 수 있는 테스트 스위트(suite)는 아닙니다.

Montanha hovering with his jetpack in Neo-Sampa

Gle facing the rhythmic pulse beams in Stage 3

모델이 실제로 제공한 것

1. 병렬 서브 에이전트 감사(Parallel Subagent Auditing)

게임의 느낌과 내러티브 일관성을 검토하는 임무를 받았을 때, Claude Code는 두 개의 서브 에이전트를 병렬로 분기하여 작동시켰습니다: 하나는 스토리 플롯 홀에 전념했고, 다른 하나는 게임 엔진의 엣지 케이스(edge cases)를 찾아다녔습니다.

세션 장면(Session scene). 이는 프로덕션 버그 카운트가 아닙니다. 그들은 16개의 우선순위 이슈를 제기하고 빌드를 실행하여 이를 확인했습니다:

• 보스 부활 버그(Boss Resurrection Bug): 보스 폭발이 발생한 상태에서 사망할 경우, '다시 시도(Retry)' 버튼을 누르면 보스가 최대 체력으로 부활하는 현상이 있었습니다.
• 레벨 1 낙하 글리치(Level 1 Fall Glitch): 하위 등급 적들로부터의 밀쳐냄(Knockback)이 영웅을 회복할 수 없는 구덩이 쪽으로 뒤로 밀어냈습니다.

2. '캐릭터 느낌(Character Feel)' 진단하기

세션 장면(Session scene). 저는 _"Gle이 Montanha보다 훨씬 더 유려하게 플레이되는 것 같다."_는 피드백을 제공했습니다. 모델은 속도 변수들을 무작정 조정하는 대신, 물리 매개변수들이 수학적으로 동일하다는 것을 확인했습니다.

그 후 애니메이션 스프라이트(animation sprites)를 검사했습니다:

• Montanha는 비디오 생성 과정에서 수평 방향이 미러링(mirrored)되었기 때문에 점프 상승 시 문자 그대로 뒤로 돌아가고 있었습니다.
• 그의 달리기 사이클은 매 걸음마다 동일한 앞발을 반복하여, 전력 질주라기보다는 갈지느러미를 움직이는 듯했습니다.

모델은 스프라이트 시트를 미러링하고, 상승하는 것과 공중에 떠 있는 것을 선택할 수 있는 제트팩 프레임 셀렉터(jetpack frame selector)를 연결했으며, 뚜렷한 네온 트레일(neon trails)을 도입했습니다 (Montanha는 청록색, Gle은 광채 금색).

3. 12개 청크 스테이지 확장하기

보스 전 단계의 Stage 3 확장을 요청하자, 모델은 **펄스 빔(pulse beams)**을 추가했습니다. 이는 발사되기 전에 깜빡이는 레이저 장벽으로, 옆에 있는 빔과 간격을 두었습니다. 스테이지는 7개에서 12개 구역으로 늘어났습니다. 세션 장면(Session scene). 한 봇 실행은 39초 만에 피해 없이 클리어했다고 보고했습니다. 이 수치는 플레이어의 샘플이 아닙니다.

핵심 요약 (The Takeaway)

일요일은 세 문장짜리 프롬프트에서 코딩, 생성된 아트, 절차적 오디오(procedural audio), 그리고 서비스 워커(service worker)를 갖춘 플레이 가능한 PWA로 변모했습니다. 사용량 패널에는 일일 할당량의 절반 정도가 소요되었다고 적혀 있었습니다. Artlist 비용은 590 크레딧이었습니다. 한 봇 실행은 39초 만에 클리어했다고 보고했습니다.

해당 봇은 리포지토리(repo)에 없습니다. game를 클론하면 Playwright 센서가 아니라 PWA를 얻을 수 있습니다. 저는 빌드가 버그가 없다고 말하지 않을 것입니다. 같은 날, 체력이 가득 찬 보스가 돌아오고, 구덩이로 밀려나며, 무적 상태일 때 걸어 지나갈 수 있는 빔을 발견했습니다. 여러분이 플레이하는 것은 이러한 수정 사항이 적용된 빌드입니다. 실제 플레이어가 어떻게 죽는지 아무도 측정하지 않았습니다.

더 큰 그림: Opus 5.5가 브라우저 게임의 부흥을 촉발하고 있다