week 03 에밀리 submit

결과물1

https://github.com/selfishclub-all/selfish-ops2/pull/2

“CRM 시작해줘 {URL}” 한 마디로 공유회 전체 마케팅이 자동 실행되는 시스템을 구축 하나의 공유회 URL에서 출발해 8개 채널, 20개 이상의 콘텐츠가 자동 생성되고 발송

원소스 (Input)

공유회 상세페이지 URL 1개

멀티유즈 (Output)

채널	자동 생성물	발송 방식
알림톡	9종 (오픈/리마인드/D-1/당일/쿠폰/입장x2/시작/노션)	n8n 크론 → SOLAPI 자동
카플친	배너 3종 (오픈/리마인드/마감) + text 카피	n8n Webhook → SOLAPI 자동
오픈채팅	카피 9개 (3방 x 3Phase)	Slack 전달 → 수동
인스타	캐러셀 5장 + 캡션	Slack 전달 → 수동
온드미디어	카피 4종 (리틀리/소식/웰컴/대화방메뉴)	Slack 전달 → 수동
이메일	오픈 + 마감 (추후)	Stibee API
UTM	21개 자동 생성	전채널 자동 부착

에이전트 팀 구성

에이전트	역할
director	전체 검수, 최종 승인
data-collector	URL 크롤링 + DB 조회
timeline-planner	Phase별 날짜 자동 계산
copywriter	전채널 카피 생성
media-ops	이미지 생성 + HTML 조합 + PNG 변환
dispatcher	API 자동발송 + Slack 수동 전달

만든과정 및 삽질

Phase 1: 설계 (Day 1-2)

목표 : 기존 셀피쉬클럽 CRM 운영(수동) → 알림톡 7종, 오픈채팅 3개방 카피, 카플친 배너, 인스타 캐러셀, 온드미디어 4종 세팅 등. 이걸 “URL 하나 넣으면 다 나오게” 만들자

CLAUDE.md에 전체 PRD를 작성하고, 에이전트 팀 구조를 설계 OMC(oh-my-claudecode)의 팀 기능을 활용해 각 에이전트에게 역할을 분배

"CRM 시작해줘 {URL}"
        │
        ▼
┌─ 본부장 (director) ─────────────────────────────────────┐
│  전체 검수, 최종 승인, 에이전트 간 조율                      │
│                                                         │
│  Phase 0: URL 크롤링 + DB 조회 + (기획서.md 있으면 참조)    │
│     └→ [data-collector] 크롤 + DB + 기획서 파싱            │
│     └→ 부족한 정보 → 사용자에게 질문                        │
│                                                         │
│  Phase 1: 타임라인 생성                                   │
│     └→ [timeline-planner] Flow1 + Flow2 일정 수립          │
│     └→ 본부장 검수 → 사용자 확인                           │
│                                                         │
│  Phase 2: 타임라인대로 전채널 카피 생성                      │
│  ┌─ 팀장 (team-lead) ──────────────────────────────┐     │
│  │  카피/에셋 품질 검수, 팀원 산출물 리뷰               │     │
│  │                                                 │     │
│  │  [copywriter] 알림톡 7종 + 단톡방 + 이메일          │     │
│  │               + 인스타 캐러셀 + 카플친 + 온드미디어   │     │
│  │  [media-ops]  UTM URL + 배너 이미지 + 캐러셀 스펙   │     │
│  │                                                 │     │
│  │  팀장이 카피/에셋 검수 → 수정 요청 or 승인           │     │
│  └─────────────────────────────────────────────────┘     │
│                                                         │
│  Phase 3: 발송/전달                                      │
│  ┌─ 팀장 (team-lead) ──────────────────────────────┐     │
│  │  [dispatcher] 채널별 실제 발송/전달                │     │
│  │    - 알림톡: n8n 웹훅 → SOLAPI (Phase B)          │     │
│  │    - 이메일: Stibee API (Phase B)                 │     │
│  │    - Slack: MCP send_message로 카피 프레젠테이션    │     │
│  │    - 단톡방/인스타/카플친: 카피 전달 (수동 복붙)     │     │
│  │                                                 │     │
│  │  팀장이 발송 상태 검수                              │     │
│  └─────────────────────────────────────────────────┘     │
│                                                         │
│  본부장 최종 검수: 전체 Phase 완료 확인                     │
└─────────────────────────────────────────────────────────┘

Phase 2: 카피 생성

