생초보 바이브 코딩으로 약 일주일만에 게임앱출시 ⭐️

• (1) 자기소개

안녕하세요! kiteday 입니다! 평소에 노마드코더에 여러 사이드 프로젝트를 눈팅만 하다가 이렇게 제 프로젝트를 소개하게 되었습니다~!

저는 AI (이미지 스타일화 및 생성모델, 멀티모달) 전공으로 이전까지는 데이터 처리나 모델 파이프라인 설계 등 대학원에서 연구에만 집중해서 개발을 해왔어요.

수년간 Python을 주 언어로 개발했고 자주 사용하는 프레임워크도 항상 같았죠.

같은 언어로 개발하다보니 처음보다 흥미도 떨어지고, 연구를 하는 것도 갈수록 지쳐가서 제게 뭔가 새로움이 필요했어요. 특히 대학원을 졸업하고 나서는 연구∙개발자라는 색채도 얕아지는 것 같았고요.

한 번도 도전해보지 않은 개발 언어를 공부함으로서 스스로가 개발에 대한 즐거움을 다시 찾길 바랬습니다!

기존 개발 경험이 있다보니 Hello World보단 더 난이도 있길 바랬고, 완성된 결과물이 보이는 형태면 더 즐겁게 할 수 있을거라고 생각했습니다!

그래서 예전부터 궁금했던 모바일 앱을 제작하면서 동시에 지식의 간극을 AI를 활용해 줄이는 바이브 코딩에 도전하게 되었습니다!

• (2) 서비스 소개

iOS : https://apps.apple.com/us/app/star-clear/id6757729574

Android : 준비 중입니다.

(현재 테스트 가능한 실물 기기가 iPhone 뿐이라 iOS를 먼저 출시했습니다! 순차적으로 Android도 출시 예정입니다)

** iPhone 게임 화면

** iPad 게임 화면

시간 내에 떨어지는 별을 잡는 단순한 게임앱입니다!

• 노란별 : 점수 획득

• 파란별 : 점수 차감

• 폭탄 : 목숨 -1

각 레벨을 올라갈수록 별이 떨어지는 속도가 빨라지고 게임을 통해 얻은 보석으로 플레이시간이나 목숨을 추가할 수 있습니다. 아이폰과 아이패드에서 플레이 할 수 있습니다!

• (3) 시작하게된 계기

원래는 게임중독이 무서워서 게임을 아예 하지 않는데요?

평소에 듀오링고로 외국어 공부를 하는데 매번 수업이 끝날 때마다 다양한 게임광고를 통해 게임을 한 판씩 플레이 해볼 수 있었습니다.

그러면서 단순반복 게임이 과열된 뇌를 비우기에 좋다는 것을 느꼈고, 이렇게 크게 생각하지 않고 플레이할 수 있는 게임을 만들고 싶었어요. (사실 제게 이런 단순 반복-빠른 보상 구조의 시간이 필요하다고 느껴서 최대한 단순하게 만들고자 했습니다.)

다양한 게임을 플레이해본 경험(ㅋㅋ)으로 대부분의 게임이 갈수록 어려워지는 난이도, 레벨 성공 보상체계, 추가 게임을 위한 보상 등 구조를 가지고 있다는 것을 알게 되었습니다. 그 중 제일 특징적인 것들만 가지고 가장 기본적인 게임앱을 만들고 싶었어요.

더불어 앱스토어 출시까지 앱만들기 전 과정을 경험해보길 바랐습니다. 특히 앱을 사용할 때 나오는 광고에 대한 궁금증이 있었는데요? 직접 개발 과정을 통해 그 궁금증을 해소하게 되었습니다.

• (4) 개발

Frontend: React (TypeScript), Vite, Tailwind CSS

Mobile Bridge: Capacitor

Monetization: Google AdMob

이번 개발 프로젝트의 큰 컨셉 중 하나가 바이브 코딩이었기 때문에 초기 프로토타입 코드는 AI가 쓰고 저는 로컬환경으로 옮기기 및 오류+원하는 방향으로 세부 코드 수정을 맡았어요.

기능 요구서는 Claude, 프로토타입 코드 개발은 Google AI Studio, 오류 수정은 Gemini를 이용했습니다.

대부분 유료버전을 사용하시던데 저는 복잡한 기능의 앱이 아니기 때문에 전부 무료버전을 사용했고 대신 제가 더 많이 오류를 잡아내는 걸 택했습니다.

또한 Google AI Studio를 이용하면 preview를 볼 수 있기 때문에 로컬에 진짜 코드를 가져오기 전에 UI를 보고 테스트 하면서 수정하고 싶은 방안에 대해 채팅으로 계속 수정할 수 있어요.

초기 코드를 빠르게 작성했기 때문에 앱출시까지 전체적인 기간은 총 8일 걸려서 완성할 수 있었습니다! (사이드 프로젝트로 했기 내내하기보다 시간 될 때 하루에 4~5시간 정도 작업했습니다. 또한 승인 심사 등이 처음이라 시간이 조금 더 걸렸습니다.)

바이브 코딩을 해본 짧은 소감은 아직 여전히 개발 지식이 있는 개발자는 필요하다는 점이었습니다. 처음에는 금세 뚝딱하고 만드는 화려함에 시선을 빼앗기기 쉽지만, 기능이 많고 복잡해질수록 오류가 많아지는데 이를 해결하기 위해선 아무래도 기초적인 개발 지식이 필요함을 느꼈습니다.

특히나 shell명령이나 빌드 실행 파일 등에서 오는 오류를 AI가 다 잡아주진 못합니다.

전체적인 코드 스펙 및 코드 확인은 아래 깃허브를 참조해주세요!

https://github.com/kiteday/Star-Clear

더 상세한 개발 과정이 궁금하시다면 하단 블로그를 참고해주세요!

https://kiteday.tistory.com/87

• (5) 바라는 것은?

이번을 계기로 바이브 코딩이 어떤 일을 할 수 있다는 것을 알게 되었습니다. 앞으로 5개 정도 비슷한 수준의 앱을 만들어 전반적인 앱제작 및 출시와 이 개발세계에 대해 프로세스를 이해하고 싶어요. 익숙해지면 추후에 예전부터 생각하던 조금 더 복잡한 앱 아이디어를 구체화 시켜보려 합니다. 일단 이 단기적 목표를 달성하고나면 또 새로운 재밌는 아이디어가 생기리라 생각합니다.

저를 포함해 모두에게 이 게임이 단순반복 통한 뇌에게 쉼을 줄 수 있길바랍니다!

오류 및 개선점이 있다면 사소한 것도 좋으니 의견주세요!

감사합니다. 다들 새해 복 많이 받으시고 좋은하루 되세요. ★