직접 코드 작성 없이 그록3 AI로 2D 게임을 만들 수 있을까?

그록3 AI를 이용해서 간단한 게임 아이디어를 구현해보는 테스트를 진행하려고 한다. 게임 아이디어는 다음과 같다.

<게임 목표>
자원을 캐서 내 캠프를 늘리고 남의 캠프를 찾아서 파괴하기
승리 조건 : 내 캠프가 하나 이상 존재하고 더 이상 사용 가능한 자원이 없을 때 모든 적 캠프를 파괴하면 승리.
패배 조건 : 내 캠프가 0개일 때 패배.
플레이 팁 : 자원을 캐면 캠프를 늘려 생존력을 올리는 대신 그 사이에 캠프가 공격 당할 가능성이 높아진다. 적 캠프를 공격하기 위해 찾으러 다니면 자원을 못 캐므로 적절히 리스크 관리가 필요하다.

<운영 방식>
사용자가 게임 설치 하지 않고 웹 상에서 플레이할 수 있어야 한다.

<매치 방식> 
플레이 인원 : 최대 10인
플레이 버튼을 누르면 사람들이 플레이하고 있는 방에 접속
빈 방이 없을 경우 새로운 방이 자동으로 생성되어 입장 

<그래픽>
원형 필드 바깥은 검정색으로, 필드 안쪽은 흰색으로 칠한다.
자원은 검정색 사각형으로 표시한다.
플레이어는 연두색 원으로 표시한다.
플레이어의 캠프는 연두색 삼각형으로 표시한다.
적 플레이어는 빨간색 원으로 표시한다.
적 플레이어의 캠프는 빨간색 삼각형으로 표시한다.

<규칙>
게임을 시작하면 플레이어는 필드의 무작위 공간에 일정 거리를 유지한 채 배치된다.
플레이어의 캐릭터는 자동으로 움직이며, 플레이어는 방향키와 마우스 커서로 캐릭터의 방향만 제어할 수 있다.
자원은 무작위 개수와 형태로 뭉쳐져 일종의 지형처럼 보이게 한다.
플레이어는 자원 개체에 일정 횟수 부딪히면 해당 자원을 습득할 수 있다.
수집한 자원을 이용해 새로운 캠프를 배치할 수 있다.
새로운 캠프는 Alt 키를 눌러 배치할 수 있다. 기존에 있는 캠프와 일정 거리 안에서 Alt 키를 누르면 기존의 캠프를 강화한다.
자원은 한 개의 방에서 최대 수용 가능한 플레이어 인원에 맞춰서 적절한 수량을 배치한다.
보유하고 있는 자원은 필드의 원하는 위치로 가서 Ctrl 키를 눌러 재배치할 수 있으며 방어용 지형으로 이용할 수 있다.
플레이어가 죽으면 해당 인원이 사용한 자원만큼 맵에 리젠 된다.
플레이어 공백이 있을 때 다른 플레이어가 접속할 수 있다. 게임은 한 유저가 모든 자원을 모두 습득할 때까지 계속된다.

그록3 AI가 생성한 게임의 첫 번째 버전

내가 제시한 아이디어를 바탕으로 게임을 만들어 달라고 요청하자, 게임의 개요를 정리하고 javascript를 이용해 코드를 작성해주었다. 첫 버전인 만큼 내가 상상했던 그림과 상당한 차이가 있는 요소들이 있었다. 

게임에는 몇 가지 문제가 있었는데, 일단 멀티 플레이는 예제 수준으로 구현해 놨다는 점, 필드의 크기가 너무 작다는 점, 컨트롤이나 기능 구현 상의 몇 가지 문제점, 자원의 개수와 배치 등이었다. 이제 발견한 문제를 토대로 해결해 달라고 지속적으로 요청해볼 것이다.

아래는 다음에 요청한 내용이다.

일단 네가 써준 다음 태그를 보자. 

canvas { 

    background-color: #fff; 

    border-radius: 50%; 

} 

canvas는 사각형이어야해. 플레이어의 디스플레이 사이즈에 맞게 캔버스를 그려줘. 필드가 원형이어야 한다고 말한건 canvas 안에서 플레이어가 움직일 수 있는 경기장이 원형이어야 한다고 말한거였어.

필드 사이즈는 캔버스와 무관해야해. 필드를 캔버스 바깥까지 구현되게 크게 만들고 플레이어에게 카메라를 고정해줘

그록3 AI가 생성한 게임의 두 번째 버전

요청 내용을 몇 번 수정한 끝에 원하는 결과를 얻었다. 그러나 이번엔 캔버스에 여백을 남겨 놓는 문제가 생겼다.

canvas.width = window.innerWidth * 0.8; 

 canvas.height = window.innerHeight * 0.8; 

이 부분을 윈도우의 크기의 0.8배로 하지 말고 딱 맞게 1배로 맞춰줘. 그리고 테스트용 적 플레어 수를 10명으로 늘려줘. 모든 플레이어의 스타트 위치를 필드 사이즈를 생각해서 일정 거리를 유지한 채로 시작하게 만들어줘. 

그록3 AI가 생성한 게임의 세 번째 버전

플레이어 시작 위치의 최소 거리를 더 늘려도 될 것 같아. 그리고 자원의 개수를 지금보다 훨씬 늘려줘. 자원은 무작위 개수만큼 서로 다양한 모양으로 뭉쳐있으면 좋겠어.

그록3 AI가 생성한 게임 중간 점검

몇 번의 요청을 더 반복해서 문제점들을 개선했다. 미니맵을 만들어주거나 자원을 군집 배치하거나 자원에 부딪혔을 때 튕겨져 나오는 효과를 주는데에 문제가 없었다. 다만 여러가지 세부 사항에서 아직 오류가 많다.

슬슬 코드가 길어지니 점점 오류가 많아져 파일을 나눠 달라고 얘기했다. html과 css, 클래스별 js파일로 분류해서 만들어주었다.

진행할수록 점점 채팅도 느려지고 오류도 많아져 조금 버거워 보인다. 목표는 멀티플레이 구현인데 거기까지 가능하긴 힘들 것 같다. 무엇보다 어느 순간부터 수정된 코드를 받아도 게임 화면이 생성되지 않을 정도로 코드가 꼬이는 문제가 발생해 해결되지 않는다.

이 정도 보다 훨씬 단순한 수준의 게임이면 모를까 아직 내가 코드를 하나도 손 보지 않고 완성도 높은 무언가를 만들어내기는 힘들 것 같다. 그래도 작업의 초기 단계에 원하는 기능을 척척 구현해주는 부분은 놀라운 수준이다. 지금은 직접 프로그래밍하며 필요한 부분에 지원 받는 수준이지만 10년 후라면 얼마나 큰 퍼포먼스를 보여줄지 정말 궁금하다.