소개
지피터스의 직원들의 AX 가속화를 돕기 위해 '사내 바이브코딩 워크샵'을 진행했습니다.
같이 모여서 원데이 강의를 듣고,
사전 인터뷰 결과 각자 받은 '바이브코딩 기획 문서'로 일주일 간 각자 최대한 결과물을 만드는 것이 목표입니다.
저는 '키워드'를 입력하면,
해당 주제 관련해서 국내외 강의 사이트에서 유사한 주제의 강의가 어떻게 개설되어 있는지 크롤링 되고
구 글 트렌드 검색량 등 키워드 검색량 대비해서
수요 / 시장에 형성되어 있는 가격 등을 종합적으로 분석해서
'지피터스'가 강점을 가질 수 있는 차별화된 강의 주제를 도출하는 서비스를 만들고 싶었어요.
진행 방법
AI Studio Build로 프로토타입 먼저 뽑기
기획을 기반으로 차근차근 환경설정부터 시작해서 작은 단위 기능부터 붙여나가며 개발을 하는 것이 정석이겠으나,
실제로 이것이 서비스화 되었을 때 어떤 형태인지를 우선 확인하면 초기 기획을 빠르게 개선할 수 있을 것으로 생각되었어요.
사전 인터뷰 결과 LLM이 만들어준 '바이브코딩 기획 문서' 는 말 그대로 '인터뷰' 결과를 바탕으로 생성되었기 때문에, LLM의 초기 기획이 제 니즈와 100% 맞을지 확신하기도 힘들고
프로토타입 결과를 보고 넣었으면 좋겠다 빼면 좋겠다 하는 기능을 우선 정립할 수 있지 않을까요.
그래서 우선 '바이브코딩 기획 문서' 에 LLM이 미리 정리해준 예상 산출물 내용을 AI Stuido에 넣었습니다.
**워크숍 완성 결과물:**
- 특정 키워드 입력 시 자동으로 여러 강의 플랫폼(패스트캠퍼스, 스파르타 코딩 클럽, 해외 유명 사이트 등)을 크롤링하여 정보 수집
- 수집된 데이터를 LLM과 논의하여 1차 검증 후, 구글 트렌드 등 키워드 검색량과 대비한 종합 점수 산출
- 강의 주제별 인기도, 직군별 수요, ROI(매출 관점) 등을 정량 지표로 평가하여 추천
**구체적 형태 및 예시:**
- 데이터 시각화 대시보드 형태로 결과 제공
- 각 강의 주제별 종합 점수 및 세부 평가 지표(검색량, 경쟁 강의 수, 예상 수요, ROI 등)를 한눈에 확인 가능한 인터페이스프로토타입 화면 확인
CourseInsight AI 라고 벌써 이름부터 뽑아줬네요 ㅋㅋㅋ
흰색 배경에 코스사이트 AI 로고
첫 화면 - 이렇게까지 거창하게는 안 나와도 될 것 같음
vibecoding이라고 검색을 해보았습니다.
뭔가 그럴듯한 페이지가 나왔는데 영어라서 한/영 전환 기능을 일단 추가해달라고 했습니다. (향후에는 영어 기능은 뺄 예정)
회사 대시보드의 스크린샷
실제로 크롤링 기능은 없지만 개략적인 구성 요소를 확인할 수 있습니다. (크롤링해서 분석 해오는 척 함)
각각 수요, 포화도, 평균 강의 가격은 어떻게 분석하는 로직을 짰는지 잘 모르겠습니다. (동일한 키워드로 매번 검색할 때마다 계속 달라짐)
이건 추후에 지피티와 대화를 통해서 나름의 로직을 만들 수 있을 것 같아요.
제가 요청하지 않았는데, 상단에 '기록'이라는 탭을 만들었네요. 일자별로 검색 기록을 남기고 - 과거에 주제 관련해서 고민했던 히스토리를 파악할 수 있을 것 같습니다.
처음에는 기록탭이 동작하지 않아서 다음과 같이 추가 프롬프트를 넣었습니다.
좋아. 지금은 '기록' 탭에 아무 것도 없는데 과거 검색한 내용과, 검색 내용 중 내가 흥미롭게 느꼈던 부분들을 정리해서 볼 수 있게 구현하려면 어떻게 하면 좋을까?
그 결과는 그닥 마음에 들지 않게 나왔네요... 일단 기록 탭 쪽은 추후에 만들고 검색 - 크롤링 - 좋은 주제 추천 쪽에 조금 더 힘을 실어야겠습니다.
그리고 단순히 강의 제목 / 가격 / 수강생 뿐 아니라 - 강의 상세페이지에 접근해서 강의 별 특이점을 뽑고, 저희 쪽 차별화 전략 도출에 반영할 수 있게 되면 좋겠어요.
이렇게 만든 서비스는 내 깃헙 레포지트리에 연동하거나 바로 배포까지 가능합니다.
단, 이전에 실험해본 결과로는 어느정도 화면 구현까지는 무리 없이 잘 되나, 크롤링 등 실제 기능을 붙이는데는 한계가 있었어요. 하여 일정 수준까지 개선을 한 후 다음에는 클로드코드로 넘어와서 작업을 하는게 편합 니다.
다음 진행 단계로... 제 생각에는
해당 프로젝트를 우선 별도 리포지토리로 만들어서 - 해당 프로젝트를 바탕으로 '화면기획서.md'를 뽑아달라고 한 다음에,
실제로 기능 개발을 진행하고 있던 본진 리포지토리에서 클로드코드를 켠 후 'ai studio'에서 만든 레포지토리와 '화면기획서.md'를 참고해서 필요한 코드는 본진 레포지토리에 이동시켜달라고하고,
이에 따라서 초기 '바이브코딩 기획 문서.md'를 개선해달라고 요청 (plan 모드, ultrathink) 하면 제가 생각했을 때 불필요한 기획 제거, 필요한 기획을 처음부터 다시 잡고 갈 수 있지 않을까 생각이 들었어요.
초기 기획 문서를 꼼꼼히 읽으면 꼭 화면이 없어도 파악은 가능하지만, 이게 또 눈으로 봐서 체감되는건 다르더라고요.
적절한 방향성은 저희 사내 워크샵 강사인 개발자F 님께 코칭으로 여쭤볼 예정입니다~
덧) 비교 - 클로드코드로 프로토타입 먼저 뽑아달라고 하는 것도 당연 가능한데
AI Studio보다 시간이 훨씬 많이 걸림 (10배쯤 오래 걸림)
안 예뻐서 일단 버기가 쫌 시름...
결과와 배운 점
각자 강점이 뚜렷한 AI들을 어떻게 혼합해서 쓰면 가장 빠르고, 좋은 결과물을 만들 수 있을지 - 그리고 이 방법을 어떻게 알 수 있을지 (예) SNS에 바이브코딩 그루들의 방법론 따라하기) 고민이 되네요.
