TL;DR

  • Claude Opus 5.5 뮤직비디오의 소스 코드와 더 안정적이고 범용적인 애니메이션 제작 기반을 공개했으며, 저장소의 모든 내용은 모델이 생성한 것임.
  • 제작은 Claude Code에서 두 차례 생성으로 진행됐으며, 첫 생성은 legacy/에, 두 번째 생성은 나머지 저장소에 해당함.
  • 장면 아이디어는 지정하지 않았으며, Clawd 캐릭터 디자인을 사용하고 각 가사에 흥미로운 시각 효과와 전환을 부여하도록 지시함.
  • 영상은 아홉 개 챕터, 공유 코드, p5.js와 p5.brush 기반 프레임 캔버스, 렌더링 스크립트 등으로 구성됨.
  • 렌더링에는 Node.js, Google Chrome, ffmpeg가 필요하며, 프레임을 만든 뒤 노래와 결합해 MP4로 인코딩함.

크레딧

제작 방식

  • 영상 소스 코드는 Claude Code에서 두 차례 생성함.
  • 첫 번째 생성: legacy/ 디렉터리, Claude Opus 5.5 (Medium)
  • 두 번째 생성: 나머지 항목, Claude Opus 5.5
  • 저장소의 모든 내용은 모델이 생성함. 장면 아이디어는 지정하지 않았으며, Clawd 캐릭터 디자인을 사용하고 각 가사에 흥미로운 시각 효과와 전환을 부여하라는 지시만 제공함.
  • ANIMATION_GUIDE.md는 Opus가 병렬로 실행한 하위 에이전트의 작업 지침으로 작성함.
  • STORYBOARD.md는 첫 번째 생성 뒤 Opus가 작성했으며, p5 브러시 스트로크를 사용하고 각 장면을 시각적으로 흥미롭게 만들며 모든 장면이 다음 장면으로 전환되도록 지시함.

저장소 구성

  • src/ch/: 영상의 아홉 챕터로, 챕터마다 파일 하나씩 구성됨.
  • src/: Clawd, 게스트 캐릭터, 소품, 가사, 타임라인을 포함하는 공통 코드임.
  • studio.html: p5.js와 p5.brush를 사용해 모든 프레임을 그리는 페이지임.
  • render.mjs: 헤드리스 Chrome에서 프레임을 렌더링하고 ffmpeg로 MP4를 인코딩함.
  • STORYBOARD.md: 장면별 촬영 계획임.
  • ANIMATION_GUIDE.md: 하위 에이전트를 위한 스타일 및 코드 지침임.
  • legacy/: 첫 번째 생성 결과임.

렌더링

  • Node.js, Google Chrome, ffmpeg가 필요함. 노래 파일은 assets/pdoom.mp3에 포함됨.
  • npm install로 패키지를 설치하고, node render.mjs --frames=0:156.6 --workers=4를 실행하면 모든 프레임을 out/frames에 그림. 이 작업은 중단 후 재개할 수 있음.
  • node render.mjs --encode --out=out/pdoom.mp4를 실행하면 프레임과 노래를 결합해 MP4로 인코딩함.
  • Chrome이 기본 Windows 경로에 설치되지 않은 경우 --chrome=<Chrome 경로>를 지정함.