cth9191/animate

Animate – Claude Code를 위한 절차적 영상 제작

개요 – 코드를 통해 완전히 스타일리시한 단편 애니메이션 영상을 생성할 수 있는 Claude Code 스킬입니다. 채팅과 같은 프롬프트로 상호작용하고 몇 가지 질문에 답하면, 시스템이 결정론적인 프레임 단위 애니메이션을 구축하고 헤드리스 브라우저로 렌더링하여 MP4를 출력합니다.

작동 방식 – 워크플로우는 5단계로 나뉩니다:

1. Intake – 피사체, 원하는 형식, 음성, 스타일(내장된 룩 또는 제공하는 사용자 지정 참조)을 시스템에 전달합니다.
2. Story check – 비트 테이블이 생성되며 승인하거나 편집할 수 있습니다.
3. Look check – 선택한 스타일에 따라 전체 크기의 키 프레임이 생성되어 확인을 거칩니다.
4. Storyboard – 모든 비트가 소리와 전환 효과가 포함된 키 프레임이 되며, 각 패널을 승인할 수 있습니다.
5. Build & delivery – 승인된 패널이 애니메이션화되고 MP4로 렌더링됩니다. 품질 검사(비트 컷, 라우드니스, 히어로 앵커링 등) 결과가 표시되어 최종 조정이 가능합니다.

내장 스타일 – 리포지토리에는 8개의 플러그인 스타일 폴더가 포함되어 있으며, 각각 드로잉 키트를 제공합니다:

• cut paper, crosshatch, riso, sketchbook, math (Manim 스타일), pixel, isometric 및 참조 미디어에서 파생된 custom look용 슬롯.

사용자 지정 스타일 생성 – 영상, 스틸 이미지 또는 웹 페이지를 제공하면 도구가 팔레트, 선 굵기, 질감, 리듬을 분석하고 승인을 위한 1~2개의 일치 프레임을 생성한 후, 재사용을 위해 styles/<name>/에 새 스타일을 저장합니다.

핵심 구성 요소

• Story grammar (grammar/)：구조, 색상 의미론, 페이스를 결정하는 8개의 단편 템플릿(역사, 미션 등).
• Kit (kit/)：시드된 무작위성, 카메라 도우미, 스타일 훅을 통해 그리는 렌더러, 스토리보드 엔진, 신디사이저, 휴대폰 재생용 라우드니스 처리.
• Tools (tools/)：
  • build.mjs – 작품, 키트, 스타일로부터 독립형 index.html을 조립합니다.
  • export.mjs – 프레임을 WAV + 스템으로 변환한 후 ffmpeg를 통해 MP4로 변환합니다.
  • voice.mjs – 스크립트 생성, 녹음(ElevenLabs 또는 로컬 마이크), faster-whisper를 사용한 단어와 타임스탬프 동기화.
  • beats.mjs, compare.mjs, measure/refs.mjs 등, 오디오 비트 매핑, 참조 비교 및 품질 검사용.
• Craft rules (craft.md) – 시스템 구축 중 수집된 실용적인 팁.
• 보이스오버 및 음악 – 자동 스크립트 작성, 선택적 ElevenLabs TTS, 로컬 녹음 및 비트 동기화 스코어링(자체 트랙 제공 가능).
• 제품 통합 – 웹사이트 스크린샷이나 로고를 애니메이션에 삽입할 수 있습니다.
• 멀티 포맷 출력 – 9:16, 1:1, 4:5, 16:9가 자동으로 생성됩니다.
• 병렬 빌드 – 대규모 작품은 장면 파일로 분할되어 개별 에이전트에 의해 처리된 후 결합됩니다.

향후 계획 – 레이마칭, 서브프레임 블러, 블룸을 갖춘 WebGL 기반 모션 디자인 스타일이 계획되어 있습니다. 기존 내보내기 파이프라인은 이미 GPU 렌더링을 지원합니다.

설치 – Claude Code, Node 18+, Chromium이 포함된 Playwright, ffmpeg가 필요합니다. Playwright를 설치(npm i -g playwright && npx playwright install chromium)한 후 Claude의 플러그인 관리자를 통해 스킬을 추가하거나 폴더를 ~/.claude/skills/animate/에 복사하십시오.

일반적인 사용법 – Claude 채팅에서 다음과 같은 명령을 입력할 수 있습니다:

/animate a 45-second history of the bicycle, cut paper
/animate how a hash map works, in the math style
/animate a short about our API in the style of these screenshots: ./refs/

생성된 작품은 pieces/<name>/ 아래에 나타납니다. 저수준 도구를 수동으로 실행할 수도 있습니다.

라이선스 – MIT.

---

Animate는 생성형 AI(스크립트 작성, 음성 합성, 비트 감지)와 절차적 그래픽의 교차점에 위치한 본격적인 오픈 소스 프로젝트로, 코드를 통해 스타일리시한 설명 영상을 제작하기 위한 턴키 솔루션을 제공합니다.