AI 셋이 이어 짠 비행 시뮬레이터, 마지막 차례에 드러난 버그

그록이 초안을 쓰고 제미나이가 게임성을 얹고 오푸스가 마무리하는 릴레이로, 서로 다른 회사의 AI 세 개가 브라우저에서 도는 3D 비행 게임을 이어 만들었다. 마지막 차례의 오푸스는 앞선 코드에서 중력이 거의 0이 되던 물리 오류와 좌표계 어긋남을 짚어내고 비행 모델을 다시 썼다.

AI와 사회 · 2026-07-29

한 사람이 게임을 만들라고 주문하고, 서로 다른 회사의 AI 세 개가 코드 파일 하나를 차례로 넘겨받았다. 그록이 초안을 쓰고, 제미나이가 그 위에 얹고, 오푸스가 마무리하는 순서였다. 결과물은 브라우저에서 바로 여는 HTML 한 파일짜리 3D 항공기 조종 게임이다. Three.js로 하늘과 지형과 기체를 그리고, 마우스로 조종간을 잡는다.

폴로라는 하나의 물음에 여러 모델을 각기 다른 자리에 앉힌다. 여기서는 그 자리가 초안 설계자, 기능 보강자, 최종 완성자로 나뉘어 있었고, 뒤에 앉은 모델은 앞선 모델이 남긴 코드를 그대로 받아 그 위에 다음을 쌓았다.

세 차례에 걸쳐 쌓인 것

초안은 뼈대였다. 하늘 그라데이션과 안개, 넓은 지형과 활주로, 동체와 날개와 프로펠러를 조립한 기체, 속도와 고도를 띄우는 HUD, 그리고 양력과 중력을 흉내 낸 단순한 비행 루프까지가 첫 차례에 놓였다.

두 번째 차례는 여기에 게임을 입혔다. 평평하던 바닥이 사인파 계산으로 산과 골짜기를 얻었고, 하늘에 통과할 링이 놓여 점수가 생겼으며, 브라우저 내장 오디오로 스로틀에 반응하는 엔진음이 합성됐다. 시작 화면과 카메라 흔들림도 이때 더해졌다.

마지막 차례에 드러난 버그들

세 번째 차례의 오푸스는 새 기능을 얹기 전에, 앞선 두 코드에서 반드시 고쳐야 할 것부터 짚었다. 넘겨받은 코드가 겉으로는 돌아가 보여도 안에는 오류가 남아 있었다는 것이다.

가장 큰 것은 물리였다. 앞 차례의 코드는 가속도를 위치에 시간의 제곱으로 더하고 있었고, 그 탓에 중력이 사실상 0이 되어 있었다고 오푸스는 지적했다. 지형에서도 산을 만드는 계산과 충돌을 판정하는 계산이 서로 다른 좌표를 써서, 눈에 보이는 산과 실제로 부딪히는 면이 어긋나 있었다. 화면 요소 하나에는 같은 이름표가 두 번 붙어 뒤엣것이 무시되는 자리도 있었다.

오푸스는 이런 자리들을 하나씩 정리하고, 속도 벡터와 받음각을 바탕으로 비행 모델을 다시 썼다. 실속과 스핀, 과속 진동이 이 단계에서 들어갔다.

정작 '영상'은 마지막에

주문은 조종 게임이 아니라 게임 영상 만들기였다. 앞선 두 차례는 조종할 수 있는 게임까지 만들었지만 영상을 남기는 기능은 넣지 않았다. 오푸스는 화면을 통째로 녹화해 webm 파일로 내려받는 기능과, 기체 둘레를 도는 시네마틱 카메라를 더해 그 요구를 실제로 채웠다.

이 코드가 만들어진 방식이 결과를 설명한다. 이어 쌓는 방식은 기능을 빠르게 불리는 데는 잘 들었지만, 오류를 걸러 내는 몫은 고르게 나뉘지 않았다. 앞 차례가 남긴 버그는 다음 차례가 그 위에 무언가를 더 얹는 동안 조용히 함께 실려 갔고, 마지막에 코드를 뜯어본 자리에 와서야 드러났다.

폴로라가 하나의 문제에 모델을 여럿 앉히는 이유가 여기에 걸쳐 있다. 같은 코드를 서로 다른 자리에서 보게 하면, 한 모델이 지나친 것을 다른 모델이 짚는다.

