Claude, Three.js, Remotion으로 세로형 애니메이션 스토리 쇼츠 만들기

Claude 애니메이션 쇼츠란?

Claude 애니메이션 쇼츠는 Claude를 사용해 바이럴 애니메이션 쇼츠를 만드는 방법(전체 워크플로)에서 소개한 워크플로를 기반으로 하는 무료 Claude 스킬입니다. AI 동영상 생성기에 의존하지 않고 55~70초 분량의 세로형 애니메이션 스토리 쇼츠를 제작할 수 있도록 지원합니다.

이 프로젝트는 2D 캐릭터와 다채로운 3D 환경을 결합합니다. 주요 스타일에는 잉크 윤곽선, 회화풍 마을, 렌즈 블러, 부드럽게 이동하는 카메라, 행진곡 스타일의 음악, 동기화된 효과음이 포함됩니다. 렌더링은 Remotion 내부의 three.js를 사용해 개인 컴퓨터에서 실행됩니다.

이 워크플로는 1831년 브로턴 다리를 소재로 한 67초 분량의 쇼츠 노래에 반한 다리를 통해 검증되었습니다.

주요 기능 및 저장소 구성

저장소에는 제작 스킬, 완성된 예제 프로젝트, 오디오 에셋, 품질 보증 도구, 측정된 시각적 레퍼런스가 포함되어 있습니다.

• SKILL.md: 전체 파이프라인, 제작 규칙, 수정 사항, 최종 시각값이 포함된 핵심 스킬 정의입니다.
• templates/bridge/: 세계관, 캐릭터, 잉크 처리, 렌즈 블러, 색보정, 스토리, 카메라 작업을 포함한 다리 쇼츠의 전체 소스입니다.
• templates/audio/: 합성 효과음, 행진곡 음악, 더킹 및 라우드니스 처리가 적용된 최종 믹스입니다.
• templates/scripts/: 스틸 이미지와 나란히 배치된 시트 생성, 샷 병합, 프레임 단위 품질 보증을 위한 도우미 스크립트입니다.
• references/STYLE_BIBLE.md: 20개의 레퍼런스 쇼츠를 측정해 만든 대본 및 시각적 공식입니다.
• references/reports/: 움직임, 깊이감, 텍스처, 캐릭터, 조명, 윤곽선, 색보정을 다루는 7개의 보고서입니다.
• references/frames/: 540 x 960픽셀 크기의 전체 크기 레퍼런스 프레임 38개입니다.
• references/sheets/: 레퍼런스 쇼츠마다 60개 프레임이 포함된 콘택트 시트 20개로, 총 1,200개 프레임입니다.

사전 요구 사항

스킬을 설치하기 전에 렌더링 및 오디오 워크플로에 필요한 로컬 도구를 준비하세요.

• Claude Code: 스킬을 호출하고 워크플로를 조정하는 데 사용합니다.
• Node: JavaScript 및 Remotion 환경에 필요합니다.
• Remotion: 동영상 구성 및 three.js 렌더링을 위해 @remotion/three와 함께 사용합니다.
• Python 3: 포함된 도우미 스크립트에 필요합니다.
• ffmpeg: 동영상 및 오디오 처리에 사용합니다.

Remotion과 three.js 통합을 설정할 때는 공식 Remotion 문서를 따르세요. 다음 명령줄 도구를 사용할 수 있는지도 확인할 수 있습니다.

node --version
python3 --version
ffmpeg -version

Claude 스킬 설치

1. 저장소를 복제하거나 ZIP 아카이브를 다운로드합니다.

2. 전체 프로젝트 폴더를 다음 Claude 스킬 경로에 배치합니다.

   ~/.claude/skills/cartoon-3d-short/

3. SKILL.md, templates/, references/가 해당 디렉터리 안에 그대로 있는지 확인합니다. 스킬은 워크플로와 시각적 비교에 이 리소스를 사용하므로 저장소 구조를 유지하세요.

4. 제작을 시작하기 전에 Remotion, @remotion/three, Node, Python 3, ffmpeg가 컴퓨터에서 사용 가능한지 확인합니다.

Remotion 임시 저장소 구성

REMOTION_TMP를 여유 공간이 충분한 드라이브의 폴더로 설정합니다. Remotion 번들을 생성할 때마다 약 1.3 GB 크기의 public/ 디렉터리가 임시 저장소에 복사됩니다.

Unix 계열 셸에서는 다음과 같이 현재 세션에 변수를 설정할 수 있습니다.

export REMOTION_TMP=/path/to/large-drive/remotion-tmp

작은 시스템 디스크보다 대용량 드라이브의 위치를 선택하세요. 환경 변수를 영구적으로 구성하는 방법은 운영 체제와 셸에 따라 다릅니다.

첫 애니메이션 쇼츠 만들기

1. 주제 선택

설명하고 싶은 역사적 사건, 이야기 또는 주제를 정합니다. 이 프로젝트는 짧은 내러티브 제작을 중심으로 설계되었으므로, 약 1분 안에 담을 수 있는 명확한 주제로 시작하는 것이 좋습니다.

2. Claude Code에서 스킬 호출

Claude Code를 열고 스킬을 직접 요청합니다. 플레이스홀더를 주제로 바꾸세요.

Use the cartoon short skill and make a short about [your topic].

예를 들면 다음과 같습니다.

Use the cartoon short skill and make a short about the Broughton bridge collapse.

3. 스킬이 제작 파이프라인을 따르도록 하기

Claude는 SKILL.md의 지침을 따릅니다. 워크플로는 다음과 같은 주요 단계로 진행됩니다.

