Motion Replicate — 참조 링크에서 편집 가능한 AE 재구성까지
skill/SKILL.md의 "复刻参考片失败的五个根因" 및 "复刻参考片:先逐帧量,再动手" 섹션을 먼저 읽으세요.
규칙: 측정 후 구축(measure before build). 재구성의 모든 숫자는 참조에서 비롯됩니다.
1. 참조 가져오기
python3 tools/fetch_reference.py "<link>" --slug <short-name>
- Pinterest (pin.it 또는 /pin//): Pinterest의 공개 위젯 API를 통해 핀의 동영상을 다운로드합니다 (아이디어/스토리 핀 포함). 핀이 이미지만 있는 경우 도구가 이를 알리고 외부 링크를 출력합니다. 실제 모션은 보통 그 링크(Instagram 또는 Behance 게시물)에 있습니다. 해당 링크를 따라가세요.
- 직접 동영상 URL (.mp4/.mov/.webm/.gif): 그대로 다운로드합니다.
- Behance, Vimeo, YouTube, 포트폴리오 사이트: 명령줄 요청을 거부(exit code 3)하거나 플레이어를 임베드하는 경우가 많습니다. 이 경우 다운로드 대신 감시(Watch):
- 브라우저에서 프로젝트 페이지를 열고 플레이어를 나열합니다:
[...document.querySelectorAll('iframe,video')].map(n => n.src || n.currentSrc). - 플레이어 URL 자체(예:
https://player.vimeo.com/video/<id>)를 열고,tools/browser_frame_sampler.js를 브라우저의 JavaScript 도구에 붙여넣고await motionAgentSample({ fps: 12 })를 실행한 후 스크린샷을 찍습니다. 타임스탬프가 찍힌 연속 샷과 프레임별 모션 에너지를 얻을 수 있습니다.await motionAgentShowFrame(t)+ 스크린샷으로 위치 측정을 위한 전체 해상도 프레임 하나를 얻습니다. - 스크린샷과 반환된 JSON을
refs/<slug>/에 저장합니다.
- 브라우저에서 프로젝트 페이지를 열고 플레이어를 나열합니다:
- 로그인, 페이월, 봇 차단을 우회하지 마세요. 보호된 파일을 가져오기 위해 헤더를 스푸핑하지 마세요. 페이지가 차단되면 브라우저 경로를 사용하거나 사용자에게 클립을 다운로드하도록 요청하세요.
refs/ 아래의 모든 항목은 git에서 무시됩니다. 참조 동영상은 원작자에게 속합니다. 커밋하거나 프레임을 게시하지 마세요. 케이스에서 원작자에게 크레딧을 표시하세요(meta.json).
2. 측정
python3 tools/analyze_reference.py refs/<slug>/reference.mp4 --fps 24
refs/<slug>/ANALYSIS.md를 읽으세요: 크기, 프레임 속도, 지속 시간, 홀드, 컷, 가장 빠른 순간, 루프 여부, 팔레트, 연속 샷 및 모션 에너지 플롯. 그런 다음 frames/에서 각 움직이는 요소를 측정합니다 (픽셀 위치, 스케일, 회전 (시작, 끝 및 전환 지점에서). tools/measure.py가 도움이 됩니다). 짧은 명세를 작성합니다: 요소 → 키(시간, 값) → 속도 모양(이즈 인/아웃/둘 다, 오버슈트).
구축하기 전에 측정한 내용과 구축 방법을 3~5줄로 사용자에게 알려주세요.
3. After Effects에서 재구성
- 참조의 크기와 프레임 속도로 컴포지션을 만듭니다 (작은 참조의 경우 ×2 배율로 스케일링하고 그렇게 말합니다).
- 작업 중 뷰어에서 컴포지션을 열고 플레이헤드를 움직여 사용자가 볼 수 있게 합니다.
- 먼저 베지어 이징을 사용한 키프레임(측정된 속도 곡선을 재현하는 명시적인 속도/영향)을 적용하고, 키프레임으로 처리할 수 없는 경우에만 표현식을 사용합니다.
- 컴포지션 및 레이어 이름은 짧은 단어 하나씩 사용합니다.
- 구조적 변경 전에 백업을 저장합니다.
4. 비교 및 반복
참조 프레임과 동일한 타임스탬프를 렌더링하고 나란히 배치합니다:
python3 tools/sheet.py "<our frames glob>" refs/<slug>/compare.png --pair "refs/<slug>/frames/f_*.jpg"
타이밍(홀드와 컷이 같은 프레임에 위치하는지), 위치(같은 배율에서 몇 픽셀 이내), 속도 모양, 색상을 확인합니다. 가장 큰 불일치부터 먼저 수정하고 다시 비교합니다. 각 라운드를 비교 시트와 함께 보고합니다. 사용자가 만족할 때까지 반복합니다.
5. 배운 내용 유지
사용자가 렌더링을 확인하면 agent-skills/motion-retrospective를 실행합니다. 이 케이스는 원작자와 소스 링크에 크레딧을 표시하고, 우리의 재구성 프레임만 포함하며, 측정된 숫자와 이를 재현한 키프레임을 기록합니다.