[이모저모] 챗GPT로 웹게임 만들기, COW RAID 테스트

사용 글꼴: 던파 연단된 칼날 · 제작 및 저작권 © (주)네오플

COW RAID타락한 목장의 밤

LV 1

체력경험치

처치 0 · 웨이브 1

COW RAID

WASD/방향키 이동 · 마우스 방향 공격
클릭 또는 SPACE 강공격 · R 물약

체력 100/100공격력 16공속 1.0관통 0동료 0물약 3

챗GPT로 웹게임 만들기, COW RAID 테스트

안녕하세요. 수요일의 21입니다. 이번에는 게임을 소개하는 글이 아니라 챗GPT로 게임을 직접 만들어 티스토리에서 실행해 보는 실험을 해봤다. 이름은 일단 COW RAID. 소 떼가 몰려오는 농장에서 살아남는 간단한 핵앤슬래시 게임이다.

 

https://ashitaka21.tistory.com/519

[이모저모] 카우즈 아이오 게임하기｜디아블로풍 핵앤슬래시 웹게임

거창하게 시작한 건 아니다. 카우즈 아이오 같은 게임을 만들고 티스토리 글쓰기 에디터로만 구현할 수 있을까 싶어서 코드를 만들어 달라고 했다. 사이트를 따로 제작하거나 게임 서버를 운영하는 방식이 아니라, 게시글 HTML 안에 게임 코드 자체를 넣는 방식이다. 말은 간단한데 티스토리 편집기는 빈 태그를 지우고 태그 모양도 제멋대로 바꾼다. 게임을 만들기 전에 편집기와 먼저 싸워야 하는 셈이다.

 

이 글은 완성된 게임을 배포하는 글이 아니라 작동 여부를 확인하는 테스트 글이다. 브라우저, 티스토리 스킨, 모바일 환경에 따라 실행되지 않거나 소리와 조작이 다르게 작동할 수 있다. 될지 안 될지는 발행하고 눌러봐야 안다. 웹게임인데 운까지 요구한다.

게임 진행 방법

게임 시작 버튼을 누르면 캐릭터 주변으로 타락한 소들이 몰려온다. 플레이어는 이동하면서 마우스 방향으로 공격하고, 소를 처치해 경험치를 얻는다. 경험치가 차면 레벨이 오르며 세 가지 능력 중 하나를 고를 수 있다. 공격력을 높이거나 공격 속도를 올릴 수도 있고, 관통 능력이나 동료를 선택해 전투 방식을 바꿀 수도 있다.

웨이브가 높아질수록 적의 체력과 공격력이 증가하고 정예 몬스터와 보스가 등장한다. 처음에는 소 몇 마리라 만만해 보이지만 방심하면 금세 포위된다. 농장에 소가 많으면 평화로워 보여야 하는데, 여기서는 전혀 그렇지 않다.

COW RAID 조작 방법

기능	조작 방법
캐릭터 이동	WASD 또는 방향키
일반 공격	마우스 버튼을 누른 상태
강공격	마우스 클릭 또는 SPACE
체력 물약	R 키
모바일 이동	왼쪽 가상 스틱
모바일 공격·물약	오른쪽 버튼

아이템과 성장 요소

레벨이 오르면 도끼날 연마, 광전사의 손, 질긴 가죽, 피의 갈증처럼 기본 능력을 강화하는 선택지가 나온다. 여기에 까마귀 동료, 관통 부적, 성장의 씨앗, 쌍날 룬, 붉은 송곳니도 추가했다.

까마귀 동료는 플레이어 주변을 돌며 가까운 적에게 자동으로 발사한다. 관통 부적은 투사체가 여러 적을 통과하게 만들고, 성장의 씨앗은 경험치 획득량을 늘린다. 쌍날 룬은 한 번에 발사하는 투사체 수를 늘리며 붉은 송곳니는 공격할 때 체력을 조금씩 회복시킨다. 일부 강화 아이템은 적이 낮은 확률로 떨어뜨리기 때문에 직접 주워야 한다.

배경음악과 타격음

외부 음원 파일을 불러오는 대신 브라우저의 Web Audio 기능으로 간단한 배경음악과 효과음을 생성하도록 만들었다. 게임을 시작하면 짧은 음이 반복되며, 일반 타격과 치명타, 적 처치, 아이템 획득마다 다른 소리가 난다. 상단의 스피커 버튼을 누르면 배경음악과 효과음을 함께 끌 수 있다.

브라우저 정책상 사용자가 게임 시작 버튼을 누르기 전에는 소리가 재생되지 않는다. 시작 버튼을 눌렀는데도 아무 소리가 나지 않는다면 브라우저 탭이 음소거됐는지 먼저 확인하면 된다. 물론 코드가 통째로 막혔을 가능성도 있다. 테스트라는 말은 이럴 때 쓰라고 있는 모양이다.

챗GPT로 게임 만들기 시도

이번 작업에서 내가 한 일은 원하는 게임 방식을 설명하고, 필요한 기능을 하나씩 추가해 달라고 요청한 것이다. 처음에는 이동과 공격, 소 몬스터만 있었지만 이후 경험치와 레벨업, 보스, 물약, 모바일 조작을 넣었다. 다시 배경음악과 타격음, 동료, 관통과 성장 아이템까지 더했다. 요구사항을 말할 때마다 코드가 길어졌고, 게임도 조금씩 게임다운 모양을 갖췄다.

다만 챗GPT가 코드를 만들었다고 해서 티스토리에서 무조건 실행되는 것은 아니다. HTML 모드에서는 멀쩡하던 태그가 기본 모드로 이동하면 바뀌기도 하고, 스킨이나 보안 설정에 따라 스크립트 실행이 제한될 수도 있다. 코드 작성과 실제 게시글 작동은 서로 다른 문제다. 그러니 지금 화면에서 게임이 움직인다면 일단 첫 번째 실험은 성공이다. 움직이지 않는다면 다음 포스팅 소재가 하나 생긴 셈이다.

현재 테스트에서 확인할 부분

게임 시작 버튼이 눌리는지, 키보드 이동과 마우스 공격이 가능한지, 레벨업 선택지가 정상적으로 나오는지 확인할 예정이다. 모바일에서는 가상 스틱과 공격 버튼이 화면에 표시되는지도 봐야 한다. 배경음악이 중복 재생되지 않는지, 동료가 늘어났을 때 게임이 지나치게 느려지지 않는지도 확인 대상이다.

아직은 완성판이라기보다 작동하는 프로토타입에 가깝다. 그래도 블로그 글 안에서 직접 만든 게임을 실행할 수 있다면 꽤 재미있는 활용법이 된다. 글을 읽다가 게임을 하고, 게임이 안 되면 코드 이야기를 읽는다. 어느 쪽이든 체류 시간은 늘어날지도 모른다. 블로거는 실패에서도 지표를 찾는다.

게임명 COW RAID

제작 방식 챗GPT를 이용한 HTML5 게임 제작 실험

장르 싱글플레이 핵앤슬래시, 생존 액션

실행 방식 티스토리 게시글 내부 Canvas·JavaScript

테스트 상태 브라우저 및 티스토리 환경별 작동 확인 중