오픈채팅 카피 삽질 → AI 티안나게. 후킹성있게 실제 사용하는 카피 레퍼런스 제공 + 무한 학습

온드미디어 4종(리틀리/소식/웰컴/대화방메뉴)도 기존 레퍼런스를 수집해서 crm-copywriter 스킬에 반영

Phase 3: 카플친 배너 및 인스타 캐러셀 자동생성

시도 1: Gemini API 이미지 생성 (실패)

Gemini로 배너 이미지를 직접 생성 한글깨짐

시도 2: Gemini로 HTML 생성 (실패)

클로드한테 HTML 코드로 → 디자인 별로

v1: 너무 어둡고 여백 많음
v2: 좌우 이분할 → “다 똑같아 보여”
v3: 풀 이미지 배경 → 모바일에서 글씨 안 보임
v4~v10: 오버레이 농도, 폰트 크기, 레이아웃 계속 조정

최종 해결: Gemini(이미지) + Claude(카피+레이아웃) 하이브리드

배너
Gemini API로 공유회 주제에 맞는 배경 이미지만 생성 (텍스트 없이)
Claude가 HTML로 카피를 오버레이
이미지 위에는 서브카피+메인카피+텍스트 1줄만 (크게)
모바일 가독성 문제

Phase 4: SOLAPI 연동

이미지 업로드는 성공, 발송에서 막힘(이건 클로드가 알아서 삽질하고 해결)

SOLAPI API로 이미지 업로드는 금방 됐다. 근데 친구톡 발송에서 계속 에러가 났다.
- 첫 시도: text 필드 누락 → “text 필드는 필수”
- 두 번째: type: 'CTI' 명시 → “content, imageId 필수”
- 세 번째: content 추가 → “잘못된 필드”
- 네 번째: imageId 위치 변경 → “MMS에서만 사용 가능”
결국 SOLAPI SDK 공식 예제를 찾아서 해결했다. type을 명시하지 않고 kakaoOptions.imageId만 넣으면 자동으로 친구톡으로 인식된다.

npm 권한 문제

Puppeteer 설치할 때 npm 캐시 디렉토리 권한이 root로 꼬여있어서 설치가 안 됐다. sudo chown -R $(whoami):staff ~/.npm으로 해결.

Phase 5: n8n 워크플로우

기존 공유회 알림톡 크론 워크플로우(32노드)를 분석하고, ⑥-3 라이브안내 노드를 추가했다. JSON으로 export → Python으로 수정 → import하는 방식으로 진행했다.

카플친 전용 워크플로우도 새로 구축. Webhook 트리거 기반으로 Claude Code 에이전트가 이미지 생성 후 호출하면 자동 발송되는 구조

Phase 6: 알림톡 템플릿 매칭

PRD에 정의된 7종 템플릿과 실제 SOLAPI 템플릿이 달랐음 → 발송 플로우로 다시 정리 → 스크린샷 9장과 PRD를 비교 매칭

인사이트

AI 이미지 + AI 텍스트

Gemini로 이미지를 만들면 한글이 깨짐 Claude로 고퀄 이미지 안됨. → 결국 각자 잘하는 걸 조합 → Gemini는 비주얼, Claude는 카피와 레이아웃. → 같은 이미지를 카플친과 캐러셀 양쪽에서 같이 사용

n8n + Claude Code = 최강 조합

n8n은 크론 스케줄, 승인 플로우, 배치 발송에 강하다. Claude Code는 카피 생성, 이미지 조합, 코드 생성에 강하다. 각자 잘하는 영역을 나누고 Webhook으로 연결하면 전체 자동화가 가능하다.

OMC(oh-my-claudecode) 활용

Claude Code + OMC팀 에이전트 설계, 스킬 생성, 메모리 저장, 자동화 스크립트 작성까지 하나의 세션에서 구현 Chrome MCP로 n8n 콘솔과 SOLAPI 콘솔을 직접 조작

도구 사용

도구	용도
Claude Code (Opus)	전체 프로젝트 진행, 코드 작성, 카피 생성
oh-my-claudecode	에이전트 팀 오케스트레이션
Gemini API	배경 이미지 생성 (gemini-2.5-flash-image)
Puppeteer	HTML → PNG 변환
SOLAPI	알림톡 + 친구톡 발송
n8n	워크플로우 자동화 (크론/Webhook/승인)
Supabase	멤버십/신청자 데이터
Chrome MCP	n8n/SOLAPI 콘솔 직접 조작