에이전트를 위한 프로그래매틱 비디오 엔진: Remotion의 API, CSS, SVG, Canvas 2D, WebGL 셰이더 및 Web Audio를 사용하여 TypeScript로 비디오를 작성하고, Node에서 코드를 실행하며, Rust GPU 컴포지터가 프레임별로 렌더링합니다. 전체 렌더링 과정에서 Chrome을 사용하지 않으며, 기존 Remotion 및 HyperFrames 프로젝트를 그대로 렌더링할 수 있습니다.
별 개수 337 (+37 / 24시간)
이유
- 저자는 README 상단의 짧은 영상이 1184 프레임, 1080fps, 오디오 포함 상태로 노트북에서 26초 만에 렌더링된다고 언급했습니다. 예제 소요 시간은 모두 Apple M4에서 --concurrency 4 설정으로 세 번 실행한 후 중간값을 취한 것입니다.
- kinetograph studio를 열면 로컬 편집기가 실행됩니다. 미리보기에서 레이어를 클릭하거나 드래그하여 선택한 후, 변경 사항을 코딩 에이전트에 지시하면 됩니다. 에이전트는 선택 영역, 소스 코드 위치 및 스크린샷을 수신합니다(ACP를 통해 Claude Code, Codex, Gemini를 사전 설정하며, 저자는 현재까지 Claude Code만 테스트했습니다). 파일 수정 전에 사용자에게 확인을 요청합니다.
- 모든 명령어는 --json 출력을 지원하며, npx kinetograph mcp는 동일한 명령어 세트를 MCP 서버로 제공하고 에이전트 스킬을 포함합니다. 0.2.5에서는 모션 트래킹, 캔버스 내 비디오 프레임, Web Animations API 등이 추가되었습니다.
사용법
- HTML 페이지를 직접 렌더링: npx kinetograph render index.html -o out.mp4; GSAP 타임라인을 window.__timelines에 등록하면 프레임별로 위치가 지정됩니다.
- TSX 프로젝트에는 Node 22 이상이 필요합니다: npm ci, npm run build 실행 후 npx kinetograph render / still / inspect를 사용합니다. 소스 코드에서 빌드하려면 Rust stable 및 FFmpeg 개발 라이브러리가 필요합니다.
리스크
- 베타 버전 0.2.5으로, API가 변경될 수 있으며 일부 기능이 누락되어 있습니다. 알려진 문제는 프로젝트 웹사이트에 나열되어 있습니다.
- 라이선스는 PolyForm Small Business 1.0.0입니다. 개인, 비영리 단체 및 100명 미만이고 매출이 100만 달러 미만인 기업은 무료로 사용할 수 있으며, 더 큰 기업은 상업용 라이선스를 구매해야 합니다. 저장소는 10월 23일에 생성되었습니다.