kbohara315/what-if-animation

What If 애니메이션

하나의 주제 줄을 입력하면 완성된 15~25초 에피소드가 출력됩니다. 모든 프레임은 Claude가 작성하는 SVG(Remotion으로 렌더링)이며, 음성과 사운드는 ElevenLabs에서 제공합니다. 두 가지 예제가 studio/src/episodes/에 포함되어 있으며, 둘 다 렌더링 가능한 상태입니다: rewind("10초를 되감을 수 있다면?", 증명 클립: 능력으로 장면을 거꾸로 재생)와 copy-paste("무엇이든 복사해서 붙여넣을 수 있다면?", 스킬의 첫 번째 전체 실행: 새로운 주방 세트, 과학 비트의 개략도, 절벽 장면 정전). 시작하기 전에 주제와 가장 가까운 예제를 읽어보세요.

파일	내용
references/formula.md	Seven-Beat What If 공식, 15~25초 형태, 스크립트 규칙, 주제 선택 방법
references/look.md	측정된 외형, 템포, 샷 어휘, 스토리보드 및 모션 체크리스트
references/kit.md	구성 요소: 엔진, 캐스트, 세트, 방 키트, 조명, UI, 외형 및 각각 추가하는 방법
references/sound.md	사운드 이벤트 작성, 프롬프트, 레벨, 비용
references/traps.md	두 예제 에피소드에서 시간이 많이 소요된 모든 사항
studio/	Remotion 프로젝트: 한 번 복사한 후, 모든 에피소드가 이 안에서 실행됩니다
scripts/	음성, 계획, 스틸, 보드, SFX, 믹스 체크, 모션 그리드, 마스터 (Python 3.9+ 및 Node)

규칙

• 원본 캐릭터만 사용. Pip(주인공, 외형 B)와 Mo(그의 친구)는 우리 캐릭터이며, 여동생, 엄마, 리그 위의 수트도 마찬가지입니다. 어떤 채널의 주인공도, 유명한 만화 캐릭터를 닮은 것도 사용하지 마세요. 캐스트 시트에 새로운 외형을 추가할 때마다 확인하세요(Mo의 첫 번째 모자는 특정 캐릭터와 비슷해져서 제거됨).
• 원작 스토리. 공식은 공유되지만, 에피소드는 다른 사람의 것이 아닙니다. 다른 채널의 제목을 재현하지 마세요.
• 바이럴 채널이 Claude나 다른 도구로 만들어졌다고 절대 주장하지 마세요. 아무도 그 제작 방식을 밝히지 않았습니다.
• 키는 이름으로만 지정. ELEVENLABS_API_KEY는 환경 변수 또는 스튜디오 상위의 .env 파일에서 가져옵니다. 키를 절대 출력, 붙여넣기, 하드코딩하지 마세요.
• 모든 실행의 ElevenLabs 크레딧을 보고하세요: 스크립트가 out/<slug>/costs.json에 기록하고 master.py가 report.json에 합산합니다. 음성 비용은 계정 기록에서 정확히 읽으며, 사운드 클립은 거기에 표시되지 않으므로 계정 카운터에서 비용을 읽습니다(지연될 수 있음: 보고하기 전에 다시 읽으세요). 에피소드를 전달할 때 숫자를 알려주세요. copy-paste 실행은 152크레딧이 소요되었습니다(음성 78, 새 클립 12개에 74).
• 애니메이션 전에 스토리보드. 스틸이 자체 검증(5단계)을 통과하고, 사람이 루프에 있을 경우 보드를 본 후에만 비디오를 렌더링합니다.
• 모든 사실은 실제여야 합니다. 스크립트의 숫자는 먼저 에피소드의 science 필드에서 계산되고 출처가 명시되어야 합니다.

설정(기계당 한 번)

Node 18+, PATH에 ffmpeg와 ffprobe, Python 3.9+(numpy 및 Pillow 필요), ElevenLabs 키가 필요합니다.

cp -r <skill>/studio ./what-if-studio && cd what-if-studio && npm install

