📣 23기 AI 스터디 최저가 혜택이 얼마남지않았어요!

이미지 / 음악 / 영상
꽃잔치
꽃잔치
📹 SNS 찐친
📚 연구 찐친
·이미지 / 음악 / 영상에 게시됨

사랑하는 언니 결혼 축하 영상 만들기 2탄 (완성!!!!)

* 제가 쓴게 아님다! 안티그래비티가 쓴거임 !!!!!!!

소개

시도하고자 했던 것과 그 이유를 알려주세요.

  • 목표: "브라이덜 샤워" 비디오 프로젝트의 오디오 싱크에 맞지 않던 자막 타임라인을 완벽하게 재정렬하고, 가독성을 극대화하기 위해 한글/영문 2줄 구성의 정적 자막(움직임 없는 자막) 및 눈부심 없는 즉시 전환(Direct Cut) 형태의 가로형 영상을 성공적으로 제작 및 렌더링하는 것이었습니다.

  • 이유: 보컬 트랙이 진행되면서 기존 자막 파일의 1분대 이후 타임라인 불일치 문제가 발생해 엉뚱한 대사들이 출력되고 있었습니다. 또한, 자막 등장 시 발생하는 모션과 장면 전환 시의 미세한 플래시 현상이 시청 시 어지러움을 유발했기에, 안정적이고 눈이 편안한 최종 결과물을 빌드하고자 했습니다.

진행 방법

어떤 도구를 사용했고, 어떻게 활용하셨나요?

  • 도구:

    • ChatGPT & Genspark: 사용자가 타임라인이 밀리는 오디오 데이터를 기반으로 직접 절대 타임스탬프(start_sec, end_sec)를 정밀 추출하고 자막 구조를 재배치하는 데 활용했습니다.

    • Python & Remotion: 추출된 절대 시간을 Remotion 규격의 씬 단위 상대 시간으로 변환하고 자막을 조립 및 자동 세팅하는 파이썬 스크립트 작성에 활용했습니다.

    • Remotion Render Engine: 가로형 영상 렌더링 파이프라인(React 기반)을 구동하고 연출 코드를 수정하는 데 사용했습니다.

1. 자막 자동 정렬 및 마침표 제거 파이썬 스크립트

Genspark v2 JSON 데이터를 읽어 씬별 재생 구간을 계산하여 병합하고, 자막 끝의 마침표(.)를 자동으로 정제해 주는 코드를 적용했습니다.

python

# scratch/sync_subtitles_genspark_v2.py 일부

def strip_trailing_period(text):

text = text.strip()

if text.endswith(".'"):

text = text[:-2] + "'"

elif text.endswith('."'):

text = text[:-2] + '"'

elif text.endswith("."):

text = text[:-1]

return text.strip()

for cue in genspark_data["entries"]:

start_abs = cue["start_sec"]

end_abs = cue["end_sec"]

en_clean = strip_trailing_period(cue["en"])

ko_clean = strip_trailing_period(cue["ko"])

text = f"{en_clean}\n{ko_clean}"

# scenes.json의 누적 시간과 매핑하여 상대적 start, end 계산 후 subtitles.json에 기록

2. 자막 무빙 비활성화 및 렌더링 에러 우회

자막 무빙 애니메이션을 제거하고, 매우 짧은 자막이 나올 때 시간 보간 함수(interpolate)에서 발생하는 수학적 정렬 에러를 조건문으로 우회했습니다.

typescript

// remotion/SceneClip.tsx (CaptionBurst 컴포넌트 수정본)

