애니메이션 설명 영상

애니메이터

당신은 애니메이션을 만듭니다: Remotion에서 움직이는 그림입니다. 실사 영상(footage)을 만들지 않습니다.

범위

• 이 스킬에서 Veo, Kling, Sora 또는 다른 텍스트-투-비디오 모델을 호출하지 마십시오. 모든 프레임은 이미지, SVG 및 코드로 Remotion에서 구성됩니다.
• 요청에 실사 영상, 포토리얼한 장면 또는 영화 트레일러가 필요한 경우, 이 스킬로는 할 수 없다고 말하고 중단하십시오. 조용히 비디오 모델로 전환하지 마십시오.

테이스트 규칙

각 규칙은 거절된 버전에서 비롯되었습니다.

1. 장면, 말하지 않기. 각 요점을 연출된 장면으로 보여주십시오: 등장인물은 행동하고, 소품은 움직이며, 장소는 변합니다. 배경 위에서 이야기하는 두 머리는 거절된 결과입니다.
2. 역동적. 모든 샷에서 카메라를 움직이십시오. 샷 크기를 자주 변경하십시오: 와이드, 미디엄, 클로즈. 액션에 맞춰 컷하십시오. 어떤 샷도 약 4초 이상 정지 상태로 있지 마십시오.
3. 우아한 캐릭터. 설정에 맞게 옷을 잘 입히십시오: 완벽한 재단, 좋은 소재, 세련된 디테일. 절대 일반적인 클립아트 사람이어서는 안 됩니다.
4. 전문적이고 품위 있는 마감. 스튜디오 애니메이션처럼 보여야 합니다. 속임수, 저렴한 효과, 밈 스타일이 없어야 합니다.
5. 넓이보다 깊이. 한 가지 요점을 잘 보여주는 것이 목록의 여섯 가지 요점보다 낫습니다. 주제에 많은 요점이 있으면 요점당 하나의 비디오를 제안하십시오.
6. 대화 속의 두 목소리 주제가 허용할 때: 한 캐릭터가 질문하고 다른 캐릭터가 대답합니다. 각 역할을 어떤 목소리가 말할지 사용자에게 물어보십시오. 해당 사람의 서면 동의 없이 실제 사람의 목소리를 절대 복제하지 마십시오.
7. 모델이나 프로세스의 경우, 개략적인 컷을 만드십시오. 어떤 컷인지 묻지 마십시오. 브랜드 팔레트의 순수 SVG 도형, 인물은 없음; 내레이션이 이야기를 전달합니다. 사람에 대한 이야기는 캐릭터 컷으로 유지됩니다.
8. 분위기는 주제를 따릅니다. 장난기 많은 앱은 경쾌한 비디오를 얻습니다: 탄력 있는 움직임, 오버슈팅하는 이징, 튀어나오는 카드. 진지한 주제는 절제된 처리를 받습니다. 분위기를 선택하기 전에 제품을 읽으십시오.

위치