모든 작업은 해당 스튜디오 폴더에서 실행되며, <skill>은 이 스킬의 폴더입니다. 오프라인으로 작업하거나 자체 브랜드 페이스를 사용하려면 디스플레이 폰트를 public/fonts/에 넣고 src/studio.config.ts에서 titleFont를 설정하세요(기본 제목 폰트인 Bricolage Grotesque와 UI 폰트는 렌더링 시 Google Fonts에서 로드됨). 기존 스튜디오를 최신 엔진으로 업데이트하려면 <skill>/studio/src/engine을 기존 src/engine에 덮어쓰세요.

파이프라인

순서대로 단계를 진행하세요. 각 단계는 다음 단계 전에 확인해야 할 결과물로 끝납니다.

1. 스크립트

references/formula.md를 읽으세요. 먼저 유튜브에서 전제를 검색하세요: 어떤 What If 채널에 이미 정확히 같은 에피소드가 있다면, 능력이나 규칙을 변경하세요. 주제 줄에서 능력의 단어, 규칙, 세 가지 확대되는 데모, 전환점(숫자가 포함된 하나의 실제 사실)을 결정합니다. src/episodes/<slug>/episode.json을 id(파스칼케이스, 컴포지션 이름), slug, topic, title(두 줄), script(비트당 하나의 항목), science(각 사실: 주장, 계산, 출처)와 함께 작성하세요. 45~65단어. 템포에 맞춰 소리 내어 읽으세요: 모든 줄이 그림이 되어야 합니다.

2. 음성

python <skill>/scripts/voice.py <slug>

캐릭터 타임스탬프가 포함된 ElevenLabs 테이크 한 번(356자 copy-paste 테이크는 78크레딧 소요), 그런 다음 장르 템포에 맞춰 일시 정지를 자릅니다: public/<slug>/voice.wav 및 src/episodes/<slug>/words.json. 길이(15~25초)와 출력된 단어 시간을 확인하세요. episode.json에서 gaps로 일시 정지를 조정하고 재실행하세요: 테이크가 캐시되므로 무료입니다. 단어를 변경하면 API를 다시 호출합니다.

3. 샷 목록

스크립트의 그림마다 하나의 샷(보통 9~14개)을 디자인하고, 컷마다 크기와 각도를 다양하게 하세요(와이드, 인서트, 미디엄, 클로즈업, 오버더숄더, 하이, 로우; references/look.md 참조). episode.json에 다음을 추가하세요:

• shots: { "id": "S1", "size": "medium", "set": "kitchen", "key": 14, "note": "보이는 것" }(key는 스토리보드가 보여주는 샷 자체 시계의 프레임)
• edit: 컷당 { "shot": "S1", "at": "cookie" }, 도착하는 단어에 맞춤(plan.py가 큐 형식을 나열함; 샷의 시계를 구부리는 능력의 경우 reverse, from, to 및 look)
• fx: 한 프레임 플래시 및 흔들림, { "at": "S3+2", "kind": "flash" }

python <skill>/scripts/plan.py <slug>

timeline.json과 out/<slug>/shotlist.md를 작성하고 템포를 출력합니다. 오프닝에서 분당 27컷 이상, 정적 샷은 약 3초를 넘지 않도록 목표로 하세요. 그림을 그리기 전에 플래그가 지정된 사항을 수정하세요.

4. 스토리보드

references/kit.md에서 구성 요소를 읽으세요. src/episodes/<slug>/shots.tsx를 작성하세요. 샷당 하나의 컴포넌트로, 각각은 시계 t의 순수 함수입니다(두 예제의 shots.tsx 패턴 복사). index.tsx(에피소드와 능력 외형)도 작성하고, 에피소드를 src/episodes/index.ts에 추가하세요. 이 단계에서는 각 샷이 key 프레임에서만 올바르면 됩니다. 주제에 라이브러리에 없는 장소가 필요한 경우, 방 키트로 빌드하여 src/engine/sets/(그리고 스킬의 복사본에도)에 추가하여 다음 에피소드가 사용할 수 있도록 하세요(copy-paste 실행에서 주방과 개략도를 추가한 것처럼). 새 캐릭터나 의상: 외형을 추가한 후 캐스트 시트에서 확인하세요(npx remotion still src/index.ts Cast out/cast.png).

