Remotion은 React 코드로 영상을 만드는 프레임워크다. 프로젝트 홍보 영상 초안을 5분 만에 뚝딱 만들어냈다. 어디까지 딸깍으로 해결되는 건지 직접 확인해봤다.
원본 내용
Agent Skills | Remotion | Make videos programmatically
참고 동영상
오늘 위의 내용에 대한 영상 + 회사에서 써 보면 좋다라는 슬랙 메시지를 보고 한번 써봤다.
터미널에서 아래 명령어를 실행시켜서 설치를 하고, Claude code에 맞게 설치를 했다.
간단히 어떻게 동작하나 이해하기 위해서, 설치를 하고 나서 Gemini 에게 다음과 같이 요청을 했다.
이렇게 해서 추출한 프롬프트를 기존에 개발한 주식 프로젝트 디렉토리에서 Claude Code를 실행한 다음 동일하게 프롬프트를 넣고 실행했다.
쉽게 쉽게 가자. 목적은 이를 해봤다가 아니라 이렇게 활용할 수 있네~ 를 이해하는 것이다.
/remotion-best-practices 이 제품을 위한 홍보 영상을 만들어줘.
밝은 테마의 현대적인 SaaS 스타일을 사용하고, 필요한 아이콘은 Lucid icons를 사용해줘.
너무 기술적인 느낌보다는 현대적이고 깔끔한 미학을 담아줘. 페인 포인트와 이를 해결하는 기능들에 대한 이야기를 들려줘야 해
한 5분 정도 설치 및 수행하더니 다음과 같은 결과물이 나왔다.
만들어주는 과정을 살펴보니,
텍스트 또는 소스를 기반으로 React 코드로 영상을 만드는 프레임워크로, 쉽게 애니메이션 영상을 만들어준다.
설명에 있었지만, 읽어보기보다는 눈으로 확인하는 것을 즐기는 편이다.
이 정도면 만들어진 시스템에 대한 홍보 영상 초안 애니메이션을 만들고, Flow, Veo3 같은 것과 연관시켜서 더 이쁘게 만들 수 있으려나?
이후에 블로그 글을 영상으로 - Remotion으로 유튜브 자동화 파이프라인 만들기에서 이 경험을 확장시켰고, 일관성 있는 구글 슬라이드 만들기에서 다뤘던 자동화 사고방식이 여기서도 적용됐다.
도대체...어디까지 좋아지려나...어디까지 딸깍 하게 해주려나...기대가 되면서 걱정이 된다.
불러오는 중...