I made a open source tool to create saas launch videos like with with Claude
Claude로 SaaS 출시 영상을 만드는 오픈소스 도구를 만들었습니다
Kinetograph는 Remotion의 TypeScript 작업 방식을 유지하면서 Chrome 없이 Node.js와 Rust GPU 합성기로 영상을 렌더링하는 엔진입니다. Apple M4에서 1,184프레임을 26초에 처리했다고 공개했지만, 현재 베타이며 Remotion과의 직접 성능 비교 수치는 제시하지 않았습니다.
- 주제
에디터 노트
공개된 수치는 Kinetograph의 렌더링 시간을 보여주지만 Remotion과 같은 프로젝트를 같은 장비와 설정으로 비교한 결과는 아닙니다. 댓글 작성자는 Remotion보다 빠르다고 주장하지만, 본문에 비교 기준이나 상대 엔진의 측정값은 없습니다. 따라서 1,184프레임을 26초에 처리했다는 수치와 Remotion보다 빠르다는 주장은 구분해서 읽어야 합니다. 반면 Chrome 없이 기존 Remotion 코드의 실행 경로를 Node.js와 네이티브 합성기로 바꾸려는 설계와 구성 요소는 구체적으로 공개했습니다. 0.1.0 베타라 API 변경과 미지원 기능이 남아 있고, 대기업은 별도 상용 라이선스가 필요합니다. Reddit의 반응은 영상 스타일과 프로젝트에 대한 호감이 대부분이며 성능을 검증하는 비교 사례는 제시하지 않습니다.
AI 요약
Kinetograph는 Remotion API와 CSS, SVG, Canvas 2D, WebGL 셰이더, Web Audio를 사용하는 TypeScript 프로젝트를 Node.js에서 실행하고, Rust 기반 GPU 합성기로 각 프레임을 그리는 영상 엔진입니다. 렌더링 과정에 Chrome을 쓰지 않으며, 기존 Remotion 프로젝트는 import 경로를 Kinetograph 구현으로 연결해 사용할 수 있습니다. 에이전트가 영상을 만들고 렌더링하도록 CLI와 MCP 서버, 관련 기술 문서와 skill도 제공합니다.
렌더링 구조와 호환성
TypeScript 프로젝트를 esbuild로 묶은 뒤 프레임마다 React 트리를 실행합니다. 프레임에 맞춰 Date, Math.random, 타이머와 requestAnimationFrame 동작을 고정하는 결정성 shim을 적용합니다. DOM, Canvas 2D, WebGL API 호출은 기록해 장면 데이터로 변환하고, Rust 네이티브 애드온이 이를 합성합니다. DOM 엔진은 blitz-dom, Stylo, taffy, Parley, usvg를 사용하며, 합성기에는 wgpu, Skia, WGSL 효과, naga를 통한 GLSL 처리, glTF와 PBR 기반 3D, Lottie, 모션 블러와 레이어 캐시가 포함됩니다. FFmpeg가 영상 디코딩과 인코딩을 담당합니다. 브라우저는 렌더링에 관여하지 않고 테스트에서 결과 비교용으로만 사용합니다.
Node.js 22 이상과 wgpu가 지원하는 GPU가 필요합니다. macOS에서는 Metal을 사용할 수 있으며 디스플레이 없이 렌더링할 수 있습니다. FFmpeg 개발 라이브러리도 빌드에 필요합니다. 예시 명령에는 특정 프레임 이미지 저장, 프레임 스트립 생성, MP4 렌더링, JSON 검사 기능이 포함됩니다. 각 CLI 명령은 JSON 출력을 지원하고 MCP 서버에서도 같은 명령을 제공한다고 설명합니다.
공개된 성능과 현재 상태
Apple M4에서 concurrency 4로 세 번 실행한 중앙값 기준으로, 1,184프레임의 1080p 영상과 오디오를 26초에 렌더링했습니다. 다른 예시로 928프레임 영상은 13초, 180프레임 3D 장면은 2.3초, 180프레임 영상 오버레이는 1.9초가 걸렸습니다. Remotion용으로 작성한 세 편의 세로형 영상도 Kinetograph에서 그대로 렌더링했다고 밝힙니다. 988프레임 영상은 23초, 879프레임 영상은 32초, 850프레임 영상은 75초가 걸렸습니다.
버전은 0.1.0 베타입니다. 핵심 렌더러와 효과, 작성 도구, 스튜디오, 네이티브 DOM 엔진 기반 Remotion 호환 기능, 자체 3D 레이어를 구현했지만 일부 기능은 빠져 있고 API도 버전 사이에 바뀔 수 있습니다. 알려진 문제와 호환성 범위는 프로젝트 문서에 따로 정리했습니다. 라이선스는 PolyForm Small Business License 1.0.0으로, 개인과 비영리단체, 인원 100명 미만이면서 2019년 매출 100만 달러 미만인 회사는 무료로 사용할 수 있습니다. 그보다 큰 회사는 상용 라이선스가 필요합니다.
Reddit 반응
- @Solid-Raspberry9133 - 브라우저 기반 영상 편집기는 프레임마다 headless Chrome을 사용해 불필요한 부담과 속도 저하를 겪는다고 설명합니다. AI 에이전트가 그런 의존성 없이 영상을 만들도록 도구를 만들었으며, Remotion과 같은 React/TSX 작업 방식으로 Node.js에서 실행하고 Rust GPU 합성기가 렌더링한다고 말합니다. M4에서 1,184프레임은 26초, 988프레임은 23초라고 소개하고 Claude Code용 skill 설치도 안내합니다.
- @BeltRevolutionary101 - 이 영상이 한 시간짜리 YouTube 영상이라면 그대로 보겠다고 합니다.
- @Ok_Tone_6843 - 최근 AI 그래픽을 사용한 YouTube 채널이 많이 생겼다며 "what if"를 검색해 보라고 합니다.
- @Solid-Raspberry9133 - 고맙다고 답합니다.
- @sarcAnuj - 멋지다며 계속 작업해 달라고 응원합니다.
- @Solid-Raspberry9133 - 고맙다고 답합니다.
- @Murky-Text-290 - 다큐멘터리 영상에 잘 어울리는 스타일이라고 말합니다.
- @rabinapps - 자신이 만든 https://kinhin.dev와 비슷하다고 말합니다.
- @Solid-Raspberry9133 - Kinetograph는 Chromium 의존성을 없애고 기존 Remotion 프로젝트를 더 빠르게 실행하도록 다시 만든 도구라고 답합니다.
- @angelarose210 - Remotion으로 영상 편집을 많이 해봤으며 사용해 보고 싶다고 합니다.
- @Solid-Raspberry9133 - 기존 Remotion 프로젝트를 실행하고 더 빠르게 렌더링할 수 있으며, 지원하지 않는 코드와 Three.js 효과를 옮기는 skill도 포함한다고 답합니다.
- @ialphadev - 대단하다고 반응합니다.
원문: GitHub / 번역·요약: Trawling