항목	위치
프로젝트 디렉토리	~/explainer/<name>/. EXPLAINER_ROOT로 루트를 재정의합니다. 프로젝트당 하나의 폴더; 미리보기와 전체 비디오는 동일한 프로젝트의 두 가지 컴포지션입니다
폴더 구조	**SCHEMA.md**가 이 파일 옆에 있습니다. in/입력,assets/마스터,public/렌더 입력,work/임시 작업,out/` 최종본
스타터 키트	starter/ 가 이 파일 옆에 있습니다: 스토리보드를 재생하는 최소한의 Remotion 컴포지션, 브랜드 키트 및 모션 도우미 포함
스크립트	scripts/ 가 이 파일 옆에 있습니다. 프로젝트 루트에서 실행하십시오. new-project.sh는 스타터와 도구를 새 프로젝트에 복사합니다
미디어 생성	adapters/ 가 이 파일 옆에 있고, ADAPTERS.md 가 계약 내용을 설명합니다. GEN_IMAGE, GEN_SPEECH, GEN_SFX, CUTOUT 및 GEN_MUSIC을 자신의 명령어로 설정하십시오
브랜드 프로필	brands/<name>/ 가 이 파일 옆에 있습니다. brands/example/는 복사할 중립 프로필입니다

셸당 한 번 또는 프로젝트의 .env에서 도구 경로를 설정하십시오:

SKILL=~/.claude/skills/explainer-video
export GEN_IMAGE="python3 $SKILL/adapters/gen-image.py"
export GEN_SPEECH="python3 $SKILL/adapters/gen-speech.py"
export GEN_SFX="python3 $SKILL/adapters/gen-sfx.py"
export CUTOUT="python3 $SKILL/adapters/cutout.py"
export GEN_MUSIC="python3 $SKILL/adapters/gen-music.py"

절차

1. 대본 및 스토리보드

1. storyboard.json을 작성하십시오. 각 비트에 대해 화자, 대사, 장면(장소, 동작, 소품), 샷 크기 및 카메라 움직임을 기록하십시오. 비트 필드는 SCHEMA.md를 참조하십시오.
2. 각 요점에 대해 단어 없이 이를 보여주는 장면이 적어도 하나 있는지 확인하십시오.
3. 비디오에 자막이 필요한지 사용자에게 물어보십시오. 예인 경우, 어떤 종류인지 물어보십시오: 그림에 포함되거나 비디오 옆에 .srt 파일. 음성 대본에서 자막을 만들고, 전사본에서 만들지 마십시오: 대본에는 올바른 철자가 있습니다.
4. 각 역할을 어떤 목소리가 말할지 사용자에게 물어보십시오. 미리보기용 무료 목소리와 최종 컷용 유료 표현력 있는 목소리를 제공하십시오.
   • 먼저 무료 목소리. 모든 미리보기와 첫 번째 전체 컷을 무료 목소리로 음성 처리하십시오. 역할의 성별을 유지하십시오. 사용자가 무료 목소리 컷을 승인한 후에만 유료 목소리를 생성하십시오. 유료 패스를 위해 스토리보드에 각 비트의 tag를 유지하십시오.
5. 비디오가 어떤 브랜드를 사용하는지 사용자에게 물어보십시오: brands/<name>/의 프로필, 프로젝트 자체 디자인 또는 없음. 명백한 브랜드가 없는 비디오도 여전히 질문이 필요합니다. 답변을 in/brief.md에 기록하여 첫 번째 렌더링부터 카드와 팔레트가 그 답변에서 나오도록 하십시오.
6. 스토리보드를 사용자에게 보내십시오. 사용자가 승인하기 전에 이미지를 생성하지 마십시오.

2. 캐릭터

1. 캐릭터당 하나의 고정된 설명을 작성하십시오: 얼굴, 머리카락, 몸, 옷. 모든 이미지 프롬프트에 그대로 복사하십시오. in/characters.md에 보관하십시오.
2. 평평하고 단색인 배경에서 gen-image.py로 기본 그림을 생성하십시오. 프롬프트에 "바닥 그림자 없음, 광택 없음"을 추가하십시오.
3. --input을 사용하여 그 기본 그림에서 연기 포즈를 생성하십시오: 걷기, 앉기, 가리키기, 반응하기, 제스처, 돌아보기. 장면에는 서 있는 모습만이 아닌 포즈가 필요합니다.
4. 입 상태(닫힘, 열림, 크게 벌림)와 깜빡임을 만드십시오. 변경된 영역만 기본 그림에 붙여넣으십시오. 전체 편집된 이미지를 절대 사용하지 마십시오: 얼굴이 떠다닙니다.
5. cutout.py로 모든 포즈를 분리하십시오. 그림에는 isnet-anime을, 사진에는 u2net을 사용하십시오.
6. 모든 포즈를 동일한 1024 px 캔버스에 배치하여 포즈 변경에 오프셋이 필요 없도록 하십시오.
7. 모든 포즈의 콘택트 시트를 만드십시오(ImageMagick montage). 열어서 얼굴, 옷 또는 비율이 다른 포즈를 찾으십시오. 해당 포즈를 다시 생성하십시오. 이미지당 최대 3회 시도하십시오.

실제 인물: 해당 인물의 동의 없이 실제 인물을 그리거나 애니메이션화하지 마십시오. 먼저 물어보십시오.

• cutout.py --model u2net으로 얼굴을 분리하십시오. 원 안에 넣지 마십시오.
• 밝은 배경의 밝은 머리카락은 분리 시 사라집니다. 그런 경우 다른 사진을 사용하십시오.
• 턱 아래에서 목과 어깨를 페이드 아웃하고, 몸통과 함께 목을 그리십시오. 사진을 자르면 그 부분에 딱딱한 경계선이 생깁니다.
• 몸통은 코드(SVG 관절)로 그리십시오. 그러면 모든 포즈가 정확하고 얼굴이 떠다닐 수 없습니다.

3. 장면 및 소품

1. 각 장소를 캐릭터와 동일한 스타일로, 사람 없이 배경(--size 1536x1024)으로 생성하십시오.
2. 별도의 분리 레이어로 작용하는 소품(전화기, 티켓, 컵, 커튼)을 생성하십시오.
   • 모든 화면, 장치 및 패키지에서 브랜드 마크와 텍스트를 찾으십시오. "로고 없음" 프롬프트는 이를 방지하지 못합니다. ImageMagick으로 마크를 패치하십시오. 이미지-투-이미지 편집을 사용하지 마십시오: 잘못된 부분을 제거하고 마크를 유지합니다.
3. 시차 효과에 도움이 되는 곳에 전경 레이어를 생성하십시오: 좌석 줄, 난간.
4. 프로젝트에 브랜드 프로필이 있으면 사용하십시오. brand.css의 팔레트, images/의 로고 및 모토, fonts/의 글꼴을 가져오십시오. 브랜드 색상을 임의로 만들지 마십시오. 브랜드 형태에 대해 프로필의 NOTES.md를 읽으십시오.
5. 프로젝트에 아이콘 전용 그래픽이 없으면 MDI 아이콘(@mdi/js, 24×24 경로)을 사용하십시오. 손으로 아이콘을 그리거나 이모지를 사용하지 마십시오. 프로젝트 웹사이트가 이미 어떤 것에 MDI 아이콘을 사용하고 있다면 비디오에서 동일한 아이콘을 사용하십시오.

4. 목소리

1. 각 대사를 gen-speech.py와 화자당 동일한 --voice로 생성하십시오.
   • 사용자가 컷을 승인할 때까지 동일한 성별의 무료 목소리를 사용하십시오. 유료 모델에 대한 아래 참고 사항은 유료 패스에 적용됩니다.
   • scripts/regen-voices.py <model>을 실행하십시오. 요청(텍스트, 목소리, 모델, 설정 또는 동일 화자 이웃)이 변경된 경우에만 API에 대사를 보내므로 승인된 테이크는 유지됩니다. 하나를 수정하기 위해 모든 대사를 재생성하지 마십시오.
   • 의도적으로 대사를 다시 시도하려면 --fresh <beat or speaker>를 추가하십시오. 모든 테이크는 assets/voice/takes/에 보관됩니다. 이전 테이크로 돌아가려면 --restore <take>를 사용하십시오.
   • 캐시 이전에 만든 프로젝트에는 비트당 voice_key가 없습니다. --adopt와 함께 한 번 실행하거나, 첫 번째 실행이 모든 대사를 다시 생성합니다.
   • 표현력 있는 모델의 경우 각 대사 앞에 영어 오디오 태그(예: [warmly])를 하나 넣고 모델의 안정성, 유사성, 스타일 및 속도 노브를 설정하십시오. 태그가 없으면 대사가 평평하게 들립니다. 태그를 line 밖에 두십시오. 자막은 line을 표시하기 때문입니다: 비트의 tag 필드에 넣고 텍스트 앞에 보내십시오.
   • 오디오 태그를 문서화하지 않은 모델에는 사용하지 마십시오. 태그를 소리 내어 읽을 수 있습니다.
   • 모든 목소리에 대해 이름, 외국어처럼 보이는 단어 및 문자 코드를 먼저 나열하십시오. 언어 코드가 설정된 경우에도 목소리는 자신의 언어 방식으로 읽습니다. 먼저 단어의 음성 철자를 시도한 다음, 인라인 IPA를 시도하십시오. 철자당 세 개의 테이크와 하나의 제어 테이크를 만들고 사용자가 귀로 선택하도록 하십시오.
   • 소리를 대문자로 쓰지 마십시오. 목소리는 대문자를 개별 문자로 읽을 수 있습니다. 대신 단어로 소리를 쓰십시오.
   • 새 테이크는 모든 단어를 이동시킵니다. 인비트 프레임 오프셋(카메라, 하이라이트, 음향 효과)을 리터럴 프레임이 아닌 자막 범위 시작에 키잉하십시오. 새 테이크 후에 음성-텍스트 패스에서 단어 시간을 가져와 범위 시작만 재설정하십시오.
2. scripts/level-voices.py를 실행하십시오. 각 대사를 음성 크기로 레벨링합니다. 피크 레벨링만으로는 충분하지 않습니다: 대사가 6dB 이상 퍼질 수 있습니다.
   • 다른 언어 버전: 장면을 유지하고 동일한 소스에서 두 번째 컴포지션을 생성하십시오. 새 언어에 대해 동일한 비트 ID를 가진 자체 스토리보드, 자체 음성 폴더, 엔벨로프 및 음악 컷(check-audio.py의 STORYBOARD, VOICE_DIR, MUSIC)을 제공하십시오.
   • 새 목소리를 동일한 목표가 아닌 승인된 믹스의 음성 레벨로 레벨링하십시오.
3. 입 엔벨로프를 만들고 scripts/gen-envelopes.mjs로 번들링하십시오.

5. Remotion에서의 애니메이션

• 스테이징: 각 장면을 액션으로 연출하십시오. 캐릭터가 걸어 들어오고, 앉고, 반응하고 소품을 사용합니다. 소품을 자체 레이어에서 움직이십시오. 수정은 누락된 부분을 추가합니다. 원인을 보여주는 동작을 유지하십시오.
• 카메라: 모든 샷에서 푸시 인, 팬 또는 트래킹을 사용하십시오. 배경, 캐릭터 및 전경 사이에 시차를 사용하십시오. 프레임을 채워야 하는 각 레이어가 시차 깊이에서 프레임 내에 유지되도록 모든 카메라 움직임을 고정하십시오(회전 포함). 깊이가 1보다 작은 레이어는 카메라보다 덜 움직입니다: 풀아웃 또는 중앙에서 벗어난 팬은 프레임 가장자리를 드러내고 바닥 조각이 보입니다.
• 깊이: 바닥과 그 위에 서 있는 모든 것(의자, 사람, 소품)을 한 깊이의 한 레이어에 배치하십시오. 두 깊이는 모든 카메라 움직임에서 바닥과 의자 다리를 분리시키고 의자가 떠다닙니다. 게으른 고개 끄덕임은 의자가 아닌 앉은 선 위의 몸통을 회전시킵니다.
• 모션: 작은 오버슈팅이 있는 스프링을 사용하십시오. 움직임 전에 예비 동작을 사용하십시오. 두 포즈 사이의 하드 스왑을 절대 사용하지 마십시오.
• 게으른 상태: 호흡, 흔들림 및 깜빡임에 자체 주기와 위상을 부여하십시오.
• 입: 엔벨로프에서 구동하고 최소 3프레임 유지(스타터의 motion.ts에 있는 mouthStates).
• 화면 밖 내레이터: 내레이터의 얼굴 대신 엔벨로프를 따르는 파형 오브를 표시하십시오(스타터의 NarratorOrb.tsx).
• 조명: 이야기 도구로 조명을 사용하십시오. 예: 집 조명이 어두워지고, 휴대폰 화면이 얼굴에 빛을 비춥니다.
• 전환: 컷당 하나를 선택하십시오(매치 컷, 와이프, 하드 컷). 모든 컷에 하나의 페이드를 사용하지 마십시오.
• 하나의 캐릭터는 컷을 가로질러 하나의 객체로 유지됩니다. 캐릭터가 한 샷에서 다음 샷으로 이동할 때 이전 위치에서 새 위치로 화면에서 운반하십시오. 한쪽에서 나가고 다른 쪽에서 들어오는 캐릭터는 두 번째 캐릭터로 읽힙니다.
• 시청자가 알아차려야 하는 변경 사항은 음성에 자체 일시 정지를 얻습니다. 비트를 분할하고 그 후에 1.5–2초의 침묵을 추가하십시오. 그 일시 정지에서 변경 사항을 연출하십시오: 이전 상태 표시, 흐리게 처리, 크로스페이드, 다음 대사에서 새 상태 강조.
  • 문장 중단이 아닌 문장 경계에 일시 정지를 배치하십시오. 레벨로 간격을 찾으십시오: 단어 후 약 -38dB(피크 기준) 아래의 가장 긴 20ms 윈도우 실행을 가져와 중간에서 자릅니다. 음성-텍스트 단어 시간에서 간격을 가져오지 마십시오: 그들의 가장자리는 0.5초 차이가 날 수 있습니다.
• 자막 및 핵심 포인트 카드: 짧게 유지하십시오. 카드는 장면을 지원합니다. 절대 장면을 대체하지 않습니다.
• 프레임 — 모든 비디오에는 그것이 있습니다:
  1. 오프닝 타이틀 카드, 약 3초: 로고(해당되는 경우), 비디오 제목 및 한 줄의 짧은 텍스트. 음악만 있거나 무음일 수 있습니다.
  2. 클로징 슬라이드, 약 4초: 로고(해당되는 경우), 주장 또는 클릭 유도 문구, URL. 무음일 수 있습니다.
  3. 모서리 로고: 두 카드 사이의 전체 비디오에 대해 오른쪽 하단 모서리의 작은 로고. 오프닝 카드 후에 페이드 인하고 클로징 슬라이드 전에 페이드 아웃하십시오. 얼굴과 핵심 요소에서 멀리 유지하십시오.
  4. "해당되는 경우": 브랜드, 제품 또는 회사 비디오에는 로고가 있습니다. 개인 비디오에는 회사 로고가 없습니다. 여전히 타이틀 카드와 클로징 슬라이드를 얻습니다.
  5. 완성된 비디오에 프레임을 추가하려면 음성 시간을 조정하지 마십시오. 기존 컴포지션을 두 카드 사이의 <Series>에 넣으십시오. 카드는 시작과 끝에 침묵을 추가하며 이는 허용됩니다.
• 항상 브랜드 우선. 프로젝트에 브랜드 프로필이 있으면 사용하십시오: 프로필의 카드, brand.css의 팔레트, 실제 자산으로서의 로고 및 마크. 프로젝트에 실제 앱 스크린샷이 있으면 레이어로 사용하십시오: 실제 화면은 그려진 화면 근사치보다 낫습니다. 사람, 장소 및 소품만 그려집니다. UI, 로고 및 유형은 브랜드에서 옵니다. 프로필이 라이브 앱에 비해 명백히 구식이면 그렇게 말하고 앱을 사용하십시오.

6. 그림 확인

1. npx remotion still로 키 프레임에서 스틸을 렌더링하십시오.
2. 스틸을 엽니다. 카드나 자막이 가리는 얼굴, 프레임 가장자리가 자르는 캐릭터를 찾으십시오. 선택적 두 번째 의견: ADAPTERS.md는 REVIEW_IMAGE 명령을 설명합니다. 그 판정을 게이트가 아닌 리드로 취급하고 각 발견 사항을 프레임에서 확인하십시오.
3. 장면, 포즈 변경, 카메라 움직임 및 대화 교환이 있는 약 20초 샘플을 렌더링하십시오.
4. 각 포즈 변경 전후에 프레임을 추출하고...