안녕하세요, 시그마인 팀입니다.
영상 하나 만들려고 편집 프로그램을 켜는 순간, 이미 지치신 적 있으실 겁니다. 자막 위치 맞추고, 전환 효과 고르고, 음악 박자에 컷을 붙이고. 30초짜리 릴스 한 편에 두세 시간이 사라집니다.
그런데 요즘은 영상을 코드로 만드는 방식이 빠르게 자리를 잡고 있습니다. 타임라인을 손으로 끌지 않고, 글로 적어서 영상을 뽑아내는 겁니다. 그리고 2026년 9월에 이 방식의 문턱을 크게 낮춘 변화가 하나 있었습니다.
이번 글에서는 그 변화를 실제로 써 보고 릴스 한 편을 끝까지 만들어 본 기록을 남깁니다. 잘 된 부분만이 아니라 중간에 막혔던 지점도 그대로 적었습니다.
영상을 코드로 만든다는 게 무슨 뜻인가
Remotion 이라는 도구가 있습니다. 웹사이트를 만드는 React 문법으로 영상을 만드는 도구입니다.
원리는 생각보다 단순합니다. 영상은 결국 초당 30장씩 지나가는 그림입니다. Remotion 은 지금이 몇 번째 장면인지 알려 주고, 그 숫자에 따라 화면을 그리게 합니다. 「10번째 장면에서는 글자가 안 보이고, 40번째 장면에서는 다 보이게」 라고 적으면 글자가 서서히 나타나는 영상이 됩니다.
손으로 끌어서 맞추던 타임라인이, 읽고 고칠 수 있는 글이 됩니다. 어제 만든 영상의 자막 위치를 오늘 바꾸려면 파일에서 숫자 하나만 고치면 됩니다.
같은 틀로 100편을 뽑는 것도 어렵지 않습니다. 브랜드마다 색과 문구만 바꿔 넣으면 되니까요. 시그마인이 고객사 영상을 만들 때 쓰는 방식도 같습니다.
문제는 진입 장벽이었습니다. React 를 알아야 하고, 어떤 함수가 어떤 상황에 맞는지 문서를 한참 뒤져야 했습니다.
공식 스킬 12종이 나오면서 달라진 것
Remotion 팀이 AI 코딩 도구가 읽는 사용 설명서를 공식으로 내놨습니다. 클로드 코드, 커서, 코덱스 같은 도구가 이 설명서를 읽고 대신 코드를 씁니다.
설치는 터미널에 이 한 줄입니다.
npx skills add remotion-dev/skills
한 번 치면 12종이 전부 들어오고, 세 도구가 같은 파일을 같이 읽습니다. 도구마다 따로 설정할 일이 없습니다.
| 스킬 | 무엇을 아는가 | 언제 쓰는가 |
|---|---|---|
| markup | 애니메이션·타이포·타이밍 규칙 | 화면을 실제로 그릴 때. 가장 많이 쓰인다 |
| best-practices | 흔히 틀리는 지점과 권장 패턴 | 처음 구조를 잡을 때 |
| docs | API 문서 조회 | 함수 이름이 기억나지 않을 때 |
| upgrade | 버전 올릴 때 바뀐 점 | 기존 프로젝트를 최신으로 옮길 때 |
| create | 새 프로젝트와 장면 만들기 | 맨 처음 시작할 때 |
| captions | 자막 넣기와 싱크 맞추기 | 말소리에 자막을 붙일 때 |
| multimedia | 영상·음성 파일 다루기 | 기존 소재를 섞어 쓸 때 |
| render | 영상 파일로 뽑아내기 | 완성본을 내보낼 때 |
| studio | 미리보기 화면 활용 | 결과를 눈으로 확인하며 고칠 때 |
| interactivity | 눌러서 반응하는 요소 | 영상이 아닌 화면을 만들 때 |
| maps | 지도 표현 | 이동 경로를 보여 줄 때 |
| saas | 서비스에 영상 기능 붙이기 | 제품 안에 넣을 때 |
12종을 다 알아야 할 것 같지만 그렇지 않았습니다. 저희는 markup, best-practices, docs, upgrade 네 개만 실제로 썼고 릴스 한 편을 끝까지 만드는 데 모자라지 않았습니다. 만들 것이 정해지면 필요한 스킬도 저절로 정해집니다.
실제로 만들어 본 릴스
말로만 하면 믿기 어려우니 한 편을 끝까지 만들었습니다. 인스타그램 릴스 규격인 1080×1920 세로 영상입니다.
편집 프로그램을 한 번도 켜지 않고 넣은 것들입니다.
- 음악에 맞춰 뛰는 막대 — 음악 파일의 주파수를 읽어 26개 막대 높이에 그대로 꽂았습니다. 낮은 음 몇 칸의 평균이 킥 드럼이라, 그 값으로 도형 크기를 같이 키우면 박자가 눈에 보입니다.
- 카드가 3D 로 돌아 들어오는 장면 — 화면에 원근을 걸고 축을 돌렸습니다. 종이가 눕다가 일어서듯 들어옵니다.
- 손으로 그은 듯한 밑줄 — 선을 한 번에 그리지 않고 길이를 조금씩 늘려 그었습니다.
- 글자 크기 자동 맞춤 — 상자 폭을 재서 그 안에 딱 들어가는 글자 크기를 계산했습니다.
결과물은 여기에서 보실 수 있습니다.
막혔던 두 지점
여기가 이 글에서 가장 값이 있는 부분이라고 생각합니다. 공식 문서만 읽어서는 알기 어렵고, 실제로 돌려 본 사람만 겪는 것들입니다.
막대 개수를 원하는 대로 넣으면 렌더가 죽습니다
화면에 막대 26개를 세우려고 주파수를 52칸으로 요청했습니다. 그러자 첫 장면을 그리다가 곧바로 멈췄습니다. 오류 메시지가 친절하지 않아서 한참 헤맸습니다.
원인은 이랬습니다. 주파수를 나눌 칸 수는 64, 128 처럼 2를 계속 곱한 숫자여야 합니다. 소리를 주파수로 바꾸는 계산 방식이 원래 그렇게 생겼습니다. 52는 거기에 해당하지 않습니다.
해결은 간단했습니다. 주파수는 64칸으로 받고, 화면에 세울 막대 개수는 거기서 앞쪽 26칸만 잘라 썼습니다. 받는 개수와 보여 주는 개수를 따로 두는 겁니다.
명령어 글자가 상자 밖으로 잘렸습니다
설치 명령을 화면에 띄웠는데 글자가 상자를 넘어가 잘렸습니다. 글자 크기를 눈대중으로 줄이면 다른 화면에서 또 어긋납니다.
스킬이 알려 준 방법은 폭을 미리 재는 것이었습니다. 상자 폭이 808픽셀이면, 그 안에 들어가는 최대 글자 크기를 계산해서 그 값을 쓰면 됩니다. 문구가 길어지든 짧아지든 알아서 맞습니다.
버전을 올릴 때 알아 둘 것
스킬을 깔 때 한 가지 성질을 알아 두시면 나중에 헷갈리지 않습니다. 스킬 파일 안에 Remotion 버전이 적혀 있습니다. 설치한 시점의 버전을 기준으로 설명이 쓰여 있다는 뜻입니다.
그래서 Remotion 을 최신으로 올리면 스킬도 같이 다시 받아야 합니다. 옛 스킬을 그대로 두면 지금은 쓰지 않는 방식으로 코드를 쓰게 됩니다. 어디가 틀렸는지 눈에 안 보이니 더 까다롭습니다.
저희도 버전을 올리면서 한 곳에 걸렸습니다. 선 위의 좌표를 구하는 함수가 있는데, 예전에는 항상 좌표를 돌려줬지만 새 버전에서는 값이 없을 수도 있는 형태로 바뀌었습니다. 코드는 그대로 돌아가는 것처럼 보이지만, 조건이 맞으면 그 자리에서 멈춥니다.
버전을 올릴 때는 바뀐 점을 읽어 주는 upgrade 스킬을 먼저 돌리는 편이 낫습니다. 어디를 손봐야 하는지 짚어 주기 때문에, 돌려 보고 나서 고치는 것보다 빠릅니다.
실제로 저희는 옛 버전과 새 버전에서 같은 경로를 여러 개 뽑아 결과를 나란히 대조했습니다. 값이 전부 같다는 것을 확인하고 나서야 넘어갔습니다. 영상은 한 장면만 어긋나도 전체를 다시 뽑아야 하니, 이 확인이 시간을 아껴 줍니다.
이 방식이 맞는 경우와 아닌 경우
솔직하게 적겠습니다. 모든 영상에 맞는 방식이 아닙니다.
| 상황 | 코드로 만들기 | 편집 프로그램 |
|---|---|---|
| 같은 틀로 여러 편 | 훨씬 빠르다 | 편수만큼 시간이 든다 |
| 숫자·표·그래프가 나오는 영상 | 데이터만 바꾸면 끝난다 | 매번 다시 그려야 한다 |
| 한 편만 감각적으로 | 오히려 느리다 | 손이 빠르다 |
| 실사 촬영분 편집 | 맞지 않는다 | 이쪽이 맞다 |
정리하면 같은 형식을 반복해서 뽑아야 할 때 값이 가장 큽니다. 브랜드 채널을 매일 채워야 하는 상황이 정확히 여기에 해당합니다.
그리고 한 가지 더 남습니다. 스킬이 코드를 대신 써 준다고 해도, 무엇을 만들지는 사람이 정해야 합니다. 어떤 문구로 시작해서 몇 초에 무엇을 보여 줄지, 그 판단이 결과를 갈랐습니다.
직접 해 보실 분을 위해
순서는 이렇습니다.
- 터미널에 npx skills add remotion-dev/skills 를 칩니다.
- 클로드 코드나 커서를 열고 만들고 싶은 영상을 말로 설명합니다.
- 미리보기 화면에서 확인하면서 고칩니다.
- 완성되면 영상 파일로 뽑습니다.
공식 문서는 remotion.dev/docs/ai/skills 에 있습니다.
다만 여기까지 읽고 「재미있지만 우리가 직접 할 일은 아니다」 라고 느끼셨다면, 그 판단도 맞습니다. 채널을 채우는 일은 도구를 익히는 것과 다른 문제입니다. 매일 올릴 소재를 정하고, 브랜드 톤을 지키고, 반응을 보고 다음 편을 고치는 일이 계속 남습니다.
시그마인은 그 과정을 대신 돌립니다. 소재 기획부터 영상 제작, 발행까지 이어서 처리하고, 위에서 설명한 방식이 제품 안에서 실제로 돌아가고 있습니다.
#영상편집자동화 #AI영상제작 #Remotion #클로드코드 #릴스제작 #콘텐츠자동화 #AI도구추천 #SNS마케팅 #시그마인 #영상마케팅