Draw the Life 바이브 웹게임 개발 3주 기록

바이브 게임 개발 잼 참여를 목표로
카드 기반 인생 시뮬레이션 웹게임
Draw the Life를 만들어 보았습니다.

아래는 게임 플레이 영상입니다.

직접 플레이는 아래 주소에서 할 수 있어요.

인생 뽑기 플레이 Link

처음에는 Unity로 모바일 게임을 직접 만들 생각이었지만,
올해부터 웹 기반 바이브 개발 환경에 익숙해지면서
이번 프로젝트는 웹게임으로 먼저 만들어 보기로 했습니다.

웹으로 만들면 베타 테스트 접근성이 좋고,
반응이 괜찮다면 그대로 서비스까지 이어갈 수 있겠다는
기대도 있었습니다.

네이버 블로그 이미지

1주차: 웹게임의 뼈대를 세우다

처음 6일 동안은 게임의 기본 구조를 잡는 데 집중했습니다.
Next.js와 R3F를 활용해서 웹 기반 3D 연출을 시도했고,
안티그라비티와 클로드 코드를 중심으로 개발을 진행했습니다.

초반 결과물은 기대보다 훨씬 웹 페이지에 가까웠습니다.
게임다운 느낌보다는 웹 UI 위에 게임 요소가 올라간 듯한 모습이었고,
핵심 기능도 생각보다 자주 누락되었습니다.

네이버 블로그 이미지

네이버 블로그 이미지

네이버 블로그 이미지

그래도 초반에는 모양새보다 빠른 반복 플레이 테스트가 더 중요했습니다.
눈에 보이는 디테일을 다듬다 보면 게임의 핵심 루프를 완성하지 못하는 경우가 많기 때문입니다.
그래서 카드 선택, 진행 흐름, 최소 UI, 기본 로직처럼
게임이 돌아가기 위해 꼭 필요한 부분부터 잡았습니다.

기획 문서는 몇 주 전부터 AI와 함께 준비해 두었지만,
문서가 있다고 해서 구현이 자동으로 매끄럽게 되지는 않았습니다.
모델별 특성과 토큰 한계를 고려해서 일을 잘게 나누고,
누락된 기능을 계속 확인하며 다시 지시해야 했습니다.

네이버 블로그 이미지

카드 일러스트도 AI 생성으로 만들었습니다.
처음에는 저렴한 이미지 생성 모델을 써 봤지만
프롬프트 이해도와 결과물 품질이 기대에 못 미쳤습니다.
반면 안티그라비티 환경에서 제공하는 이미지 생성 결과는 훨씬 안정적이었습니다.

네이버 블로그 이미지

네이버 블로그 이미지

3D 효과와 카드 연출도 쉽지는 않았습니다.
카드의 공간 움직임, 회색 박스 노출, 특수 효과 타이밍처럼
손볼 곳이 계속 나왔지만,
1주차에는 완성도보다 기본 플레이 흐름을 우선했습니다.

네이버 블로그 이미지

2주차: 도구가 게임을 만들기 시작했다

2주차에 들어서면서 게임의 기본 구조가 잡혔고,
BGM과 효과음이 들어가며 조금씩 게임다운 느낌이 나기 시작했습니다.

이 시점부터는 단순히 게임 화면만 만드는 것이 아니라,
게임을 계속 운영하고 다듬기 위한 내부 도구들이 빠르게 붙었습니다.

특히 인상 깊었던 작업은 다음 여섯 가지였습니다.

  1. 게임 데이터 편집 어드민
  2. 게임 삽입용 일러스트 생성 체계
  3. 효과음과 BGM 생성 체계
  4. 사운드 밸런스 믹싱 도구
  5. 한국어/영어 전환 로컬라이즈
  6. 웹게임용 유닛/e2e 테스트 환경

네이버 블로그 이미지

네이버 블로그 이미지

네이버 블로그 이미지

네이버 블로그 이미지

네이버 블로그 이미지

네이버 블로그 이미지

이 작업들은 직접 만들었다면 며칠에서 몇 주까지 걸릴 수 있는 일들이었습니다.
AI가 코드를 대신 써 주는 수준을 넘어,
개발에 필요한 보조 시스템까지 빠르게 확장해 준다는 점이 인상적이었습니다.

다만 허용량 문제도 현실적으로 크게 느껴졌습니다.
안티그라비티와 클로드 코드만으로는 개발량을 감당하기 어려워져,
중간부터 코덱스도 개발 도구로 투입했습니다.

네이버 블로그 이미지

3주차: 더미가 실제 게임으로 바뀌다

3주차에는 1주차와 2주차 사이의 변화보다 더 많은 변화가 있었습니다.
더미 리소스가 실제 리소스로 바뀌고,
UI/UX가 다듬어졌고,
게임잼 마감에 맞춰 플레이 가능한 형태가 잡혔습니다.

네이버 블로그 이미지

네이버 블로그 이미지

이때 개발 중 찍어 둔 영상과 스크린샷을 모아
개발 과정 영상 편집도 AI에게 맡겨 봤습니다.
영상 편집에는 코덱스를 활용했습니다.

가볍게 맡겨 본 작업이었는데,
개발 초기 더미 상태에서 실제 리소스가 들어가고
UI가 변화하는 흐름을 꽤 잘 정리해 주었습니다.
AI 개발 도구가 코딩을 넘어 콘텐츠 제작 보조까지 확장되는 순간이었습니다.

개발 과정 영상

아래는 3주간의 개발 기간동안
게임이 어떻게 발전되어 가는지
그 과정을 담은 영상입니다.

3주 동안 느낀 것

이번 작업에서 가장 크게 느낀 것은
AI 개발이 단순히 코딩 시간을 줄여 주는 정도가 아니라는 점입니다.

기획 문서 정리, 데이터 편집 도구, 이미지 생성 체계,
사운드 생성과 믹싱, 다국어 처리, 테스트 환경,
영상 편집까지 하나의 프로젝트 주변에 필요한 작업들이
연쇄적으로 빨라졌습니다.

물론 AI가 알아서 완성품을 만들어 주지는 않습니다.
문서가 있어도 누락은 생기고,
기능이 구현된 것처럼 보여도 실제 플레이에서는 결함이 드러납니다.
토큰과 사용량도 계속 관리해야 합니다.

하지만 방향을 잡고, 결과물을 검수하고,
필요한 작업을 계속 쪼개서 맡길 수 있다면
1인 개발자가 감당할 수 있는 범위는 확실히 넓어졌습니다.

네이버 블로그 이미지

3주 동안의 결론은 단순합니다.
바이브 개발은 쉽기만 한 길은 아니지만,
공을 들인 만큼 결과물이 눈에 보이는 속도로 나아집니다.

그리고 이번 프로젝트를 통해
웹게임도 충분히 바이브 개발의 좋은 실험장이 될 수 있다는 것을 확인했습니다.