Communitygithub.com

FireAmun/remotion-dev-video-kit

한 줄짜리 아이디어에서 브랜드 숏 개발 영상을 처음부터 끝까지 제작합니다. 리서치, 제안, 승인, 음성, 애니메이션 장면, 미리보기, 렌더링, 그리고 Instagram/TikTok/LinkedIn용 Buffer 초안 작성을 포함합니다. 크리에이터가 비디오 아이디어나 주제를 주거나, 다음 에피소드 / '오늘의 영상'을 요청하거나, '~에 관한 영상을 만들어 줘'라고 말할 때 사용합니다.

remotion-dev-video-kit란 무엇인가요?

이 스킬은 Remotion을 기반으로 한 완전 자동화된 숏 폼 개발 비디오 제작 파이프라인입니다. 크리에이터가 한 문장의 아이디어만 제공하면, 웹 리서치, 제안서 작성(승인 대기), TTS 음성 생성(Qwen3-TTS), 애니메이션 장면 빌드(plan.json 기반), 미리보기 확인(승인 대기), 렌더링, 그리고 Buffer API를 통한 Instagram/TikTok/LinkedIn 초안 작성을 자동으로 수행합니다. 에피소드는 1080×1920, 30fps, 최대 60초로 고정된 시리즈 스타일을 유지하며, 후크→팔로우 유도→콘텐츠→엔드 카드→다음 주제 티저의 동일한 비트를 따릅니다. 두 번의 승인 단계(제안서와 미리보기)가 포함되어 크리에이터의 편집 권한을 보장하며, Buffer 초안은 사우디아라비아 리야드 시간 기준 오후 7시에 예약됩니다.

지원 대상✓Claude Code~Codex CLI~Cursor
npx skills add https://github.com/FireAmun/remotion-dev-video-kit/tree/HEAD/.claude/skills/daily-video

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

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

문서

일일 비디오: 아이디어 → 리서치 → 승인 → 제작 → 미리보기 → 렌더링 → Buffer

.claude/CLAUDE.md를 먼저 읽으십시오. 이 파일이 (브랜드, 비디오 규칙, 음성, 안전 영역에 대한) 진실의 원천입니다. 이 스킬은 단계별 실행입니다. 크리에이터의 승인이 필요한 두 번의 강제 정지 지점이 있습니다: 제안서(2단계)와 미리보기(5단계). 절대 건너뛰지 마십시오.

아래 경로는 <date> = 오늘 날짜, YYYY-MM-DD (Asia/Riyadh)를 사용합니다. 에피소드 폴더: public/episodes/<date>/.

외형과 스타일: 모든 에피소드가 동일해야 함

모든 에피소드는 첫 번째 에피소드와 동일하게 보여야 합니다. 시리즈는 그 외형으로 인식됩니다. 따라서:

  • 동일한 빌딩 블록만 사용하십시오. 기존 세트, 리깅된 캐릭터, 포즈, 동작, 소품 및 아이템을 사용하십시오. 일상적인 실행에서 src/theme.ts, 폰트, 색상, 캐릭터 아트, 챕터 바, 캡션 스타일 또는 사운드 효과를 변경하지 마십시오. 새로운 시각 자료(새 세트, 포즈, 소품 또는 아이템)는 크리에이터가 별도로 요청하는 작업입니다. 요청 시 동일한 블랙 앤 골드 스타일로 제작하고 이 스킬의 목록에 추가하십시오.
  • 동일한 구조. 1080×1920, 30fps, 최대 60초. 상단에 "EP N" 레이블 + 7개 챕터 바, 하단에 단어 단위 캡션(밝은 색은 말하는 단어, 흐린 색은 다가올 단어, 줄당 하나의 골드 키워드). 한 문장 = 한 장면; 캐릭터가 모든 문장을 연기합니다. 소품/아이템은 말하는 단어에 맞춰 등장합니다. 1.5~3초마다 시각적 변화, 모든 장면 전환에 'woosh' 효과.
  • 동일한 비트. 처음 2초 안에 후크 → 초기 "팔로우" 유도(팔로우 버튼 장면) → 콘텐츠 챕터 → yoursite.com과 정확한 마지막 문장이 있는 엔드 카드 → "다음: <다음 주제>" 티저.
  • 동일한 음성. assets/voice/reference_energy.wav를 참조하는 Qwen3-TTS, 동일한 시드, 에너제틱한 구두점.
  • 동일한 게시. 리야드 시간 오후 7시, Instagram Reel (피드에 공유) + TikTok + LinkedIn, Instagram과 TikTok에는 AI 생성 레이블 켜기(음성은 AI 클론이므로; 레이블링은 정직하며 계정을 보호합니다).
  • 에피소드 번호는 topics-log.json에서 순서대로 증가합니다(다음 번호 = 마지막 번호 + 1).

