brunch

You can make anything
by writing

C.S.Lewis

by 홍기린 Aug 29. 2024

AI로 2D 방탈출 미니 게임 만들다

근데 이제 ASCII 코드를 곁들인


게임을 개발해보고 싶은 1인 개발자에게, AI는 굴소스같은 만능소스다. 어떤 요리에든 굴소스만 넣으면 맛있어지듯이, AI만 있으면 메마른 나의 감성에 상상력을 더해준다. 게임을 개발한다는 건 단순히 개발실력만 있다고 해결되는 건 아니니까 말이다. 게임을 만들려면 무엇보다 '현실과는 동떨어지면서도 흥미로운' 기획력이 필요한데, MBTI조차 극 초현실주의인 나에게는 이런 것이 무척 힘들었다. 그래서 AI가 나온 이후로 꽤 즐거운 시간을 보내고 있다. 이런 저런 실험을 많이 해보고 있기 때문 ㅋ 스토리를 만들어서 선택형 게임을 만들어보기도 하고 (이전글 참고), 단편 소설도 만들어봤다. 이런 저런 실험들을 즐기고 있는 와중이다. ㅋ


그래서 이번엔 2D 게임 만들기에 도전해봤다. 

최종 결과물은 여기에서 바로 볼 수 있다. ㅋ 귀여운 수준의 프로젝트지만 나름 재미있었다.

개발 도구: React + vite
게임 디자인: ASCII 코드
게임 조작: 키보드 화살표키로 이동
게임 시나리오 도우미: AI (Claude 3.5 sonnet)




1. 기본 시나리오

아무도 없는 비행기에서 탈출하기



2. 아이템 수집

탈출하기 위해서는 해독제를 만들어야 한다. 해독제는 여러 아이템을 모아서 만들 수 있다.

 


3. 이벤트 유형

아이템 줍기 / 아이템 조합하기 / 선택형 모달 / 맵 이동 / 맵 변경(숨어있던 출구 생성) / 엔딩



4. 프로젝트 진행 여정

#1. AI에게 방탈출게임 컨셉을 물어보다.

일단 내가 만들고 싶은 게임에 대해서 다음과 같이 물어봤다. 너무 맨땅에 헤딩하면 안되기때문에, 기본적인 와꾸(?)를 잡고, 그에 대한 아이디어를 10개 달라고 했다. 내가 처음 잡은 와꾸는 "2D 컴퓨터 방탈출 게임"이었다. 그랬더니 꽤나 흥미로운 방탈출게임 아이디어를 알려주었다.

벌써 재밌다


그리고 게임한 심층적인 요소에 대해서도 물어봤다. 게임의 중요한 요소는 뭐라고 생각하니?

그리고 나서 "너는 훌륭한 게임 기획자"라는 페르소나를 잡아줬다. 그리고 나서 게임 기획을 부탁했고, 이어서 첫 (날것의) 컨셉이 나왔다. 이름하여 Echoes of Silence. 처음에는 소리로 제어하는 스타일의 게임이었지만, 그런 설정에 대해서는 추후 덜어냈다. 그리고 계속 질문을 하다가, "아무도 없는 비행기"를 배경으로 하는 시나리오를 다시 만들어달라고 했다. 




여러 질문을 거듭하면서 조금씩 더 구체화시켜달라고 했다. 어떤 맵이 있을 수 있는지, 어떤 스토리 배경이 있을지, 가능한 맵은 어떤 것들이 있을지, 거기에 있을 아이템과 스토리 요소가 뭐가 있을지 등등에 대해서 설명해달라고 했다. 그랬더니 아주 상세히 주르르륵 펼쳐주었다. ㅋ

여기서부터는 이제 조금씩 덜어낼 건 덜어내고, 살을 붙일 것만 붙여서 단순화시키는 작업을 반복하며 완성해나갔다.




#2. 디자인을 ASCII 코드로 결정하다

