4강 · 바이브 코딩 찍먹
코딩을 몰라도 말로 프로그램을 만드는 시대. Google AI Studio로 홈페이지와 챗봇을 직접 만들어봅니다.
4강 · 바이브 코딩 찍먹
AI가 강의 내용을 영상으로 만들었어요.
바이브 코딩이란?
코딩을 몰라도, 말로 프로그램을 만든다.
- "이런 거 만들어줘" → AI가 뚝딱
- "여기 색깔 바꿔줘" → AI가 수정
- "버튼 추가해줘" → AI가 추가
바이브 코딩이 중요한 이유는 이제 소상공인도 내 가게만을 위한 맞춤 도구를 직접 만들 수 있기 때문입니다. 홈페이지 제작 외주를 맡기면 200만~500만원이지만, 바이브 코딩으로는 오늘 무료로 만들 수 있습니다. 실전 팁: "만든다"는 생각보다 "AI에게 주문한다"는 생각으로 접근하면 훨씬 편합니다. 요리사에게 메뉴를 주문하듯이 원하는 것을 구체적으로 말하면 됩니다.
카카오톡 할 수 있으면 바이브 코딩 할 수 있습니다.
강사 시연: Google AI Studio로 직접 만들기
aistudio.google.com 접속 → 구글 로그인
3단계:
- 준비 — Google 계정 로그인
- 요청 — 한국어로 대화창에 "우리 가게 홈페이지 만들어줘"
- 생성 — 코드 자동 생성, 결과물 미리보기
Google AI Studio는 무료이고 별도 설치가 필요 없습니다. 구글 계정으로 로그인하면 바로 시작할 수 있어서 오늘 강의 중에 실제로 만들어볼 수 있습니다. 코드가 생성되는 과정을 보면 처음엔 복잡해 보이지만 결과 화면 미리보기만 보면 됩니다. 실전 팁: 지금 바로 스마트폰이나 노트북으로 aistudio.google.com에 접속해서 구글 로그인을 완료해두세요.
말로 설명하면 AI가 즉시 코드를 짜줍니다! 실시간 생성 과정을 지켜보세요.
시연 과정
| 단계 | 요청 | AI가 하는 일 |
|---|---|---|
| 1단계: 생성 | "카페 홈페이지 만들어줘" | AI가 기본 구조 생성 |
| 2단계: 추가 | "메뉴 섹션 추가해줘" | AI가 메뉴판 추가 |
| 3단계: 수정 | "색상 톤 변경해줘" | AI가 디자인 수정 |
3번의 대화로 홈페이지가 완성됩니다.
AI 잘 쓰는 핵심: 프롬프트 작성법
| # | 원칙 | 예시 |
|---|---|---|
| 1 | 구체성 | "홈페이지" ✗ → "부산 해운대 카페 홈페이지, 메뉴와 위치 포함" ✓ |
| 2 | 순차적 | 한 가지씩 요청 |
| 3 | 레퍼런스 | 참고 이미지/URL 첨부 |
| 4 | 대화형 수정 | "○○ 부분을 ○○로 바꿔줘" |
| 5 | 역할 부여 | "10년 경력 마케터" |
AI는 요리사, 프롬프트는 레시피. 구체적인 레시피가 더 맛있는 요리를 만듭니다.
시연: 레퍼런스 + URL 활용법
AI에게 말로만 설명하면 한계가 있죠?
방법 1 — 이미지 레퍼런스: 마음에 드는 홈페이지 스크린샷 첨부 + "이 디자인 스타일로 만들어줘"
방법 2 — URL 직접 전달: "이 사이트(URL) 참고해서 비슷하게 만들어줘" → AI가 URL의 구조와 스타일을 분석해서 적용
말 + 레퍼런스 = 내 머릿속 그대로
API 키 = AI의 전화번호
챗봇을 홈페이지에 붙이려면 API 키가 필요합니다.
API 키 = AI를 외부에서 부를 수 있는 열쇠
발급 방법:
- Google AI Studio → Get API Key
- Create API Key 클릭
- 키 복사 → 메모장에 저장
⚠️ 이 키는 비밀번호! 절대 공유 금지! 이 열쇠 하나면 Gemini AI를 어디서든 쓸 수 있습니다.
시연: 우리 가게 챗봇 만들기
STEP 1: 시스템 프롬프트
- 역할 정의: "○○가게 고객 상담 챗봇"
- 주요 정보: 영업시간(10~22시), 주차 가능
STEP 2: 테스트 및 최적화
- 고객: "영업시간이 어떻게 돼요?" → AI: (AI 답변)
- 고객: "메뉴 추천해주세요" → AI: (AI 추천)
웹사이트 적용 시 24시간 자동 고객 응대!
실습 시간! 40분간 직접 만들기
aistudio.google.com 접속하세요.
만들어볼 것 (택 1):
- 우리 가게 홈페이지
- 고객 상담 챗봇
- 인스타그램 홍보 문구 생성기
- 자유 주제
막히면 손 들어주세요. 돌아다니면서 도와드립니다!
실습 힌트
잘 안 될 때 팁:
| # | 팁 |
|---|---|
| 1 | 구체적으로 말하기 — "홈페이지" ✗ → "부산 해운대 카페, 메뉴와 위치 포함" ✓ |
| 2 | 한 번에 다 말하지 말기 — 한 가지씩 요청 |
| 3 | 마음에 안 들면 수정 요청 — "○○ 부분을 ○○로 바꿔줘" |
| 4 | AI에게 역할 부여 — 역할 부여 잊지 마세요! |
틀려도 괜찮습니다. AI가 다시 고쳐줍니다!
4시간 전체 정리
| 강 | 내용 | 도구 |
|---|---|---|
| 1강 ✅ | 마케팅 기본기 | 바구니 전략, 사진/리뷰 |
| 2강 ✅ | AI로 상품사진, 카드뉴스 | Gemini, 나노바나나 |
| 3강 ✅ | 영상 + 꿀팁 | Veo, Recraft, Quiver, Gems |
| 4강 ✅ | 바이브 코딩 | AI Studio로 직접 만들기 |
[4시간 전] AI 뭐 어떻게 쓰지? → [지금] 사진, 영상, 홍보물, 챗봇까지!
감사합니다
AI로 소상공인의 성공을 만듭니다.
김다윤 · (주)바이론 대표 · 경영지도사(마케팅) · SW 개발자