1. 리서치

  1. topics-log.json을 읽으십시오: 주제를 반복하지 마십시오. 마지막 에피소드에서 "다음" 주제를 약속했다면 그것을 우선시하십시오.
  2. 웹 검색: 2~4개의 신뢰할 수 있는 출처(공식 문서, GitHub README, 논문, 공급업체 자체 페이지). 모든 숫자, 가격, 버전 또는 주장을 검증하십시오. 빠르게 변하는 사항에는 "<날짜> 기준"을 명시하십시오. 절대 사실, 벤치마크 또는 코드를 지어내지 마십시오.
  3. 포지셔닝: 유용한 팁을 주는 실제 개발자의 관점에서. 과장된 마케팅이나 "AI가 만든 것을 보세요" 식이 되어서는 안 됩니다. 도구 관련 주제는 개발자 팁으로 구성하십시오.

2. 제안서 - 승인을 위한 중단

크리에이터에게 채팅으로 간략하게 보여주십시오:

  • 후크 (처음 2초): 구체적인 이해관계, 숫자 또는 주장. 인사말 없음.
  • 장면 표, 문장당 한 행(58개 챕터, 약 1216개 장면, 총 3060초, 초당 약 2.53.5단어 발화): # | 챕터 | 문장 | 세트 | 캐릭터 동작 | 어떤 단어에 어떤 아이템 등장 챕터: HOOK, WHAT, WHY IT MATTERS, HOW, CATCH, TRY IT, NEXT. 후크 직후 초기 팔로우 유도. 마지막 문장은 항상 정확히: "자세한 내용은 제 웹사이트 yoursite.com을 방문하고 팔로우 버튼을 눌러주세요."
  • 사실 + 출처 (URL), 그리고 크리에이터가 확인해야 할 모든 것 (그의 목소리로 전달되는 의견, 도구 이름).
  • Instagram/TikTok용 캡션 (후크 문장, 중요 포인트, CTA, 해시태그) 및 별도의 보다 전문적인 LinkedIn 캡션(해시태그 3개).

"가세요"/승인 또는 수정을 기다리십시오. 수정 사항이 상당한 경우 다시 보여주십시오.

3. 음성 (GPU 작업; 그 동안 GPU에서 다른 작업 금지)

public/episodes/<date>/narration.txt 작성: TTS 세그먼트당 한 문단(문단 사이 빈 줄), 보통 문단당 1~3문장. 발화되는 대로 작성하십시오: 당신의 사이트는 말할 때 철자대로 (예: "my site dot com"), N P X create video, Qwen three T-T-S, pip install Qwen T-T-S, 모호한 경우 숫자는 단어로. 후크 문장에는 !를 사용하십시오(모델이 구두점을 에너지로 읽습니다).

.venv-qwen\Scripts\python scripts\tts_qwen.py public\episodes\<date>\narration.txt
.venv-qwen\Scripts\python scripts\timestamps.py public\episodes\<date>\narration.wav --hint "<기술 용어 5~10개>"
  • 음성 = Qwen3-TTS 1.7B zero-shot, 참조 assets/voice/reference_energy.wav (+ .txt 대본). 유료 음성 서비스를 절대 사용하지 마십시오.
  • 전체 스크립트를 Whisper에 프롬프트로 전달하지 마십시오(루프 발생); 소수의 용어만 --hint로 전달하십시오.
  • 내레이션 길이를 확인하십시오(1.5초 테일 포함 최대 60초)하고 narration.json 텍스트에서 오청 여부를 대략 확인하십시오.
  • tts_qwen.py는 자동으로 음성 레벨을 조정합니다(scripts/audio_level.py: 컴프레서 → -16 LUFS → -1 dBFS 피크). src/components/Sfx.tsx의 사운드 효과는 그 레벨에 맞춰 조정되어 있습니다(음성보다 약 12dB 낮음); 레벨을 높이지 마십시오. 다른 방식으로 내레이션이 만들어진 경우 먼저 scripts/audio_level.py를 실행하십시오.