AI 셋이 이어 짠 비행 시뮬레이터, 마지막 차례에 드러난 버그AI 셋이 이어 짠 비행 시뮬레이터, 마지막 차례에 드러난 버그한 사람이 게임을 만들라고 주문하고, 서로 다른 회사의 AI 세 개가 코드 파일 하나를 차례로 넘겨받았다. 그록이 초안을 쓰고, 제미나이가 그 위에 얹고, 오푸스가 마무리하는 순서였다. 결과물은 브라우저에서 바로 여는 HTML 한 파일짜리 3D 항공기 조종 게임이다. Three.js로 하늘과 지형과 기체를 그리고, 마우스로 조종간을 잡는다.세 차례에 걸쳐 쌓인 것마지막 차례에 드러난 버그들주문은 조종 게임이 아니라 게임 영상 만들기였다. 앞선 두 차례는 조종할 수 있는 게임까지 만들었지만 영상을 남기는 기능은 넣지 않았다. 오푸스는 화면을 통째로 녹화해 webm 파일로 내려받는 기능과, 기체 둘레를 도는 시네마틱 카메라를 더해 그 요구를 실제로 채웠다.출처

grok, gemini, opus 세 ai가 협동해서 코딩을 해보자. 1개의 라운드에 순차적으로 이전 ai가 작성한 것을 토대로 더 개선하고 쌓아나가면 됨. 그록이 초안을 쓰고, 제미나이가 한번 더 보태고, 마지막에 오푸스가 최종코드를 제출해. 코드 작성 주제는, HTML로 실행가능한 3d 실사 스타일 항공기 조종 게임 영상 만들기임.

초안 설계자 (Grok) · grok-4.5

