소개
요즘 '오늘의 운세'를 즐기는 사람들이 많잖아요? 🤔
그래서 그걸 게임 형식으로 재밌게 풀어보면 어떨까? 라는 생각이 들었고, 그렇게 미니게임을 기획하게 되었어요. 단순히 만드는 데서 끝나는 게 아니라, 직접 배포까지 해보자!는 목표도 함께 세웠죠 💪
처음엔 Lovable을 쓰려고 했는데, "비싸서 몇 번 못 쓴다"는 이야기를 하더라고요. 그래서 스터디장님의 추천으로 Google AI Studio로 방향을 바꾸게 되었어요!
진행 방법
🎨 AI 기능 구성 (Google AI Studio)
Lovable처럼 쓸 수 있다는 말에 도전!
AI 프롬프트 작성 후 테스트해보며 게임 논리 구성
!! 근데 google Ai studio 에서는 build 에서 만드는데, 나갔다오면 내가 적은 프롬프트, 대화 같은것들 다 지워져서 리셋 됩니다 ㅠ
🛠 코드 수정 (Cursor)
Google AI Studio에서 코드를 다운로드
Cursor에서 열어서 필요한 수정 진행
특히 사용자 피드백 반영이 실시간으로 잘 됐어요!
🚀 배포 (Firebase Hosting)
Firebase에 연결하여 웹사이트로 배포 완료!
무료로 빠르게 배포할 수 있어서 만족도 👍
🖼 OG 이미지 & 파비콘 생성 (GPT + 이미지 생성툴)
GPT에게 "그림 설명"을 먼저 요청 → 프롬프트 생성
이미지 생성툴에 입력하여 OG 이미지 및 파비콘 완성
🔮 운세 랜덤 기능 (Gemini API 연동)
오늘의 운세를 게임처럼 구현하려다 보니, 랜덤 결과가 필요했어요
Google Gemini API를 연동하여 해결!
👨👩👧 모각에서 실시간 피드백 반영
모각코딩에서 같이 만든 덕분에 유저 피드백을 바로바로 반영할 수 있었고
Cursor가 그런 작업에 정말 최적이었어요
결과와 배운 점
Lovable이 아니어도 충분히 가능하다는 걸 배움!
배포라는 과정을 직접 해보며 배포에 대한 두려움 극복
AI 도구를 잘만 활용하면 이미지까지 포함한 서비스 제작도 어렵지 않음
무엇보다, 함께 한 사람들 덕분에 끝까지 해낼 수 있었음!
특히,
Jun 님의 밀착 과외 🤝 진짜 감사했습니다!!
뇌과학 스터디원들의 이것저것 도와준 협력 💡
이 모든 게 모여서 제가 처음으로 게임을 배포하게 만들었어요!
도움 받은 글 (선택)
필요하다면 나중에 링크 추가 예정!
🔥 여러분도 일단 시작해보세요! 생각보다 배포는 어렵지 않아요.
함께 만들어가는 재미, 놓치지 마세요 :)
