Communitygithub.com

syahdestiny/soundtrack

애니메이션에 어울리는 코드 기반 음악을 합성하고, 장면 전환이 비트에 맞춰지며 갑작스러운 소리 변화가 없도록 자동 점검합니다.

soundtrack란 무엇인가요?

이 스킬은 애니메이션 영상을 위한 맞춤형 사운드트랙을 코드로 합성하고, 오디오가 영상의 컷과 정확히 동기화되도록 보장합니다. Web Audio API를 사용하여 오실레이터, 노이즈, 필터 등으로 독창적인 악기와 리듬을 만들며, 각 영화마다 고유한 사운드를 가질 수 있도록 템플릿(`templates/groove.js`, `templates/score.js`)이 제공됩니다. 또한 `OfflineAudioContext`를 통해 오프라인으로 렌더링하여 WAV 파일을 생성하고, `render.mjs`가 이를 MP4로 먹싱합니다. 주요 기능으로는 템포 맵을 이용해 각 장면이 전체 마디 수에 맞춰지도록 하고, 컷에서 갑작스러운 큰 소리(스타트)가 발생하지 않도록 체계적으로 조정합니다. 동기화 검사(`scripts/sync-check.mjs`)는 컷이 비트에서 ±100ms 이상 벗어나거나 이전 구간보다 +6dB 이상 큰 소리가 나는 경우를 잡아내어, 사용자가 직접 수정할 수 있도록 안내합니다. AI 생성 음악이나 사용자 제공 트랙도 지원하지만, 기본적으로는 코드 합성 방식을 권장하며 현실적인 보컬이나 오케스트라는 제한됩니다.

지원 대상~Claude Code~Codex CLI~Cursor
npx skills add https://github.com/syahdestiny/skill-motion-javascript/tree/HEAD/skills/soundtrack

즐겨 사용하는 AI에게 물어보기

이 에이전트 스킬이 미리 로드된 새 채팅을 엽니다.

문서

사운드트랙

이 영화의 사운드 쓰기

영화의 사운드는 그 영화만을 위해 작성됩니다. 고유의 악기, 리듬, 화성을 Web Audio로 만들어내며, window.SCORE = ac => { … } (오실레이터, 노이즈, 필터, 엔벨로프, 딜레이 등 곡에 필요한 모든 것) 형태로 작성됩니다. 드럼, 그루브, 뮤직박스 배경음도 같은 방식으로 이 영화만을 위해 작성됩니다. 어떤 두 영화도 같은 템플릿을 공유하지 않아야 합니다. templates/groove.js와 templates/score.js는 두 가지 미리 준비된 스코어로, 사용자가 요청할 때만 사용됩니다. 각 파일에는 옵션이 문서화되어 있습니다.

render.mjs(javascript-animation 스킬에서 제공)는 OfflineAudioContext를 사용하여 window.SCORE를 오프라인으로 렌더링하고, <out>.wav 파일을 생성한 뒤 MP4로 먹싱합니다. 페이지의 실시간 미리보기를 클릭하면 동일한 스코어가 재생됩니다.

사용자에게 처음부터 음악 소스를 선택하도록 요청하지 마세요. 결과물을 전달할 때 한 줄로 AI 생성 음악이나 사용자 제공 트랙도 사용할 수 있다고 언급하세요.

