소개
구글 플로우(Veo)로 생성한 숏폼 영상 클립들을 하네스(Harness) 저장소의 Remotion 코드를 활용해 하나의 최종 영상(mp4)으로 자동 합성하고자 했습니다. AI 영상의 고질적인 문제인 '긴 씬에서의 뭉개짐'을 피하기 위해 1씬을 2~3초 단위의 짧은 컷(Short-cut)으로 쪼개어 생성한 후, 이를 매끄럽게 하나로 이어 붙여 고품질의 쇼츠를 완성하는 것이 목표였 습니다.
진행 방법
어떤 도구를 사용했고, 어떻게 활용하셨나요?
영상 생성: 구글 플로우(Veo)를 활용해 2~3초 단위로 잘게 쪼갠 고밀도 프롬프트로 씬을 생성했습니다.
자동 합성 및 렌더링: 로컬 환경에서 Node.js 기반의
Remotion패키지를 이용해 여러 mp4 클립을 하나의 영상으로 렌더링(npm run render)했습니다.AI 코딩 어시스턴트: 렌더링 과정에서 발생하는 윈도우 환경 에러, 캐시 오류, 하드코딩된 UI 버그 등을 실시간으로 진단하고 코드를 뜯어고치는 페어 프로그래밍을 진행했습니다.
Tip: 사용한 프롬프트 전문을 꼭 포함하고, 내용을 짧게 소개해 주세요. (에이전트와 진행한 핵심 트러블슈팅 프롬프트)
"아니 근데 김푸들 영상에 막막했죠? 순서도 이런 자막이 내 영상 자막이 아닌데, 다른 프로젝트 영상 자막이 들어가 있어. 수정해 줘." "파이널 잘 봤고 보니까 영상들 붙여넣기 해보니까 중간에 pause도 있고 자연스럽게 이어지지가 않는 단점이 있네"
Tip: 코드 전문은 코드블록에 감싸서 작성해주세요. 윈도우(Windows) 환경에서 Remotion 렌더링 스크립트를 실행할 때 발생한 주요 버그들을 다음과 같이 패치했습니다.
띄어쓰기 폴더 경로 오류 해결 경로에 띄어쓰기가 있을 경우 경로가 잘려
C:\dev\ai.mp4처럼 엉뚱한 곳에 저장되는 문제를 막기 위해 경로를 따옴표로 감쌌습니다.
// scripts/render_episode.mjs
const args = [
"remotion",
"render",
"remotion/index.ts",
episode-${episodeId},
"${outputPath}", // 큰따옴표 처리 추가
];
뚝 끊기는 화면 전환(Fade) 제거 및 하드 컷(Hard Cut) 적용 씬 사이에 배경색이 드러나며 멈칫거리는 느낌을 지우기 위해 투명도(opacity) 애니메이션을 제거했습니다.
tsx// remotion/SceneClip.tsx
return (
<AbsoluteFill style={{backgroundColor: "#f7f4ee"}}>
<AbsoluteFill>
{video ? (
<OffthreadVideo src={video.src} ... />
원치 않는 다른 프로젝트의 자막 오버레이 제거
tsx// remotion/SceneClip.tsx
const KineticCaptions: React.FC<{scene: KkulimScene; frame: number}> = ({scene, frame}) => {
// project.json 설정에서 자막이 꺼져 있으면 특수 자막 렌더링 방지
if (project.elements?.subtitles?.enabled === false) return null;
// ...
};
결과와 배운 점
배운 점과 나만의 꿀팁을 알려주세요. AI로 영상을 생성할 때 하나의 프롬프트로 68초를 통째로 맡기면 동작이 뭉개지거나 지루해지기 쉽습니다. 1개 씬을 A/B 컷으로 23초씩 짧게 쪼개어 구글 플로우에 넣고, 이를 프로그래밍(Remotion) 이나 캡컷(CapCut)으로 이어 붙이는 '하드 컷' 방식이 훨씬 역동적이고 실감 나는 결과물을 만든다는 것을 배웠습니다.
과정 중에 어떤 시행착오를 겪었나요?
윈도우(Windows) 환경의 함정:
npx명령어를spawn할 때 shell 옵션 누락으로 인한 에러, 띄어쓰기 폴더명 에러, Remotion 자체 크롬 다운로드 실패 등 윈도우 특유의 자잘한 터미널 버그를 많이 겪었습니다.캐시 및 하드코딩의 늪: 같은 씬 아이디(
ep01-s01)를 쓴다는 이유로 이전 프로젝트의 자막 코드가 제 영상에 강제로 덧씌워지는 황당한 이슈가 있었습니다. AI 어시스턴트에게 상황을 있는 그대로 직설적으로 따지듯(?) 말하니, 즉시 코드를 파헤쳐 원인을 찾아냈습니다.
도움이 필요한 부분이 있나요? 각 mp4 파일의 실제 재생 길이를 Remotion이나 스크립트가 자동으로 정확히 읽어내어 scenes.json의 duration_sec 값을 오차 없이 맞춰주는 자동화 기능이 Node.js 서버 단에서 완벽하게 돌아가면 좋겠습니다. (현재는 브라우저 API 의존 문제로 수동으로 길이를 맞춰줘야 하는 번거로움이 있습니다.)
앞으로의 계획이 있다면 들려주세요. 이제 영상 합성을 위한 하네스 뼈대가 단단하게 구축되었고 버그도 잡혔으니, 본격적으로 에피소드들을 쭉쭉 찍어내며 퀄리티업을 해보고 싶습니다!