4. 에피소드 빌드 (데이터만 - 일상 실행에서는 새 컴포넌트 코드 금지)

public/episodes/<date>/plan.json 작성 후 다음 실행:

.venv-qwen\Scripts\python scripts\build_episode.py public\episodes\<date>
npm run lint

plan.json 형태 (전체 예제는 public/episodes/example/plan.json 참조):

{
  "episode": 2, "date": "<date>", "title": "...", "keywords": ["word,", "..."], "tailMs": 1500,
  "sources": [{ "title": "...", "url": "https://..." }],
  "scenes": [{
    "chapter": "HOOK",
    "display": "캡션에 표시될 정확한 문장 (문자 형태: yoursite.com, npx create-video).",
    "set": "stage", "setVariant": "", "zoom": 1.05,
    "actor": { "x": 540, "scale": 0.9, "facing": "right", "enterFrom": "right",
               "beats": [{ "atMs": 0, "pose": "talk" }, { "atWord": "build", "pose": "pointUp", "motion": "talk" }] },
    "items": [{ "kind": "label", "text": "...", "atWord": "camera!", "untilWord": "...", "x": 540, "y": 420 }]
  }]
}
  • 모든 장면의 display를 연결하면 발화된 내레이션과 단어 단위로 일치해야 합니다(문자 형태는 다를 수 있음, 예: "Qwen three T-T-S" 대신 "Qwen3-TTS"). 내레이션 문단을 시작하는 장면은 정확히 TTS 타이밍을 따르며, 다른 장면은 첫 번째 발화 단어에서 시작합니다.
  • 타이밍 키: atWord / crossAtWord / untilWord (대소문자 및 구두점 무시하고 매칭), 반복 단어의 경우 occurrence, 미세 조정을 위한 offsetMs, 또는 일반 atMs.
  • 포즈 (src/rig/poses.ts): idle, talk, explain, shrug, wave, point, pointUp, pointViewer, celebrate, think, search, laptop, holdUp, thumbsUp, headScratch. 동작: talk (제스처가 음성을 따름), wave, shake, celebrate, search, type, still. 손 소품: magnifier, phone, trophy; 들고 있는 노트북의 경우 "laptop": true. facing: "left"는 캐릭터를 좌우 반전시킵니다(왼쪽을 가리킬 때 유용).
  • 세트 (src/sets/Sets.tsx): stage, coderoom, desk(책상은 다리를 가리고 오른쪽에 모니터), sky(setVariant "sunrise" 또는 "timelapse"), chalkboard(보드는 왼쪽), library, blueprint(네이비에 금색 기술 도면 - HOW / "작동 방식" 장면에 사용), plain. 모든 장면에는 떠다니는 골드 더스트가 있습니다("particles": false로 끌 수 있음).
  • 아이템 (src/scene/Items.tsx): icon(카메라/타임라인, crossAtWord), label(금색/밝게), code(날아가는 칩, fromX/fromY), window(터미널 또는 "style": "chalk", kind가 command/code/output인 줄), counter, stamp, steps, waveform, calendar(from→to), banner, confetti, book, follow, end(url + cta, 아르데코 프레임), kinetic(큰 단어가 하나씩 강하게 등장; highlight 단어는 금색; size, stagger 프레임 - 후크 문장에 최적), splitflap(공항 게시판 스타일 통계, 최대 10자, 선택적 label - 후크 숫자에 최적).
  • 카드는 자동으로 프로스트 글라스(글라스모피즘) 스타일이 적용됩니다. 스타일 키트 미리보기: StyleTest 컴포지션.
  • 아이템에는 실제 콘텐츠(실제 코드, 실제 터미널 출력, 실제 숫자)를 채우고, 절대 채우기용 더미 데이터를 사용하지 마십시오.