1. 주제 및 사실: 주제와 사실에 기반한 토대를 확립합니다.
2. 대본: 사실을 짧은 내러티브로 구성합니다.
3. 보이스: 이야기에 사용할 내레이션을 준비합니다.
4. 샷 구성: story.ts에서 시퀀스와 카메라 계획을 정의합니다.
5. 스틸 이미지: 최종 렌더링을 확정하기 전에 대표 프레임을 생성합니다.
6. 렌더링: Remotion과 three.js를 통해 애니메이션 샷을 로컬에서 제작합니다.
7. 품질 검사: 측정 보고서 및 제공된 레퍼런스 프레임과 프레임을 비교합니다.
8. 최종 출력: 최종 2K 렌더와 사운드 믹스를 제작합니다.

시각 및 오디오 워크플로 이해하기

제공된 브리지 템플릿은 프로젝트에서 완성된 단편을 구성하는 방식을 보여 주는 완전한 예시입니다. templates/bridge/를 살펴보며 환경, 캐릭터, 아웃라인, 깊이 효과, 색보정, 카메라 움직임, 스토리 타이밍이 어떻게 함께 작동하는지 확인하세요.

사운드는 templates/audio/를 확인하세요. 검증된 제작 과정에서 사용한 합성 효과음, 행진곡, 음량 처리, 더킹을 보여 줍니다. 더킹은 내레이션이나 기타 중요한 오디오를 중심으로 사운드트랙의 균형을 맞추는 데 도움이 됩니다.

이 프로젝트에는 스틸 이미지 생성, 숏 병합, 비교 시트, 프레임 단위 점검을 위한 스크립트도 포함되어 있습니다. 이러한 도구는 완성된 제작물을 마무리하기 전에 시각적 문제를 파악할 수 있는 반복 작업 흐름을 지원합니다.

레퍼런스를 올바르게 사용하기

레퍼런스 자료는 스토리 콘텐츠를 제공하기 위한 것이 아니라 시각적 연출을 안내하기 위한 것입니다.

• references/STYLE_BIBLE.md를 읽고 정제된 스크립트와 시각적 공식을 이해하세요.
• 움직임, 깊이, 텍스처, 캐릭터 연출, 조명, 아웃라인 또는 색보정을 조정할 때 보고서를 참고하세요.
• 생성한 스틸 이미지를 38개의 전체 크기 레퍼런스 프레임과 비교하세요.
• 콘택트 시트를 사용해 완성된 시퀀스 전체의 페이싱과 시각적 일관성을 평가하세요.

스토리, 캐릭터, 목소리는 항상 직접 창작해야 합니다. 포함된 레퍼런스는 콘텐츠가 아니라 스타일을 참고하는 용도로 사용하세요.

고급 팁

전체 렌더링 전에 스틸 이미지 검토하기

전체 렌더링에 시간을 쓰기 전에 스틸 이미지 생성 및 비교 작업 흐름을 사용하세요. 대표 프레임을 활용하면 제작 초기에 구도, 아웃라인, 조명, 깊이, 블러, 색보정을 더 쉽게 평가할 수 있습니다.

보고서를 대상별 체크리스트로 사용하기

숏이 이상하게 보일 때는 모든 시각 설정을 한꺼번에 바꾸지 말고 문제에 맞는 보고서를 참고하세요. 예를 들어 움직임에 문제가 있으면 모션 보고서를, 잉크 처리가 의도한 스타일과 다르면 아웃라인 보고서를 확인하세요.

완성된 브리지 템플릿 살펴보기

브리지 프로젝트는 단순한 시각 샘플이 아니라 완성된 67초 단편의 전체 소스입니다. story.ts, 카메라, 캐릭터, 환경 요소, 후처리, 오디오가 하나의 제작물에 어떻게 기여하는지 이해하는 데 활용하세요.

렌더링 전에 디스크 공간 계획하기

Remotion 번들은 임시 폴더에 약 1.3GB의 공개 에셋을 복사하므로, 번들을 반복해서 생성하면 저장 공간이 제한된 환경에 상당한 부담이 될 수 있습니다. 렌더링 작업을 많이 진행하기 전에 REMOTION_TMP를 충분히 큰 드라이브로 지정하세요.

독창적인 창작 요소 유지하기

각 프로젝트마다 새로운 스토리와 독창적인 캐릭터를 만들고, 직접 음성 연출을 구성하세요. 저장소의 코드와 문서는 MIT 라이선스로 제공되지만, 제공된 프레임은 스타일 연구 용도로만 라이선스가 부여됩니다.

라이선스

프로젝트 코드와 문서는 MIT 라이선스로 제공됩니다. 자세한 내용은 저장소의 LICENSE 파일을 확인하세요. 포함된 레퍼런스 프레임은 용도가 더 제한적이며 시각적 스타일을 연구하기 위한 목적으로만 제공됩니다.

맺음말

Claude Animated Shorts는 주제를 세련된 세로형 애니메이션 스토리로 전환할 수 있는 체계적인 로컬 작업 흐름을 제공합니다. 스킬과 종속 항목을 설치한 후 주제를 Claude Code에 입력하면 리서치, 스크립트 작성, 음성, 숏 계획, 스틸 이미지 검토, 프레임 비교, 렌더링, 사운드 믹싱을 아우르는 파이프라인을 따를 수 있습니다. 포함된 브리지 제작물과 정제된 레퍼런스는 일관된 스타일의 독창적인 단편을 만드는 데 실용적인 기반을 제공합니다.