Remotion 비디오 슈퍼파워

Remotion 비디오 슈퍼파워은(는) 무엇을 하나요?

이 스킬을 사용하여 비디오 제작을 명세 → 계획 → 실행 → 검증의 규율 있는 워크플로우로 진행하세요. 간단하지 않은 비디오의 경우 애니메이션에 바로 뛰어들지 마세요.

워크플로우

1. 구현 전에 비디오 명세를 작성하거나 업데이트합니다.

   • references/writing-video-specs.md를 읽으세요.
   • 명세는 프로젝트에서 실용적일 때 docs/video/specs/YYYY-MM-DD-프로젝트명.md 경로에 저장하세요.
   • 목표, 비목표, 시청자, 시각적 방향, 자산, 음성 해설 요구사항, 제약 조건, 승인 기준을 포함하세요.

2. 생산 계획을 작성하거나 업데이트합니다.

   • references/writing-video-plans.md를 읽으세요.
   • 계획은 프로젝트에서 실용적일 때 docs/video/plans/YYYY-MM-DD-프로젝트명.md 경로에 저장하세요.
   • 체크박스 작업을 사용하세요. 각 작업은 파일, 단계, 검증 및 중지 조건을 명시해야 합니다.

3. 애니메이션 구현 전에 자산 소싱을 완료합니다.

   • references/asset-sourcing.md를 읽으세요.
   • 제품 자산, 브랜드 자산, UI 참조, 스크린샷, 3D 모델, 지도/지리공간 리소스, 서비스 토큰/환경 변수명, 오디오 참조, 라이선스, 저작자 표시, 로컬 경로, 폴백을 수집하고 기록하세요.
   • 필요한 자산이 로컬에서 사용 가능하거나 폴백이 명시적으로 기록될 때까지 장면 애니메이션을 시작하지 마세요.

4. 계획을 작업별로 실행합니다.

   • Remotion 코드를 편집하기 전에 references/remotion-scene-execution.md를 읽으세요.
   • 비디오에 웹 UI, 제품 인터페이스, 대시보드, 프론트엔드 스타일 모션, Three.js, Anime.js 또는 복잡한 애니메이션 안무가 포함된 경우 references/frontend-animation-system.md를 읽으세요.
   • 비디오에 지도, 경로, 도시, 지형, 건물, 랜드마크, 디지털 트윈, 장비, 우주선, 실제 3D 객체 또는 Mapbox/Cesium ion과 같은 토큰 기반 서비스가 필요한 경우 references/3d-map-and-model-resources.md를 읽으세요.
   • 시크(Seek)에 안전한 애니메이션을 위해 useCurrentFrame()과 interpolate()를 사용하세요.
   • CSS 트랜지션과 비결정적 런타임 애니메이션은 피하세요.
   • 장면 텍스트는 짧게 유지하고 설명은 음성 해설로 옮기세요.
   • 최종 렌더링 전에 장면 시작, 절정, 전환 시점에서 스틸을 렌더링하세요.

5. 음성 해설을 일급 타임라인 소스로 처리합니다.

   • ElevenLabs v3 스크립트를 작성하기 전에 references/elevenlabs-v3-scripting.md를 읽으세요.
   • 오디오를 가져오거나 동기화하거나 먹싱하기 전에 references/audio-sync-and-muxing.md를 읽으세요.
   • 이 스킬의 scripts/inspect-audio.sh를 사용하여 실제 오디오 길이를 확인하세요.
   • 오디오를 자르는 것보다 최종 음성 해설에 맞게 장면 타이밍을 늘리는 것을 선호하세요.

6. 최종 QA를 수행한 후 전달합니다.

   • references/qa-checkpoints.md를 읽으세요.
   • 사용 가능한 경우 프로젝트 린트/타입체크를 실행하세요.
   • 이 스킬의 scripts/render-checkpoints.sh 또는 명시적인 npx remotion still 명령을 사용하여 체크포인트 스틸을 렌더링하세요.
   • 최종 MP4를 렌더링하세요.
   • 오디오 신뢰성이 중요한 경우 이 스킬의 scripts/mux-voiceover.sh를 사용하여 음성 해설을 먹싱하세요.
   • ffprobe/ffmpeg를 사용하여 지속 시간, 오디오 스트림 및 볼륨을 확인하세요.

슈퍼파워 규칙

• 명세를 진리의 원천으로 간주하세요. 구현이 명세와 충돌하는 경우 명세를 업데이트하거나 중단하고 질문하세요.
• 계획을 실행 가능한 것으로 간주하세요. 검증이 통과될 때까지 작업을 완료로 표시하지 마세요.
• 최종 비디오 품질에 영향을 미치는 검증 실패 시 중단하세요: 깨진 린트, 읽을 수 없는 텍스트, 겹치는 장면, 누락된 오디오, 일치하지 않는 지속 시간 또는 빈 키 비주얼.
• 수정 시 영향을 받는 장면과 프레임 범위를 먼저 식별하고, 전후 스틸을 렌더링한 후 필요한 코드만 패치하세요.
• 사용자가 제공한 미디어는 보존하세요. 의도적으로 복사하거나 참조하고, 소스 다운로드를 덮어쓰지 마세요.
• 사용자가 명시적으로 화면 둘러보기를 원하지 않는 한 프로모션의 주요 시각 언어로 스크린샷을 사용하지 마세요. 제품 아이디어를 모션 메타포로 변환하고 스크린샷은 증거, 전환 또는 간단한 제품 증명으로 사용하세요.

참조 라우팅

• 비디오 설계가 필요함: writing-video-specs.md를 읽으세요.
• 구현 계획이 필요함: writing-video-plans.md를 읽으세요.
• 제품 자산, 모델 자산, 스크린샷, 토큰, 라이선스 또는 참조를 수집해야 함: asset-sourcing.md를 읽으세요.
• Remotion 장면 또는 전환을 코딩해야 함: remotion-scene-execution.md를 읽으세요.
• 풍부한 프론트엔드 스타일 애니메이션을 설계해야 함: frontend-animation-system.md를 읽으세요.
• 지도, 3D 도시/지형, 경로 또는 외부 3D 모델이 필요함: 3d-map-and-model-resources.md를 읽으세요.
• 음성 해설 스크립트, 특히 ElevenLabs v3가 필요함: elevenlabs-v3-scripting.md를 읽으세요.
• MP3/WAV 오디오 정렬 또는 "소리 없음" 문제 해결이 필요함: audio-sync-and-muxing.md를 읽으세요.
• 최종 품질 검사가 필요함: qa-checkpoints.md를 읽으세요.

프로젝트 디렉터리에서 번들 스크립트를 실행할 때, 동등한 프로젝트 로컬 스크립트가 없는 한 이 스킬의 scripts/ 디렉터리에 대한 절대 경로를 사용하세요.