어렵게 배운 레이아웃 규칙 (1080×1920):

  • 상단 바(EP 레이블 + 챕터)는 대략 y 215에서 끝남: 아이템 상단은 ~230 아래에 유지되어야 함(장면 줌이 아이템을 위로 밀어올린다는 점을 기억).
  • 바닥 y 1440; 캡션 y 1490; 측면 여백 60px 유지.
  • 액터 스케일 0.9 → 머리 상단 ≈ y 570; 0.8 → ≈ 670; 0.7 → ≈ 760. 큰 아이템(window, waveform, end card)은 액터 스케일 0.58~0.8이 필요하거나 액터를 측면(x≈790, 왼쪽을 바라보게)에 배치.
  • 레이블은 기본 크기에서 문자당 약 38px: 짧게 유지하지 않으면 화면 밖으로 나감.
  • 아이템으로 캐릭터의 얼굴을 가리지 마십시오. 레이블은 창문 옆이나 아래에 배치.

5. 미리보기 - 승인을 위한 중단

  1. 스튜디오: npx remotion studio → http://localhost:3000/Episode (이미 실행 중일 수 있음).
  2. 장면당 하나씩 스틸 이미지(스케일 0.4)를 렌더링하고 먼저 직접 확인하십시오: 겹침, 텍스트가 화면 밖으로 나감, 얼굴 가림, 아이템 타이밍. 문제가 있으면 수정하고 다시 빌드한 후 재확인.
  3. 크리에이터에게 스튜디오 링크를 보여주십시오(그리고 발음 등 확인할 수 없는 사항이 있으면 언급). 승인 또는 스크린샷 피드백을 기다리십시오 - 그가 지적한 부분만 정확히 수정.

6. 렌더링

npx remotion render Episode out/<date>/video.mp4 --codec=h264 --crf=18

(src/Root.tsx에서 Episode 컴포지션의 episodeFile 기본 props를 새 폴더로 설정하거나, --props='{"episodeFile":"episodes/<date>/episode.json","episode":null}'을 전달하십시오.) 확인: 최대 60초, 1080×1920, 30fps, 오디오가 있으며 음성이 모든 사운드 효과보다 명확히 큼(음성 ≈ -16 LUFS). out/<date>/caption.txt(IG/TikTok) 및 out/<date>/caption-linkedin.txt 파일을 작성하십시오.

7. Buffer 초안 (크리에이터가 비디오를 첨부)

Buffer의 API는 공개 URL의 비디오만 수락하므로, Asia/Riyadh 시간 19:00에 맞춰 미리 시간이 설정된 초안을 생성하십시오. 크리에이터가 각 초안을 열고 out/<date>/video.mp4를 첨부한 후 예약 버튼을 누릅니다.

  • 조직 <사용자의 Buffer 조직 ID> (Buffer MCP get_account로 확인; 무료 요금제는 10개의 예약 게시물 허용).
  • 채널: Instagram <id>, TikTok <id>, LinkedIn <id> (list_channels로 확인).
  • mode: "customScheduled", dueAt: "<date>T19:00:00+03:00", saveToDraft: true, schedulingType: "automatic"로 create_post를 호출하십시오.
    • Instagram: metadata.instagram = { type: "reel", shouldShareToFeed: true, isAiGenerated: true }.
    • TikTok: metadata.tiktok = { title: "<짧은 후크>", isAiGenerated: true } (음성은 AI 클론이므로 항상 공개).
    • LinkedIn: 전문적인 캡션, 메타데이터 불필요.
  • 19:00가 이미 지난 경우 시간을 추측하지 말고 크리에이터에게 시간을 물어보십시오. 그의 승인 없이 게시하거나 예약하지 마십시오.

8. 마무리

  • topics-log.json에 에피소드를 추가하십시오(날짜, 에피소드, 제목, 주제, "다음" 약속, 출처).
  • 크리에이터에게 다음 정보를 알리십시오: 비디오 경로, 세 개의 Buffer 초안과 그가 비디오를 첨부해야 한다는 점, 그리고 다음 에피소드에서 약속된 주제.

관련 스킬