Communitygithub.com

mikeOnBreeze/cc-crossbeam

기술 프로젝트(GitHub 저장소, API, 기술 제품)를 위한 2분 분량의 제품 데모 비디오를 생성합니다. 병렬 빌드 옵션과 구조화된 비평가 검토를 실행합니다. 코드 데모, 아키텍처 설명, 또는 설명 비디오 제작 시 사용하세요.

cc-crossbeam란 무엇인가요?

이 스킬은 기술 프로젝트를 위한 전문적인 2분 분량의 제품 데모 비디오를 자동으로 생성하는 AI 에이전트 워크플로우입니다. GitHub 저장소, API, 또는 기술 제품을 시연할 때 유용하며, 애니메이션(Remotion)과 슬라이드 기반(ffmpeg)의 두 가지 병렬 빌드 옵션을 동시에 실행하여 최상의 결과물을 선택할 수 있습니다. 또한 비즈니스 및 기술 관점의 병렬 비평가(Parallel Critics)가 비디오를 평가하고 점수를 매겨, 품질 기준(7.5점 이상)을 충족할 때까지 반복적으로 개선합니다. Claude Code, Cursor, Codex 등 sessions_spawn을 지원하는 모든 AI 에이전트 플랫폼에서 사용 가능하며, ElevenLabs 음성 합성, Remotion, ffmpeg, Puppeteer 같은 도구와 통합됩니다.

지원 대상~Claude Code~Codex CLI~Cursor
npx skills add https://github.com/mikeOnBreeze/cc-crossbeam/tree/HEAD/.claude/skills/product-demo-video

즐겨 사용하는 AI에게 물어보기

이 에이전트 스킬이 미리 로드된 새 채팅을 엽니다.

문서

제품 데모 비디오

병렬 빌드 옵션과 구조화된 비평가 검토를 통해 기술 프로젝트를 위한 2분 분량의 제품 데모 비디오를 생성합니다.

사용 시기

  • GitHub 저장소, API, 또는 기술 제품을 시연할 때
  • 전문적인 설명 비디오가 빠르게 필요할 때
  • 여러 접근 방식(애니메이션 vs 단순)을 원할 때

워크플로우 (7단계)

발견 → 스크립트 → 병렬 빌드 → 병렬 비평가 → 반복 → 최종 → 전달
   │           │           │                │              │          │         │
 5-10분      10-15분      30-60분           10-15분        0-3회 루프   게이트    출시

1단계: 발견

저장소를 클론하고 분석합니다:

gh repo clone <소유자/저장소> /tmp/<저장소>

추출:

  • 하는 일 (한 문장)
  • 대상 사용자
  • 3-5가지 주요 기능
  • 아키텍처/흐름
  • 시각 자료 (로고, 다이어그램)

질문 (또는 기본값 사용):

질문기본값
분량2분
대상혼합 (기술 + 비즈니스)
어조전문적-대화체
형식애니메이션 설명

2단계: 스크립트

references/script-template.md 구조를 사용합니다:

장면 1: 후크 (0:00-0:15) — 문제 설명
장면 2: 맥락 (0:15-0:30) — 이것이 중요한 이유
장면 3-5: 기능 (0:30-1:30) — 3가지 주요 기능, 각 20초
장면 6: 기술 (1:30-1:50) — 아키텍처/신뢰성
장면 7: CTA (1:50-2:00) — 다음 단계

지침:

  • 분당 150단어
  • 문장당 최대 20단어
  • 능동태 사용
  • 모호함보다 구체적으로

3단계: 병렬 빌드

2개의 하위 에이전트를 생성하여 옵션을 동시에 빌드합니다:

// 옵션 A: Remotion (애니메이션)
sessions_spawn({
  label: "demo-video-option-a",
  task: `Build animated demo video using Remotion.
  
  Script: [paste script]
  Voice: Use ElevenLabs, voice ID CcEB0ARKH8qIyzh2I1OR
  Output: /tmp/demo-video/option-a.mp4
  
  Approach:
  1. Generate voiceover per scene (ElevenLabs API)
  2. Create Remotion project with scene components
  3. Sync animations to audio timing
  4. Render at 1080p 30fps`
})