npx tsc --noEmit
node <skill>/scripts/stills.mjs <slug>
python <skill>/scripts/board.py <slug>

out/<slug>/storyboard.jpg: 샷당 하나의 캡션이 있는 스틸.

5. 스틸 자체 검증

스토리보드를 보고 out/<slug>/board/의 모든 스틸을 전체 크기로 열고, references/look.md의 스토리보드 체크리스트를 샷별로 정직하게 실행하세요. 실패한 항목을 기록하고 수정한 후 해당 샷만 다시 렌더링하고(stills.mjs <slug> S3 S7), 시트를 다시 빌드하고 다시 확인하세요. 통과할 때까지 반복하세요. 수정 방법을 찾기 전에 references/traps.md에서 현재 실패를 확인하세요. 사람이 루프에 있는 경우, 지금 보드를 보여주고 애니메이션 전에 의견을 받으세요.

6. 애니메이션

키 포즈에서 각 샷에 생명을 불어넣으세요: 예측 동작, 유지 및 오버슈트가 있는 poseAt 키, 표정을 위한 faceAt, kf를 사용한 카메라 이동, 능력 외형, fx. 그런 다음 드래프트를 렌더링하고 모션을 확인하세요:

python <skill>/scripts/master.py <slug>
python <skill>/scripts/motiongrid.py <slug> S2 S5
node <skill>/scripts/stills.mjs <slug> --frames 120 240

references/look.md의 모션 체크리스트에 맞춰 그리드를 플립북처럼 읽고 수정 후 재렌더링하여 통과할 때까지 반복하세요.

7. 사운드

references/sound.md를 읽으세요. episode.json에 sound를 추가하세요: 클립(프롬프트 및 길이), 보이는 동작당 하나의 이벤트를 샷에 큐, 위치별 앰비언스, 음악 배경 및 레벨. 라이브러리에 이미 있는 것을 확인한 후 생성하세요:

python <skill>/scripts/sfx.py <slug> --dry
python <skill>/scripts/sfx.py <slug>

사용된 크레딧을 출력하고 timeline.json에 스템 볼륨을 설정합니다. 그런 다음 모든 단어가 명확하게 들리는지 확인하세요:

python <skill>/scripts/mixcheck.py <slug>

단어가 발화되는 동안 효과나 음악이 음성과 3dB 이내에 있는 순간을 나열합니다. 단어를 설명하는 히트는 단어 위가 아니라 바로 뒤의 일시 정지에 위치해야 합니다. 핵심 대사 아래의 배경(허밍, 드론)은 낮춥니다. 대부분의 스템이 음성을 방해하면 sfx_lu를 낮추세요. 의도적인 오버랩(타이틀 붐, 전환점)만 남을 때까지 sfx.py와 체크를 재실행하세요.

8. 마스터 및 전달

python <skill>/scripts/master.py <slug>

렌더링하고, 믹스를 -14 LUFS로 가져오고 피크는 -1 dBTP 미만으로 유지하며, out/<slug>/report.json(길이, 음량, 템포, 크레딧)을 작성합니다. 최종 파일을 사운드와 함께 한 번 재생합니다. out/<slug>/<slug>-final.mp4와 out/<slug>/storyboard.jpg를 길이, 사용된 ElevenLabs 크레딧, 추가 개선할 사항과 함께 전달하세요.

에피소드 위치

경로	내용
src/episodes/<slug>/episode.json	작성하는 모든 것: 스크립트, 과학, 샷, 편집, FX, 사운드
src/episodes/<slug>/shots.tsx, index.tsx	그림: 샷당 하나의 컴포넌트, 능력 외형
src/episodes/<slug>/words.json, timeline.json	voice.py와 plan.py가 작성(sfx.py가 볼륨 추가)
public/<slug>/	voice.wav, sfx.wav, music.wav
out/<slug>/	보드 스틸, storyboard.jpg, shotlist.md, 모션 그리드, 렌더링, costs.json, report.json
library/sfx/	생성된 모든 사운드 클립, 모든 에피소드가 공유