아이언 케이지 (IRON CAGE) — 앱 버전 (2D)
제작사: 박시후
Claude 아티팩트 Iron Cage v48을 바탕으로 만든 독립 실행 PWA를 3D로 전면 재제작한 버전입니다. 원본 아티팩트는 수정하지 않았습니다.
아이폰 사파리에서 열고 "홈 화면에 추가"하면 앱처럼 전체화면으로 실행되고, 한 번 실행한 뒤에는 인터넷 없이도 플레이할 수 있습니다.
파일 (모두 한 폴더, 하위 폴더 없음 · 18개)
| 파일 | 역할 |
|---|
| index.html | 화면 뼈대 + 디자인, GA4(app_launch), 세로 화면 안내, 푸터 |
| data.js | 선수·기술·입장곡 데이터 (6체급) |
| engine.js | 전투 시스템, AI, 판정 |
| draw.js | 2D 그래픽·HUD (3D 위에 겹쳐 그림, WebGL이 안 되는 기기에서는 2D로 자동 전환) |
| title.jpg | 타이틀 화면 이미지 |
| gif.js | KO 명장면 픽셀 GIF 녹화기 + 앨범 저장소 |
| ui.js | 메뉴·모드·사운드·저장 |
| manifest.json, sw.js | 앱 설정 (가로 모드, #0a0a0a), 오프라인 실행 |
| apple-touch-icon.png, icon-192.png, icon-512.png, icon-maskable-512.png | 앱 아이콘 |
| README.md | 이 문서 |
3D 성능 최적화 6가지 (r3d.js)
- LOD: 카메라 거리에 따라 선수 몸·머리·관중·케이지 기둥을 고/저 폴리곤 모델로 자동 교체
- 오클루전 컬링: 관중석을 8구역으로 나눠 시야 밖 구역은 그리지 않고, LED 펜스에 가려지는 앞줄도 계산해서 생략
- 노멀 맵: 캔버스로 근육 결(복근·가슴·섬유)을 생성해 폴리곤 추가 없이 입체감 표현
- 라이트 베이킹: 옥타곤 바닥의 스포트라이트·그림자·케이지 그림자를 텍스처에 미리 구움 (실시간 그림자 없음)
- 오브젝트 풀링: 혈흔·카메라 플래시·발 그림자·꽃가루를 미리 만든 인스턴스에서 재사용 (경기 중 새 객체 생성 없음)
- 텍스처 아틀라스 + 드로우콜 최적화: 광고판·LED·기둥 텍스처를 한 장으로 합치고 정적 지오메트리 병합 + 인스턴싱 → 경기 중 약 65 드로우콜
- 추가: 프레임이 떨어지면 해상도를 자동으로 낮춤. 주소 뒤에
?debug=1을 붙이면 FPS·드로우콜이 화면에 표시됩니다.
이번에 바뀐 점
삭제: 인게임 재화(돈), 빠른 대결, 레전드 도전, 사운드 설정 옵션, 음성 해설(TTS). 라운드걸은 원래 없음. 음악은 그대로.
추가
- 타이틀 인트로: TAP TO START → 타이틀전 5라운드 마지막 10초, 화면을 탭해 결정타(슬로모션·K.O. 연출) → 챔피언 벨트 세레머니
- 홈 화면: 실시간 데모 경기 위 메탈 로고·커리어 버튼, 뉴스 전광판, 6체급 현 챔피언, 게임 모드 카드
- 태권도 스타일 추가: 킥 최강·빠른 스텝, 거리 유지형 AI. 필살기 뒤후려차기(헤드 스피닝 훅킥) 신규. 한국 킥 파이터 등 15명이 태권도로 전향, 레전드 '회오리' 문태호 추가
- 불꽃 연출 대폭 강화: 런웨이 양옆 화염포가 선수 걸음에 맞춰 파도처럼 발사, 트러스에서 쏟아지는 스파크 폭포, 대형 스파크 분수 4기, 2중 링 불꽃놀이. 케이지 입장·장내 소개 때도 화염포 6발·분수 5기·불꽃놀이 5발 (지역 대회도 소규모로 터짐)
- HUD 실시간 얼굴(정면): 이름 옆 원형 초상이 맞으면 흔들리며 붉게, 흔들리면 비틀, 탈진하면 헐떡, 피·부기·멍·감긴 눈도 그대로, 아래에 상태 표시(멀쩡·타격 누적·출혈·부음·위험·그로기·탈진·KO)
- 탈진 모션: 가드가 가슴까지 처지고 어깨로 숨 쉬며 고개가 젖혀짐, 입 벌리고 헐떡, 입김과 땀
- KO 모션 5종: 뒤로 통나무처럼 쓰러짐, 앞으로 얼굴부터, 무릎 꺾이며 주저앉음, 팔이 굳은 채 뒤로(펜싱 반응), 휘청 돌며 옆으로
- 클린치 연타 억제: 그라운드와 같은 방식(위력 감소·스태미나·상대 프레임·밀어내고 이탈)
- 그라운드 파운딩 연타 억제: 쉬지 않고 연타하면 한 방마다 위력 −14%(최저 30%), 스태미나 추가 소모, 하위 선수가 커버 확률 상승, 4연타 이상이면 팔을 잡아 리가드·포지션 되돌림. 파운딩 자체도 약간 느리고 약하게
- 선수 개성: 선수마다 고정된 얼굴 — 두상 5종, 코 5종(매부리·납작한 복서 코 등), 입 모양, 눈 크기·눈동자 색, 눈썹, 만두귀, 흉터, 주근깨, 보조개 턱, 나이 든 선수는 주름·흰머리. 헤어 20여 종(아프로·드레드·포니테일·투블럭·슬릭백·염색 등), 수염 8종, 헤드밴드·귀걸이·코 테이프·얼굴 문신
- 체급별 체격: 플라이급은 작고 날렵하게, 헤비급은 크고 두껍게(일부는 배가 나옴). 같은 체급 안에서도 키에 따라 차이
- 경기 중 카메라가 선수 머리를 항상 HUD·해설 줄 아래에 두도록 프레이밍
- 업데이트: 서비스 워커가 온라인일 때 항상 최신 파일을 받고(네트워크 우선) 오프라인일 때만 저장본 사용. 실행 중인 버전이 서버보다 낮으면 캐시를 지우고 자동 새로고침
- 업데이트 자동 적용: 새 버전이 올라오면 앱이 스스로 새로고침(경기 중이면 메뉴로 돌아왔을 때). 홈 화면 맨 아래에 버전 번호 표시
- 서브미션 실제 자세: 암바(다리로 가슴·얼굴 누르고 팔 펴기), 트라이앵글(다리로 목·팔 감기), 리어 네이키드 초크(등 뒤에서 팔로 목 감기), 길로틴(앞 헤드락/가드), 암 트라이앵글·다스·아나콘다, 에제키엘, 기무라·아메리카나(팔 꺾기), 오모플라타, 힐 훅·니바·카프 슬라이서·아킬레스(다리 꺾기). 진행도에 따라 조임이 세지고 상대가 버둥대다 탭
- 챔피언 벨트 새 디자인: 스티치 가죽 스트랩, 리벳·보석 사이드 플레이트, 각인 테두리·라인스톤 링·에나멜 필드·케이지 메시 메달리온·왕관·체급 리본, 금속 반사
- 승리 세리머니(옥타곤 인터뷰 대체): 이기면 케이지 위 포효·쓰러진 상대 앞 가슴 치기·백플립(헤비급은 "더 크게!")·벨트 제스처로 챔피언 지목·라이벌 목 긋기·포옹 중 골라 실제 애니메이션으로 연출, 인지도·라이벌 열기에 반영. 경기 후 이벤트 전체 결과 목록 제거
- 3D 기자회견, 3D 계체량(체중계·페이스오프·밀치기), 입장 후 코너 코치 조언, 라운드 사이 1인칭 코너(코치가 눈앞에서 조언·작전 자동 선택, 끊김 없이 다음 라운드, 탭하면 바로 시작)
- UFC 게임식 HUD: 체력 숫자·바 없이 이름 바(얼굴·전적), 스태미나 바(몸통 데미지만큼 최대치가 줄어듦), 인체 실루엣이 맞은 부위(머리·몸통·좌우 다리)마다 흰색→노랑→주황→빨강→검붉게 멍들고 위험하면 붉게 맥동. 다리 30% 이하면 이동 속도 −35% + 중심 흔들림
- 타격 조준: 공격 시작할 때 상대 쪽 라인으로 자동 보정, 상대가 실제로 옆으로 빠질 때만 사이드 스텝으로 빗나감
- 스탠스 전환 오소독스 ↔ 사우스포 (X 키 / 스탠스 버튼)
- 스태미나 탈진: 모든 기술 사용 가능, 대신 공격 30% 약하고 느려짐·이동 −18%, 회복 속도 2.4배, 최대 0.6초 이내에 풀림. 마운트·백 상위 회복 1.3배
- 6체급 물리 차등 (플라이·페더 빠름/가벼움, 미들·헤비 느림/강함·KO율↑) — 밴텀은 페더로, 라이트헤비는 헤비로 통합 (기존 저장 자동 이전)
- 경기 전 배당률, 고정 라이벌의 패턴 분석, 슈퍼리그 승격, 명예의 전당 극악 난이도
- 야생 리그(지하 격투 커리어): 전직 조폭·클럽 기도·택배 기사·국대 탈락 레슬러·영구제명 복서·격투 유튜버 중 인생을 골라 시작. 동네 주차장 → 지하 클럽 레드룸 → 항구 창고 → 폐공장 데스매치 → 카지노 VIP 케이지(보스 '지하의 왕'). 악명, 경기 사이 훈련 선택, 전직별 사건 이벤트. 버튼이 곧 반칙(잽=로블로, 크로스=박치기, 훅=눈 찌르기 / 가드+버튼=정상 펀치), 상대 AI도 반칙 사용. 지하 경기장은 전구·연기·색보정·NO RULES 간판. 경기장별 특수 룰: 주차장(경찰 사이렌 — 마지막 라운드 20초 안에 끝내야, 판정이면 무효), 레드룸(정전 — 수시로 암전), 항구 창고(비 — 킥 차다 미끄러짐), 폐공장(철창이 점점 좁아짐), 카지노(끝내는 방법에 악명 베팅)
조작
- PC: W·A·S·D 이동, J 펀치, K 킥, L 가드, I 클린치·테이크다운, X 스탠스 (보조: U 크로스, H 훅, O 필살기)
- 모바일: 왼쪽 아무 곳이나 엄지를 대면 생기는 조이스틱 + 오른쪽 버튼
업데이트 방법
게임 파일을 바꿔 올릴 때는 sw.js의 VERSION 숫자를 하나 올려야 폰에 있는 옛 버전이 바뀝니다. (현재 v130, data.js의 IC.VER도 같이 올리기)
index.html 4번째 줄의 google-site-verification 태그는 구글 서치 콘솔 인증용이라 지우면 안 됩니다.
그래픽 모드
현재는 2D 그래픽으로 실행됩니다 (3D 렌더러는 꺼 둠). 3D 3종 파일(r3d.js, bodymesh.js, three.min.js)은 앱에서 빠졌고, 필요하면 다시 붙일 수 있습니다.
실제 녹음 효과음 (Kenney Impact Sounds, CC0 — sfx 폴더, 출처: kenney.nl)
sfx 폴더에 파일을 넣고 sfx/index.json에 목록을 적으면 합성음 대신 그 소리를 씁니다. 없으면 지금처럼 합성음.
{"punch":["punch1.ogg"],"heavy":["heavy1.ogg"],"body":["body1.ogg"],"block":["block1.ogg"],"bell":["bell.ogg"],"cheer":["cheer1.ogg"],"ooh":["ooh1.ogg"]}