검은 사각형 영상이 58초 경매 쇼츠가 되기까지 — Codex로 처음부터 끝까지 만들어봤습니다!

소개

안녕하세요. 현직 공인중개사로 일하며 법원경매와 AI 실무 활용을 공부하고 있는 도시아재입니다.

이번에는 “AI로 영상도 만들 수 있다”는 설명만 듣고 끝내지 않고, GitHub에 공개된 오픈소스 두 개를 직접 가져와 실제 유튜브 쇼츠 한 편을 완성해 보기로 했습니다.

출발점은 관련내용의 유튜브 영상이었습니다.

[코덱스로 AI 화이트보드 애니메이션 영상 자동화 만들기].. 등등..

처음에는 GitHub 주소 두 개만 Codex에 전달하고 물었습니다.

위 GitHub 주소 2개를 모두 이 프로젝트에 클론해줘.

그리고 이 두 코드가 각각 무엇이고,

이 코드를 통해 무엇을 할 수 있는지 알려줘.

나의 부동산 업무와 일상에도 활용해 보고 싶어.

하나는 HTML과 애니메이션을 MP4로 만드는 범용 영상 도구 HyperFrames였고, 다른 하나는 SRT 자막 순서에 맞춰 그림을 손으로 그리는 것처럼 보여주는 SRT Whiteboard Animation이었습니다.

도구를 먼저 이해하고 나니 “무엇을 만들까?”라는 질문이 구체적으로 바뀌었습니다. 그래서 첫 실습으로 공인중개사가 고객에게 설명하는 60초 이내 경매 주의사항 영상을 선택했습니다.

도구를 먼저 이해하고, 그 도구를 내 실제 업무의 문제에 연결하니 실습이 결과물로 이어졌습니다.

그림 1. 신화법원경매 브랜드로 완성한 세로형 화이트보드 쇼츠

진행 방법

1. GitHub 저장소 두 개의 역할부터 나눴습니다

첫 번째 저장소는 HeyGen의 HyperFrames였습니다.

- HTML, CSS, 이미지, 음성, 애니메이션을 결합해 MP4로 렌더링하는 범용 프레임워크

- 차트, 모션그래픽, 여러 장면, 3분 이상 롱폼으로 확장하기 좋은 도구

- 앞으로 부동산 통계, 지역 변화, 정책 설명 영상에 활용할 수 있는 기반

두 번째 저장소는 SRT Whiteboard Animation이었습니다.

- SRT 자막을 기준으로 장면과 시간을 나누는 도구

- 그림 요소마다 등장 순서와 시간을 지정해 손그림 애니메이션으로 렌더링

- 경매, 계약, 권리분석처럼 복잡한 내용을 단계적으로 설명하기에 적합

이번 60초 영상은 SRT Whiteboard Animation을 중심으로 제작했습니다. HyperFrames는 앞으로 장면 수와 데이터 표현이 많아지는 롱폼에 활용할 계획입니다.

그림 2. 같은 프로젝트 안에 복제한 HyperFrames와 SRT Whiteboard Animation

2. 그림보다 먼저 데이터와 대본을 만들었습니다

처음에는 대본도 자료도 없었습니다. 그래서 이미지부터 생성하지 않고, 경매 입찰자가 반드시 알아야 할 내용을 먼저 정리했습니다.

실제 요청을 읽기 좋게 정리한 프롬프트입니다.

공인중개사가 고객에게 설명하는 60초 이내 경매 주의사항 영상을 만들고 싶어.

먼저 대본의 근거가 되는 데이터를 만들고,

부동산 경매 전문가의 관점에서 다시 검증해줘.

관련 법률과 경매 실무에 맞게 검수하고,

특정 사건의 투자 결과를 보장하지 않는 면책조항을 반드시 포함해줘.

그다음 세로형 쇼츠용 자막 스크립트와 장면 시나리오를 작성해줘.

