Install
git clone https://github.com/Boriwatopal/agent-skill-remotion-motion-graphics.git /tmp/rmg && cp -R /tmp/rmg/skills/remotion-motion-graphics ~/.claude/skills/ && rm -rf /tmp/rmg이런 분께 적합합니다
이 Skill은 모션을 코드처럼 관리하고 싶은 분들을 위한 것입니다. 브랜드 운영자, 숏폼 크리에이터 또는 프론트엔드 개발자가 참고 영상 하나와 Logo 하나만으로 kinetic-typography(다이내믹 타이포그래피), Logo 애니메이션 또는 브랜드 홍보 영상을 만들어 MP4로 바로 내보내고자 할 때 유용합니다. 공식 설명에 따르면 같은 코드베이스에서 9:16과 16:9 두 가지 화면 비율을 출력할 수 있다고 합니다.
다음 환경에는 적합하지 않습니다: Node.js 18+(Remotion 4에 필요)가 없거나 PATH에 ffmpeg / ffprobe가 없는 환경에서는 분석·검사 스크립트를 실행할 수 없습니다. 첫 렌더링 시 Remotion이 Chrome을 자동 다운로드하므로 네트워크가 제한된 환경에서는 이 단계에서 막힐 수 있습니다. 공식 자료에서는 다른 런타임이나 플랫폼 지원 여부, 그리고 어떤 언어 인터페이스의 agent를 지원하는지는 언급하지 않으며, 이 부분은 알려지지 않았습니다.
3분 안에 첫 시도 완료하기
권장 기본 경로는 Claude Code 로컬 설치입니다:
- 사전 요건: Node.js 18+,
ffmpeg/ffprobe가 PATH에 있을 것. - 터미널에서 공식 설치 명령을 실행해 Skill을
~/.claude/skills/로 복사합니다:
git clone https://github.com/Boriwatopal/agent-skill-remotion-motion-graphics.git /tmp/rmg && \
cp -R /tmp/rmg/skills/remotion-motion-graphics ~/.claude/skills/ && rm -rf /tmp/rmg
- Claude Code에서 저위험 작업을 트리거합니다: 참고 영상 하나와 Logo(SVG 또는 웹사이트)를 제공하고, 우선 분석만 진행하라고 요청합니다 — agent가 참고 영상의 contact sheets에서 beat map을 생성하고, 브랜드 자료에서 색상·서체·카피를 추출하며, Logo 경로를 매핑해 텍스트와 그래픽이 따로 애니메이션되도록 합니다. 분석 단계에서는 아직 렌더링까지 요청하지 않습니다.
성공 신호: agent가 자료를 읽고 beat map과 브랜드 요소 추출 결과를 제시하면 Skill의 워크플로가 작동한 것입니다. 렌더링 단계에서는 명령 실행, 파일 작성, Chrome 다운로드가 일어난다는 점에 유의하세요. 렌더링에 추가 확인이 필요한지는 자료에서 명시되지 않으므로, 실행 전에 agent와 출력 경로를 분명히 합의하세요. claude.ai / Cowork 사용자에게는 이 경로가 없으며, 공식 제공 방식은 dist/remotion-motion-graphics.skill 파일을 다운로드해 Settings → Capabilities → Skills에서 업로드하는 것으로, 별도 플랫폼의 부수적인 방법입니다.
사용 사례
사례 1: 참고 영상에서 리듬 추출. 경쟁사 영상과 자신의 Logo를 agent에게 보내고 beat map 생성과 색상·서체 추출을 요청한 뒤, Skill의 흐름에 따라 코드화된 모션을 만들어 9:16 MP4로 내보냅니다. 확인 가능한 단계는 자료 읽기와 beat map이며, 렌더링과 완성 영상의 품질은 agent의 실제 실행에 좌우됩니다.
사례 2: Logo 등장 애니메이션. Logo의 SVG를 제공하고 텍스트와 그래픽을 따로 애니메이션하도록 요청해 브랜드 홍보 영상을 한 버전 제작합니다. Skill은 Logo 경로를 매핑해 요소들이 개별적으로 움직이게 합니다. 내보내기 전 공식 검증 절차를 따릅니다: tsc 통과, 0.3 배율 시험 렌더링, contact sheets를 한 장씩 확인, 의심스러운 프레임은 정지 프레임 렌더링으로 검사하고 수정한 뒤, 최종 렌더링하고 완성 영상에서 프레임을 추출해 증빙으로 삼습니다. 확정할 수 있는 최종 신호는 MP4를 받은 것과 프레임 추출 증빙입니다.
사용 경계
렌더링은 tsc와 Remotion 렌더링 명령을 실행하고, 프로젝트 파일을 작성하며, 첫 실행 시 Chrome을 다운로드합니다 — 이는 공식적으로 명시된 동작입니다. Skill의 분석·검사 스크립트는 ffmpeg / ffprobe에 의존합니다. 공식 자료에서 언급되지 않은 사항: 렌더링에 사용자 확인이 필요한지, 구체적으로 어떤 경로에 파일을 쓰는지, 오프라인 실행 가능 여부, 지원 언어 범위(README가 영어라고 해서 영어 자료만 지원한다고 추단해서는 안 됨). Skill이 산출하는 것은 렌더링된 MP4와 코드이며, 사용자의 기존 파일을 직접 수정한다는 내용은 자료에 없습니다. 파일 시스템에 미치는 영향 범위는 agent의 실제 동작을 기준으로 판단하세요. 두 플랫폼의 설치 방식은 서로 다릅니다. Claude Code는 git clone 후 디렉터리 복사, claude.ai / Cowork는 .skill 파일 업로드이며, 서로 혼용할 수 없습니다.