Apple Design: 런칭 필름
이 스킬은 Apple 런칭 스팟 스타일의 30~35초 제품 필름을 제작합니다. 두 개의 완성된 필름이 함께 제공되며, 모든 새 필름은 그중 하나에서 시작합니다:
| 필름 | 스타일 | 용도 |
|---|---|---|
films/oto | 팝. 모든 비트에 따라 바뀌는 평평하고 채도 높은 색상 필드, 거대한 흰색 단어, 베이스에 맞춰 튀는 장난기 넘치는 제품, 120 BPM 하우스 트랙. | 소비자 가전, 스피커, 이어폰, 장난감, 재미있거나 다채로운 모든 것. |
films/vela | 시네마틱. 검은 무대, 스튜디오 조명의 금속, 블룸, 느린 카메라 움직임, 광선과 투영된 세계, 분해도, 100 BPM 점수. | 프리미엄 하드웨어, 카메라, 웨어러블, '엔지니어링된' 모든 것. |
렌더링 후 두 폴더 중 하나에서 out/sheet.jpg를 열거나 film.js를 읽어 모든 샷을 확인하세요. references/film-recipe.md는 필름이 어떻게 구성되는지 설명하고 재사용 가능한 샷 패턴을 나열합니다. 새 필름을 작성하기 전에 읽어보세요.
필름 작동 방식
films/<name>/index.html은 글꼴과 타입 스타일을 설정합니다.films/<name>/film.js는 Three.js 기본 요소로 제품을 만들고{ a, b, f(t, p) }시간 범위 목록인SHOTS를 정의합니다.renderAt(t)는 장면을 재설정하고 해당 초의 샷을 호출합니다. 모든 프레임은t의 순수 함수입니다:Date.now, CSS 애니메이션, 프레임 간에 전달되는 상태가 없습니다. 이것이 프레임 정확한 렌더링을 가능하게 하는 요소입니다.films/<name>/music.py는 numpy로 사운드트랙을 작곡하고out/score.wav를 작성합니다. Oto 버전은 또한env.json(킥 시간 및 프레임별 베이스 엔벨로프)을 작성하여 제품과 링이 실제 트랙에 반응하도록 합니다.render.mjs는 폴더를 제공하고, GPU를 사용하여 헤드리스 Chrome에서 프레임을 렌더링하며, MP4를 인코딩합니다.
새 필름을 위한 워크플로우
- 브리핑. 제품명, 제품이 무엇인지, 한 가지 놀라운 점, 3~5개의 실제 사실(단위 포함 숫자), 색상 또는 마감, 태그라인, 런칭 라인("Coming 2027")을 얻습니다. 사용자가 대략적인 아이디어만 제공하면 세련된 세부 사항을 창작하고 그렇게 말합니다. 최대 한 가지 질문을 합니다.
- 베이스 필름 선택(팝은 Oto, 시네마틱은 Vela)하고 복사합니다:
cp -r films/oto films/<name>(소문자, 공백 없음). 복사된out/폴더와env.json을 삭제합니다. - 먼저 비트 시트를 작성합니다. BPM(100
124)을 선택합니다. 마디 그리드에 811개의 샷을 배치하고(120 BPM에서 마디는 2초이므로 샷은 2, 4 또는 8초), 각 샷의 화면상 단어를 적습니다. 레시피의 아크를 따릅니다: 콜드 오픈 → 드롭 → 이름 → 하는 일 → 내부 → 하나의 숫자 → 라인업 → 침묵 → 엔드 카드. 사용자가 검토를 요청한 경우에만 짧은 표로 보여주고, 그렇지 않으면 계속 진행합니다. film.js에서 제품을 모델링하고makeOto/makeDevice를 대체합니다.MeshPhysicalMaterial(클리어코트, 광택, 금속성)과 함께 선반 프로파일, 구체, 토러스, 둥근 상자로 제품을 만들고, 그릴, 화면 및 라벨용 캔버스 텍스처를 추가합니다. 샷이 호출할 수 있는pose(...)또는setFinish(...)함수를 제공합니다. 레시피의 모델링 섹션을 참조하세요.- 샷과 타입을 다시 작성합니다:
SHOTS,CAPS, 라벨, 라인업 이름, 엔드 카드. 비트 경계에서 컷을 유지합니다. 이미 있는 도우미를 재사용합니다(showWord,showRings,drawField,panels,cam, 컷어웨이 리그, 라벨 지시선). - 복사된
music.py를 편집하여 음악을 작곡합니다: BPM, 키 또는 코드 목록, 각 섹션이 해당 샷과 일치하도록 배열 블록을 설정합니다(공개 시 히트, 컷어웨이 시 브레이크다운, 엔드 카드 전 침묵). 필름이env.json을 사용하는 경우kick_times와 엔벨로프 내보내기를 유지합니다. - 스틸을 확인한 후 렌더링(스킬 폴더에서 실행):
python3 films/<name>/music.py node render.mjs <name> sheet # 8 프레임 → films/<name>/out/sheet.jpg node render.mjs <name> stills 4.2,9,17 # 정확한 초 node render.mjs <name> final # → <Name>_Launch_Film.mp4 (음악 포함)final은 34초 분량에 약 3~8분이 소요됩니다. 빠른 드래프트에는final 30을 사용합니다. - 전달. 최종 MP4 경로와 연락처 시트를 제공하고, 각 샷을 한 줄씩 나열하며, 특정 조정(복사, 색상, 타이밍, 음악)을 제안합니다.
설정 (한 번만)
cd ~/.claude/skills/apple-design && npm install
python3 -m pip install numpy scipy # 또는 venv 사용
Google Chrome과 ffmpeg가 필요합니다. Chrome이 일반적이지 않은 위치에 있으면 CHROME_PATH를 설정하세요.
품질 기준
- 모든 컷과 모든 단어는 트랙의 비트 그리드에 정확히 맞아야 합니다. BPM에 대해
a/b시간을 확인하세요. - 샷당 하나의 아이디어. 캡션 ≤ 7단어, 거대한 단어는 1단어.
- 제품의 형태를 읽을 수 있을 만큼 조명이 잘 들어와야 함: 키 라이트, 림 라이트, 부드러운 접촉 그림자, 금속의 환경 반사.
- 이 제품만 가질 수 있는 최소 하나의 샷(Oto의 컷어웨이와 "louder lifts it higher", Vela의 벽, 테이블 및 천장).
- 엔드 카드에는 이름, 하나의 태그라인 및 런칭 라인이 포함되고, 마지막 음표에서 페이드 아웃되어야 함.
- 매번 최종 렌더링 전에 연락처 시트를 확인하세요.
가드레일
"Apple 스타일"은 외형입니다. Apple의 로고, 제품 이름, 상표, SF Pro 파일 또는 실제 Apple 영상을 사용하지 마세요. 여기서 사용되는 글꼴은 Inter 및 Inter Tight입니다. 사용자가 콘셉트 작품을 요청한 경우에만 제품 이름과 사양을 만들고, 콘셉트라고 표시하세요.