AI가 어느정도 시나리오를 만들어주고 나니, 이걸 어떻게 구현하지? 게임 아트 컨셉에 대한 고민으로 이어졌다. AI 이미지 생성 기술도 나날이 발전하고는 있지만 게임 아트 이미지에 대한 건 아직 충분하지 않은 느낌이었다. 내가 원하는건 2D 그래픽 픽셀 아트인데, 아직은 AI로 게임에 적합한 픽셀 아트를 만들기는 한계가 있어보였다. 여러 시도끝에 포기했다.


다음으로 생각했던 건, 예전에 재밌게 플레이했던 러스티레이크 같은 유니크한 느낌의 게임 일러스트였다. 하지만 이것도 곧바로 벽에 부딪혔다. 누가 이렇게 유니크한 일러스트를 그릴 수 있겠냐 하는 것이었다. 혹여나 누군가가 그릴 수 있다고 하더라도 비용이 들어갈 것이 분명했다. 


어쩌지... 하면서 유튜브를 찾아보다가 우연히 ASCII code로 게임을 만든 사람의 영상을 보게됐다. 아주 옛날 게임이라고 생각했는데 2년밖에 안된 영상이었다ㅋ 보자마자 바로 아, 이걸로 해야겠다! 바로 결정해버렸다. 별도의 그래픽을 쓸 필요도 없으면서 간단한 조작으로 움직이는 게임을 만들어볼 수 있겠다 싶었다. ASCII 코드라는건 옛날 컴퓨터에서 쓰던 글자들인데 무언가를 표현하기에는 부족함이 없어보였다. 


#3. 코딩, 코딩, 그리고 또 코딩

React에 대해서 깊은 지식이 없던 나는 어짜피 리액트도 배울 요량으로 리액트의 기능을 많이 써보기로 했다. 그래서 코딩 시간은 꽤 걸렸던 것 같다. 그러면서 많은걸 배웠다. 비동기 모달 기능도 붙여보고 여러 훅들도 다양하게 사용하고, Provider와 context에 대한 기본적인 것들도 (원래 알고는 있었지만) 실제로 쓰면서 많이 익숙해졌다.


그렇게 이벤트 하나씩, 아이템 하나씩, 차근 차근 덧붙여나갔다. 이 프로젝트를 시작한건 7월 초였다. 별거 없는, 맵도 3개밖에 없는 간단한 게임을 만들기에 긴 시간일수도, 짧은 시간일 수도 있었지만 2달간 리액트도 많이 익숙해지고 재미있게 코딩했던 것 같다. 무엇보다 아이템을 수집하고 엔딩까지 빠르면 5분(?)도 채 안걸리는 플레이타임의 게임이었지만, 다 만들고 나니 뭔가 뿌듯했다. ㅋ


>> 여기에서 플레이해보실 수 있답니다 :)





***


주말이나 시간 날때 짬짬이 만든거지만, React를 공부하기에는 더할나위 없이 좋았던 프로젝트였다. 처음에는 javascript로만 만들다가, vanila는 너무 달콤쌉싸름해서 좀 더 편한 리액트를 쓰는게 좋을 것 같다고 생각했다. 결국 잘했던 선택이었다. 


또한, 2D 게임에서의 여러 이벤트들의 유형을 간접적으로 체험해볼 수도 있어서 재밌었다. 난 게임 기획에 대해서 아무것도 모른다. 그저 재밌는 프로젝트를 해보고 싶어서 시작한 거였다. 다음에도 비슷한 프로젝트를 또 만들어보고 싶다. 다음 프로젝트는 이번에 만든 코드를 바탕으로 조금 더 리팩토링해서 더 큰 스케일로 만들어보려고 한다. 


이제 다시 AI랑 시나리오작업하러 가봐야겠다. ㅋ




브런치는 최신 브라우저에 최적화 되어있습니다. IE chrome safari