음악이 영상과 일치하는 방법

  • 템포 맵. 각 장면은 정수 마디 수를 갖도록 합니다(템포는 장면별로 유연하게 조정 가능). 따라서 모든 컷이 다운비트에서 이루어집니다.
  • 컷을 볼륨이 아닌 화성으로 표시하세요. 각 장면은 딸림화음(dominant)으로 마무리되고, 컷은 으뜸화음(tonic)에서 시작됩니다. 컷에서 큰 소리(베이스 + 밝은 차임 동시)는 갑작스러운 놀람(jump scare)으로 읽힙니다. 사용자들은 +710dB 점프를 놀라운 것으로 보고했습니다. 하지만 +35dB의 화성 변화는 깔끔한 편집으로 읽힙니다.
  • 첫 번째 컷 전에 한 마디만 있다면 도입부를 얇게 만들지 마세요. 드문 도입 후 풀 텍스처가 갑자기 등장하면 그 자체로 놀람이 됩니다.
  • 컷의 다운비트에 추가 강조를 넣지 마세요. 일반 다운비트 강조(더 강한 베이스 + 첫 음)조차도 직전 마디가 작아지고 있기 때문에 짧은 작품에서 +6dB를 초과할 수 있습니다. 화성 변화만으로 충분합니다.
  • 장면 내 하드 컷도 포함하세요. 이를 window.CUES에 넣어서 같은 다운비트 처리가 적용되도록 하세요.
  • 눈이 잡을 단서를 제공하세요. 타악기가 없는 레가토 음악은 컷이 맞춰질 악센트가 없습니다. 꾸준한 그루브가 있는 경우 악센트는 리듬의 일부가 되며 놀라움을 주지 않습니다(검사는 고립된 조용한 순간이 아닌 최근 몇 초와 비교합니다).
  • 레이어는 한 번에 하나 또는 두 마디씩 추가하세요. 조용한 도입 후에 킥과 베이스가 동시에 들어오면 +11dB(놀람)로 측정되었습니다. 한 마디 간격으로 늦추면 +3.5dB입니다.
  • 브레이크를 사용하세요. 결정적 순간 전에 한 마디 동안 모든 소리를 없애는 것은 단편에서 가장 강력한 비트가 됩니다. sync-check는 침묵 속으로의 컷을 비트에 맞는 것으로 인정합니다.

다른 음원 (요청 시에만)

  • AI 생성 음악(예: OpenRouter를 통한 Lyria): references/ai-music.md 참조.
  • 사용자 제공 트랙: ffmpeg로 먹싱.

제어할 수 없는 음악의 경우 방향을 반대로 합니다. 영상이 음악을 따르게 합니다. 렌더링, 먹싱, 검사 실행 후, 보고된 오프셋만큼 페이지의 SCENES 테이블에서 장면 경계를 이동시키고 다시 렌더링합니다. 각 장면 함수가 로컬 시간(자신의 시작점에서 0)을 받기 때문에 이 작업은 저렴합니다. 경계를 이동해도 장면 코드를 건드리지 않습니다.

항상: 확인하기

node scripts/sync-check.mjs piece.mp4 --cues-file piece.cues.json   # 선호: 선언된 CUES 확인
node scripts/sync-check.mjs piece.mp4                       # 대체: 영상에서 컷 감지 (빠른 카메라 움직임이 컷으로 읽힐 수 있음)

각 이벤트에 대해 가장 가까운 강한 오디오 시작점까지의 오프셋과 그 시작점으로 들어갈 때의 볼륨 점프를 출력합니다. OFF-BEAT(±100ms, 약 3프레임 초과) 또는 STARTLE(+6dB 초과, 직전 1초 대비)이면 실패합니다. 시작되는 첫 1초와 마지막 페이드아웃은 건너뜁니다(비교할 '이전'이 없고, 페이드아웃은 컷이 아닙니다). '강한'은 ±2초 내의 시작점 중에서 두드러진 것을 의미하므로, 조용한 구간의 악센트도 여전히 집계됩니다. 침묵 속으로의 컷은 맞춰진 것으로 간주합니다. 브레이크 후 음악이 돌아올 때는 마지막 4초의 일반적인 레벨과 비교합니다. 오디오 스트림이 없는 비디오는 그렇게 보고됩니다. 모든 컷과 확인하려는 장면 내 히트(샷 내부의 하드 컷, 개그의 충격)를 window.CUES에 넣으세요. 수정하고 다시 실행하여 통과할 때까지 또는 남은 모든 STARTLE이 의도적인 '스팅거'로 이름을 붙일 수 있을 때까지 반복하세요(코미디 충격은 튀어나오도록 의도된 것입니다. 자장가 컷은 그렇지 않습니다).

한계

코드로 합성 가능: 뮤직박스, 피아노 비슷한 플럭, 패드, 벨, 부드러운 타악기는 괜찮습니다. 현실적인 보컬, 오케스트라, 장르 음악은 불가능합니다. 그런 경우 AI 음악이나 실제 트랙을 사용하세요.

Individual skills in this repo

This repo contains 1 individual skill — each has its own dedicated page.

관련 스킬