최종 메시지는 세 가지 자료를 교차 확인하자는 내용으로 압축했습니다.

등기사항증명서

매각물건명세서

현황조사서

세 자료를 따로 보지 말고

권리관계, 점유관계, 매각조건을 서로 맞춰본다.

경매 콘텐츠이기 때문에 재미있는 문장보다 정확한 표현이 먼저였습니다. 개별 사건마다 결과가 달라질 수 있는 내용은 단정하지 않고, 마지막에는 신화법원경매가 제공하는 일반 정보라는 면책 문구를 넣었습니다.

3. 이미지와 음성을 두 스레드에서 동시에 진행했습니다

현재 Codex 스레드에서는 대본, 자막, 이미지, 애니메이션을 만들었습니다.

동시에 다른 Codex 스레드에서는 같은 확정 대본을 읽고 OpenAI API로 내레이션 MP3를 생성했습니다.

스레드 A

대본 검수 → SRT 자막 → 스토리보드 → 이미지 → 애니메이션

스레드 B

확정 대본 → OpenAI API 음성 생성 → MP3 저장

마지막 단계

애니메이션 + 음성 + 자막 + 브랜드 + 면책조항 합성

음성을 기다리는 동안 이미지를 만들 수 있었고, 하나의 확정 대본을 기준으로 두 작업의 내용이 어긋나지 않게 유지할 수 있었습니다.

여기서 한 가지 판단을 했습니다. 참고 영상처럼 장면 이미지를 많이 만들기보다 두 개의 큰 이미지 안에서 여러 요소가 순서대로 그려지도록 구성했습니다.

이미지 개수를 늘리는 것보다 시청자가 메시지를 이해할 시간을 확보하는 것이 더 중요했습니다.

4. 첫 렌더링에서 커다란 검은 사각형이 나왔습니다

첫 MP4 렌더링은 기술적으로 성공했습니다. 하지만 실제 화면을 확인해 보니 손 이미지 뒤에 커다란 검은 사각형이 나타났습니다.

그림 3. 명령은 성공했지만 실제 영상에서는 손 이미지의 검은 배경이 화면을 가렸다

원인은 렌더러가 사용하는 손 PNG에 투명 배경이 없었기 때문이었습니다. 이 상태로는 대본과 자막이 좋아도 최종 영상이라고 할 수 없었습니다.

수정 요청은 다음처럼 구체적으로 정리했습니다.

손과 펜의 형태, 색상, 비율은 그대로 유지해줘.

펜에 표시된 ‘신화법원경매’ 문구도 보존해줘.

검은색 배경만 완전한 투명 알파로 제거하고,

테두리에 검은 후광이 남지 않도록 처리해줘.

원본 파일은 덮어쓰지 말고 프로젝트용 복사본으로 저장해줘.

투명 손 이미지를 만든 뒤 두 장면을 모두 다시 렌더링했습니다.

그림 4. 검은 배경만 제거하고 손과 신화법원경매 문구를 유지한 재렌더링 화면

이번 경험으로 “렌더링 성공”과 “영상 완성”은 다르다는 것을 배웠습니다. 5초, 20초, 35초, 48초, 56초 화면을 직접 추출해 검은 배경, 자막, 브랜드, 면책조항을 다시 확인했습니다.

5. 58초 세로형 영상으로 합성하고 YouTube에 올렸습니다

두 개의 화이트보드 장면을 연결하고, 다른 스레드에서 만든 내레이션 MP3와 한국어 자막을 결합했습니다.

최종 확인 결과는 다음과 같습니다.

- 재생시간 58초

- 세로형 1080×1920

- 60fps

- H.264 영상과 AAC 음성

- 신화법원경매 브랜드 표시

- 한국어 자막과 면책조항 포함

- 평균 음량과 최대 음량 확인

- 대표 시점 5곳의 화면 검수

완성된 영상은 신화부동산TV에 실제로 공개했습니다.

[링크 : 신화부동산TV에 게시한 경매 주의사항 쇼츠]