// 옵션 B: Slides + ffmpeg (단순)
sessions_spawn({
  label: "demo-video-option-b", 
  task: `Build slide-based demo video.
  
  Script: [paste script]
  Voice: Use ElevenLabs, voice ID CcEB0ARKH8qIyzh2I1OR
  Output: /tmp/demo-video/option-b.mp4
  
  Approach:
  1. Generate voiceover (ElevenLabs API)
  2. Create slides with Puppeteer (HTML → PNG)
  3. Combine with ffmpeg, sync to audio
  4. Add simple transitions`
})

두 옵션이 완료될 때까지 기다립니다. 옵션을 사용자에게 제시하거나 품질에 따라 자동으로 선택합니다.


4단계: 병렬 비평가

2개의 비평가 페르소나를 생성합니다 (전체 루브릭은 references/ 참조):

// 비즈니스 비평가
sessions_spawn({
  label: "critic-business",
  task: `Review demo video as Business Critic "Mike".
  
  Video: [path]
  Script: [content]
  
  See references/critic-business.md for full persona and rubric.
  
  Score: Clarity, Professionalism, Business Value (1-10 each)
  Output: Structured review with overall score and specific fixes.`
})

// 기술 비평가  
sessions_spawn({
  label: "critic-technical",
  task: `Review demo video as Technical Critic "Senior Engineer".
  
  Video: [path]
  Script: [content]
  
  See references/critic-technical.md for full persona and rubric.
  
  Score: Technical Accuracy, Credibility, Completeness (1-10 each)
  Output: Structured review with overall score and specific fixes.`
})

5단계: 반복

품질 게이트:

게이트조치
두 비평가 모두 ≥7.5, 치명적 이슈 없음→ 출시
비평가 중 하나 <7.0 또는 치명적 이슈 있음→ 반복
3회 반복 후에도 실패→ 사람에게 에스컬레이션

반복 루프:

  1. 모든 치명적/중요 이슈 수집
  2. 심각도 순으로 수정
  3. 가능한 경우 영향을 받은 장면만 재렌더링
  4. 비평가 재실행

6단계: 최종 검토

출시 전에 다음을 확인합니다:

  • 두 비평가 통과 (7.5+)
  • 치명적 이슈 없음
  • 오디오가 올바르게 동기화됨
  • 모든 장면이 깔끔하게 렌더링됨
  • CTA가 명확함

7단계: 전달

출력:

✅ 데모 비디오 완료!

📹 비디오: demo-video-final.mp4 (2:03)
🎯 대상: [target]
📊 점수: 비즈니스 8.2/10 | 기술 7.8/10

다음 내용 포함:
1. [핵심 포인트 1]
2. [핵심 포인트 2]  
3. [핵심 포인트 3]

파일 저장 위치: [location]

전달 대상:

  • Slack 채널 (지정된 경우)
  • workspace/outputs/에 저장

도구 및 종속성

도구목적필수
ElevenLabs음성 해설 생성예
RemotionReact 비디오 프레임워크 (옵션 A)A/B 중 하나
ffmpeg비디오 처리 (옵션 B)A/B 중 하나
Puppeteer슬라이드 스크린샷 (옵션 B)A/B 중 하나
sessions_spawn병렬 하위 에이전트예

기본 음성: CcEB0ARKH8qIyzh2I1OR (Jeremy - 기술 튜토리얼 내레이터)


파일 참조

  • references/critic-business.md — 비즈니스 비평가 페르소나 및 루브릭
  • references/critic-technical.md — 기술 비평가 페르소나 및 루브릭
  • references/script-template.md — 장면별 스크립트 구조
  • templates/remotion/ — Remotion 프로젝트 스캐폴드 (컴포넌트 포함)
  • scripts/generate-voiceover.py — ElevenLabs TTS 도우미
  • scripts/render-slides.sh — ffmpeg 슬라이드-투-비디오 결합기

관련 스킬