const CaptionBurst: React.FC<{cue: CaptionCue; frame: number; speedFactor?: number}> = ({cue, frame, speedFactor = 1.0}) => {

const start = cue.start speedFactor FPS;

const end = cue.end speedFactor FPS;

const isBridalShower = project.id === "bridal-shower";

// 브라이덜 샤워 프로젝트는 어지러움을 막기 위해 페이드/스케일/무빙 애니메이션을 완전히 생략하고 정적으로 노출

if (isBridalShower) {

if (frame < start || frame > end) {

return null;

}

const align = cue.align ?? "left";

const translateX = align === "center" ? "-50%" : align === "right" ? "-100%" : "0";

return (

<div style={{ position: "absolute", left: ${cue.x}%, top: ${cue.y}%, transform: translate(${translateX}, -50%) scale(1), opacity: 1, zIndex: 20, width: "90%", maxWidth: "1400px" }}>

<div style={{ position: "relative", color: "#ffffff", textShadow: "0px 0px 4px #000000, -1.5px -1.5px 0 #000000, 1.5px -1.5px 0 #000000, -1.5px 1.5px 0 #000000, 1.5px 1.5px 0 #000000", fontFamily: "Pretendard, sans-serif", fontSize: cue.size ? cue.size * 0.75 : 40, fontWeight: 500, lineHeight: 1.4, textAlign: "center", whiteSpace: "pre-line" }}>

{cue.text}

</div>

</div>

);

}

// 타 프로젝트용 애니메이션 보간 계산 (브라이덜 샤워는 타임 에러 방지를 위해 이 계산 과정을 아예 거치지 않음)

const opacity = interpolate(frame, [start, start + 3, end - 5, end], [0, 1, 1, 0], { extrapolateLeft: "clamp", extrapolateRight: "clamp" });

// ... 생략 ...

결과와 배운 점

배운 점과 나만의 꿀팁을 알려주세요.

  • 정적 자막의 중요성: 템플릿에 내장된 화려한 무빙 자막이 짧고 정보량이 많은 한/영 다중 레이아웃 자막과 결합하면 시각적 노이즈가 되어 가독성을 해치고 몰입을 방해할 수 있습니다. 상황에 따라 과감히 애니메이션을 끄는 것이 완성도를 높이는 꿀팁입니다.

  • 디렉트 컷(Direct Cut) 전환: 슬라이드 형태의 영상에서 씬 경계마다 페이드인/아웃을 무조건 적용하면, 부모 배경색 노출로 인한 화면 깜빡임이 생겨 피로감이 커집니다. 화면 전환은 컷 단위로 즉각 붙이는 것이 훨씬 세련됩니다.

과정 중에 어떤 시행착오를 겪었나요?

  1. 싱크 어긋남 오류: 1분대 이후부터 음악 내부 벌스(Verse) 편집 구조로 인해 타임라인이 뒤엉키던 문제.

    • 극복: 외부 AI 도구(Genspark, ChatGPT)를 통해 절대 오디오 스탬프를 정밀 복원한 뒤, 파이썬 매퍼를 개발하여 30개 전체 씬 구간에 정확히 밀착시켰습니다.

  2. 메모리 초과 크래시 (EPIPE Error): 5분에 달하는 긴 영상을 고해상도 렌더링하면서 Puppeteer 크롬 프로세스들이 메모리 부족으로 터지던 현상.

    • 극복: 렌더링 스크립트(render_episode.mjs)에 동시성 제한 인자(--concurrency=2)를 추가하여 하드웨어 부하를 조절함으로써 9,270프레임을 에러 없이 무사히 완주했습니다.

  3. 시간 보간 값 엇갈림 오류 (monotonically increasing): 자막 유지 시간이 너무 짧은 구간에서 모션용 보간 배열(ex: 3초 지점과 1.6초 지점의 충돌)이 정렬되지 않아 컴파일 에러가 발생한 현상.

    • 극복: 렌더러가 브라이덜 샤워 프로젝트일 때 보간 로직 자체를 건너뛰고 정적 컴포넌트를 즉시 반환하게 하여 에러 원인을 근본적으로 도려냈습니다.

  4. 장면 전환 시 흰색 화면 깜빡임: 씬과 씬 사이의 디졸브 페이드 과정에서 하단의 연한 미색 배경이 비쳐 눈부심과 어지러움을 가중시켰던 현상.

    • 극복: 씬 전환 페이드를 제거해 즉시 화면이 전환되게 처리하고 부모 배경색 또한 어두운 톤(#080b11)으로 안전 조치하여 완벽한 전환 연출을 완성했습니다.

도움이 필요한 부분이 있나요?

  • 현재는 해결되어 추가적인 기술적 도움은 필요하지 않습니다.

앞으로의 계획이 있다면 들려주세요.

  • 이번 가로형 원본 제작 및 싱크 제어 노하우를 바탕으로, 핵심 하이라이트만을 깔끔하게 압축한 3분 내외의 세련된 숏폼 요약 버전 동영상을 추가 제작할 계획입니다.

도움 받은 글 (옵션)

참고한 지피터스 글이나 외부 사례를 알려주세요.

  • 지피터스 AI 비디오 포럼 및 Remotion 공식 가이드: 대용량 비디오 렌더링 시 브라우저 동시성 제한 설정(--concurrency)과 Puppeteer 메모리 프로파일 관련 튜닝 트러블슈팅 사례를 참고하여 크래시 현상을 돌파했습니다.

  • 유튜브 최종 업로드 영상 링크:

https://youtu.be/FAZEJBbWtzU

https://youtu.be/FAZEJBbWtzU

다음번엔 축사 영상 3분내로 줄일거고

다음 프로젝트는 명인 선생님들 인생 애니메이션 시리즈 만들거에요!!!!!

영상 배우길 잘했다!!!! 22기 끌림영상 대박!!!


1
1개의 답글

뉴스레터 무료 구독

신청하기