https://youtube.com/shorts/IVpCksnB1f4?si=Lzt_36rAKwqG5BjT

그림 5. 로컬 MP4에서 끝나지 않고 신화부동산TV에 실제 게시한 화면

YouTube Studio에서는 다음 항목도 확인했습니다.

- 공개 상태와 고화질 처리 완료

- 태그 30개 등록

- 한국어·중국어·영어 키워드 구성

- 중국어(중국) 제목과 설명 번역 게시

- 교육 카테고리와 AI 사용 공개

중국어권 시청자를 본격적으로 유입시키려면 중국어 제목과 설명만으로는 부족하다는 점도 확인했습니다. 다음에는 중국어 간체 SRT 자막 트랙까지 추가하려고 합니다.

결과와 배운 점

결과

GitHub 링크 두 개의 용도를 물어보는 것으로 시작해 다음 결과물까지 이어졌습니다.

오픈소스 역할 파악

→ 프로젝트 복제

→ 경매 데이터와 대본 작성

→ 전문가·법률 관점 검수

→ SRT 자막과 스토리보드

→ 이미지와 음성 병렬 생성

→ 화이트보드 애니메이션 렌더링

→ 오류 수정과 재검수

→ YouTube 쇼츠 실제 게시

그림 6. 영상 마지막에 포함한 입찰 전 확인사항과 면책 취지 나레이션

제가 배운 점

1. GitHub 링크를 가져오는 것보다 각 저장소가 어떤 문제를 해결하는지 먼저 이해하는 것이 중요했습니다.

2. 하나의 확정 대본을 기준으로 이미지와 음성을 병렬 생성하면 속도와 일관성을 함께 잡을 수 있었습니다.

3. 부동산 콘텐츠는 화려한 이미지보다 정확한 데이터, 표현의 범위, 면책조항이 우선이었습니다.

4. 명령 실행 성공만 믿지 않고 실제 화면과 음량을 검수해야 했습니다.

5. 이미지 수가 적어도 한 이미지 안의 요소를 순차적으로 보여주면 충분히 설명력 있는 영상이 됐습니다.

시행착오

- 문제: 손 이미지 뒤에 검은 사각형이 나타남

- 원인: 배경이 투명하지 않은 RGB PNG 사용

- 해결: 원본을 보존한 채 배경만 알파 투명화하고 모든 장면을 재렌더링

- 검증: 대표 시점별 화면 추출과 최종 YouTube 공개 페이지 확인

앞으로의 계획

다음에는 .env 파일에서 ElevenLabs API 키와 Voice ID를 관리하고, ElevenLabs에 등록해 둔 제 목소리로 더 자연스러운 내레이션을 만들어보려고 합니다.

쇼츠 다음 목표는 3분 이상의 롱폼입니다. HyperFrames와 화이트보드 방식을 조합해 부동산 사례, 자료, 도표를 더 깊이 설명해 보고 싶습니다.

여러분께 묻고 싶습니다

다음 3분 롱폼의 첫 주제로 무엇이 가장 궁금하신가요?

1. 말소기준권리를 초보자도 이해하게 설명하기

2. 임차인의 대항력과 배당요구를 사례로 설명하기

3. 등기사항증명서·매각물건명세서·현황조사서 읽는 순서

댓글에 번호만 남겨주셔도 다음 제작 주제를 정하는 데 큰 도움이 됩니다. 이번 과정이 비슷한 실험을 시작하는 분께 도움이 되었다면 추천도 부탁드립니다.😀

참고한 영상과 링크

- 참고 영상: https://youtu.be/aelyPpDGiZQ

- HyperFrames: https://github.com/heygen-com/hyperframes.git

- SRT Whiteboard Animation: https://github.com/geeklee/srt-whiteboard-animation.git

- 완성 쇼츠: https://www.youtube.com/shorts/IVpCksnB1f4

📣 24기 대기자 모집이 시작되었습니다!