초안 설계자 (Grok) — 1라운드 초안 안녕하세요. 요청하신 대로 HTML 한 파일로 실행 가능한 3D 실사 스타일 항공기 조종 게임 초안을 작성했습니다. Three.js 기반으로, 브라우저에서 바로 열고 조종할 수 있게 구성했습니다. 제미나이·오푸스가 이어서 개선할 수 있도록 구조·주석·확장 포인트를 명확히 잡아 두었습니다. --- 초안 설계 방향 | 항목 | 내용 | |------|------| | 실행 | 단일 .html 파일 (CDN Three.js) | | 그래픽 | 하늘 그라데이션 + 안개 + 지형 + 구름 + 방향광/그림자 | | 기체 | 프로시저럴 메시 항공기 (동체·날개·꼬리·프로펠러) | | 조종 | WASD / 방향키 + 마우스 시야 + Space/Ctrl 고도 | | 카메라 | 3인칭 추적 카메라 | | HUD | 속도·고도·자세 표시 | | 확장 여지 | 활주로, 충돌, 사운드, 파티클, GLTF 모델 교체 등 | --- 초안 코드 (이 파일을 flight.html로 저장 후 브라우저에서 열기) html <!DOCTYPE html> <html lang="ko"> <head> <meta charset="UTF-8" /> <meta name="viewport" content="width=device-width, initial-scale=1.0" /> <title>3D Flight Sim — Draft (Grok)</title> <style> * { margin: 0; padding: 0; box-sizing: border-box; } html, body { width: 100%; height: 100%; overflow: hidden; background: #000; font-family: "Segoe UI", system-ui, sans-serif; } #canvas-container { width: 100%; height: 100%; display: block; } canvas { display: block; width: 100%; height: 100%; } /* HUD */ #hud { position: fixed; inset: 0; pointer-events: none; color: #c8f7c5; text-shadow: 0 0 6px rgb…

기능 보강자 (Gemini) · gemini-3.1-pro

안녕하세요! 기능 보강자(Gemini)입니다. 초안 설계자(Grok)가 작성해 준 탄탄한 뼈대 위에, 게임으로서의 재미와 실사 느낌을 한층 끌어올릴 수 있는 요소들을 추가했습니다. 단일 HTML 파일로 바로 실행할 수 있는 제약 안에서 최대한 효과를 내기 위해 절차적 생성(Procedural Generation) 기법을 적극 활용했습니다. --- 🚀 제미나이(Gemini) 보강 포인트 1. 절차적 3D 지형 (Procedural Terrain): 평평했던 바닥을 세분화하여, 수식을 이용해 산과 골짜기가 있는 입체적인 지형으로 만들었습니다. (활주로 주변은 평탄하게 유지) 2. 목표물(체크포인트 링) 추가: 하늘에 통과할 수 있는 빛나는 링을 배치하여 조종해야 할 목적(게임성)을 부여했습니다. 링을 통과하면 점수가 오릅니다. 3. 웹 오디오 엔진음 (Web Audio API): 외부 파일 없이 브라우저 내장 오디오 노드를 이용해 스로틀과 속도에 반응하는 프로펠러 엔진음을 합성했습니다. 4. 시작 화면 (오디오 정책 대응): 브라우저 오디오 자동 재생 정책을 준수하기 위해 '클릭하여 시작' 화면을 추가했습니다. 5. 카메라 쉐이크 & 비행 물리 개선: 속도가 빠르거나 기동이 격렬할 때 화면이 미세하게 떨리는 효과를 추가하고, 선회 시 양력 벡터가 기울어지는 느낌을 보강했습니다. --- 💻 2라운드 코드 (이 파일을 flight_gemini.html로 저장) html <!DOCTYPE html> <html lang="ko"> <head> <meta charset="UTF-8" /> <meta name="viewport" content="width=device-width, initial-scale=1.0" /> <title>3D Flight Sim — Round 2 (Gemini)</title> <style> * { margin: 0; padding: 0; box-sizing: border-box; } html, body { width: 100%; height: 100%; overflow: hidden; background: #000; font-family: "Segoe UI", system-ui, sans-serif; } #canvas-container { width: 100%; height: 100%;…

최종 완성자 (Opus) · claude-opus-5

최종 완성자 (Opus) — 3라운드 최종본 Grok의 뼈대와 Gemini의 보강을 받아 버그를 잡고, 물리를 다시 쓰고, "영상 만들기"라는 원래 요구를 실제로 충족시켰습니다. 먼저, 이전 라운드에서 반드시 고쳐야 했던 것들 | 문제 | 위치 | 수정 | |---|---|---| | <div id="attitude" id="att-val"> — id 중복 (HTML 파싱 시 뒤쪽 무시) | Grok | 단일 id로 정리 | | 지형 높이 샘플링 좌표계 불일치 | Gemini | Plane을 rotation.x=-π/2 하면 local y → world −z. 생성식은 (x,y), 충돌 판정은 (x,z)로 써서 산과 충돌면이 어긋나 있었음 → H(x,z) 단일 함수로 통일 | | addScaledVector(accel, dt*dt*0.5) | Gemini | 가속도를 위치에 dt² 로 더해 사실상 중력이 0. 속도 벡터 상태를 도입해 제대로 적분 | | camera.lookAt() 후 camera.rotation.z 대입 | Gemini | lookAt이 만든 쿼터니언을 오일러로 덮어써 미세 떨림 → 쿼터니언 slerp 방식으로 교체 | | 구름 스프라이트가 머티리얼 1개 공유 | Gemini | opacity 개별화 불가 → 인스턴스별 clone + 재활용(무한 스크롤) | | getWorldQuaternion(new THREE.Quaternion()) 결과 미사용 | Gemini | 삭제 | | 링 15개가 모두 −Z 일직선 | Gemini | 코스 형태로 배치 + 다음 목표 화살표 | 최종본에서 새로 넣은 것 1. 실제 영상 저장 — canvas.captureStream() + MediaRecorder로 R 키 녹화 → .webm 다운로드 (엔진음까지 믹싱) 2. 시네마틱 카메라 4종 (C 키) — 추격 / 콕핏 / 윙뷰 / 플라이바이(자동 스윕). 영상 뽑기용 3. UnrealBloom + 톤매핑 포스트프로세싱 4. 고도별 버텍스 컬러 지형 (초지 → 암반 → 설선) 5. 날개끝 와류 트레일 (고G 기동 시 진해짐) 6. 양력/항력/받음각(AoA) 기반 비행 모델 — 실속·스핀·과속 진동 7. 미니맵 레이더 + 착륙 판정 + 추락/리스폰 --- ht…