MediaStorm 모션 그래픽
모션을 사용하여 정보를 명확히 하고, 시선을 유도하며, 안정적인 프레임 그리드 위에 변화를 정착시킵니다. 이 스킬은 서로 관련이 있지만 구별되는 네 가지 작업(매개변수 애니메이션, 포인트 추적 레이블, 숫자 플래시, 타이머/패키지 빌드)을 다룹니다.
사용 시기
- 푸시인, 팬 또는 컴포지션 변경에 스케일/포지션 키프레임과 이징이 필요한 경우.
- 레이블이 원하지 않는 스케일이나 원근을 상속받지 않고 움직이는 피처를 따라가야 하는 경우.
- 숫자, 가격, 카운터 또는 타이머가 빠르게 변경되고 가독성을 유지해야 하는 경우.
- 패키징 요소에 진입/퇴장 애니메이션, 마스크 윈도우 또는 프리셋이 필요한 경우.
- 모션 디자인을 Remotion에 전달하거나 TypeScript로 구현해야 하는 경우.
이 스킬을 평면 트래킹(mediastorm-컴포지팅-트래킹으로 라우팅), 키잉/마스크, 컬러 그레이딩 또는 스토리 순서에는 사용하지 마십시오.
설정할 입력값
- 정보 제공 작업: 시청자가 무엇을 주목하고, 읽고, 이해해야 합니까?
- 시작/종료 컴포지션, 정확한 동작 시간, 프로젝트 프레임 속도.
- 대상: 세그먼트-로컬 매개변수, 추적된 레이블, 숫자 플래시 또는 타이머.
- 모션이 장식적인지 아니면 의미를 전달하는지; 장식적이라면 그 이유는 무엇입니까?
- 출력 프레임 속도와 최종 모션이 일반 속도로 평가될지 여부.
워크플로우
- 키프레임을 추가하기 전에 목적과 정확한 동작 시간을 정의하십시오. 푸시인은 '더 크게 만들기'가 아닌 대상 컴포지션이 있어야 합니다.
- 키프레임 값을 세그먼트-로컬로 취급하십시오. 미디어를 분할하거나 교체하면 공유된 것처럼 보였던 매개변수가 재설정될 수 있습니다 [코스 증거][08 01:00–02:40].
- 푸시인의 경우 스케일과 포지션을 의도적으로 결합하십시오. 코스의 모바일-푸시 예제는 스케일
286%, 포지션 X0, Y-2219에서 종료됩니다. 시작은 스케일100%, 포지션0/0입니다. 354% 및 214% 값은 중간 드래그 값이지 최종 프리셋이 아닙니다 [샘플 스틸][08 05:58.5 / 06:22.5]. - 키프레임 속도 곡선 패널을 열고 세 가지 곡선(스케일, 포지션 X, 포지션 Y)을 모두 검사하십시오. 패널 범위는 스케일
4.00–0.00, X768–-768, Y432–-2160입니다. 기본값은 선형입니다 [샘플 스틸][08 07:59.0 / 08:20.5]. - 이징을 일관되게 적용하십시오. 코스 프리셋 목록은
无 / 缓入 / 二次方缓入 / 三次方缓入 / 缓出 / 二次方缓出 / 三次方缓出 / 缓动 / 二次方缓动 / 三次方缓动 / 回弹展开 / 线性(없음 / 이즈 인 / 2차 이즈 인 / 3차 이즈 인 / 이즈 아웃 / 2차 이즈 아웃 / 3차 이즈 아웃 / 이즈 인-아웃 / 2차 이즈 인-아웃 / 3차 이즈 인-아웃 / 바운스 아웃 / 선형)입니다. 데모는 세 곡선 모두에 대해 2차 이즈 인을 선택합니다 [샘플 스틸][08 09:18.5]. - 포인트 추적 레이블의 경우 안정적이고 대비가 높으며 보이는 상태를 유지하는 피처를 선택하십시오. 레이블이 상속해야 하는 차원만 활성화하십시오. 코스는 08:26에
缩放/距离(스케일/거리)를 끄므로 텍스트는 포지션만 따릅니다 [샘플 스틸][12 08:24–08:26]. - 트래킹 전에 사용하지 않는 푸티지를 다듬으십시오. 전체 클립을 트래킹하면 계산이 낭비되고 레이블 제어가 어려워집니다 [코스 증거][12 09:19–10:57].
- 숫자 플래시의 경우 프레임 그리드에 짧은 텍스트 세그먼트를 빌드하십시오. 코스의 디자인 단위는 세그먼트당 약 2프레임이지만, 완성된 프레임 그리드는 첫 번째 실행에서 8개 값/15프레임(약 0.50초), 두 번째 실행에서 6개 값/11프레임(약 0.37초)을 보여주며 각 값은 1~3프레임 동안 유지됩니다 [샘플 스틸][12 12:48–14:35]. '2프레임'을 문자 그대로의 결과로 반복하지 말고 완성된 그리드를 확인하십시오.
- 타이머/패키지의 경우 구조를 명시적으로 빌드하십시오: 검은색 화면 소스, 직사각형 마스크, 모서리 반경, 선, 그림자, 불투명도, 반복되는 배경 블록, 텍스트 숫자, 그림자, 진입 애니메이션 및 오프셋 래더. 코스 타이머는
538×540마스크, 반경 27, 흰색 선 2, 그림자100/19/0/0, 이미지 불투명도 45%, 텍스트 크기 15, 텍스트 스케일 134%, 텍스트 그림자45/16/0/0을 사용합니다 [샘플 스틸][15 16:30–19:47]. - 진입 및 퇴장 애니메이션을 일관된 스타일, 포지션 및 패키지에 도움이 될 때만 약간의 오버랩과 함께 쌍으로 구성하십시오. 코스는 약
0.4초패널 설정에서 위쪽 퇴장/진입을 쌍으로 구성합니다. 프리뷰에서 보이는 오버랩은 약 5프레임(약 0.17초)입니다 [샘플 스틸][12 14:35–17:29]. - 폐색, 안전 영역, 가독성, 인접 애니메이션 및 전환이나 오버레이가 테스트 대상을 불순하게 만드는지 확인하십시오.
- 실제 플레이어에서 일반 속도로 검증하십시오. 정지 프레임으로는 이징 느낌, 숫자 가독성 또는 트래킹 안정성을 증명할 수 없습니다.
의사 결정 규칙
- 모션에 정보 제공 작업이 없으면 제거하십시오. '역동적으로 보임'은 작업이 아닙니다.
- 스케일과 포지션을 함께 애니메이션하는 경우 시작/종료 시간을 맞추고 두 곡선을 모두 확인하십시오. 선형 포지션 이동 옆에 있는 스케일 전용 이즈는 두 개의 이벤트로 읽힙니다.
- 키프레임 마커가 세그먼트에서 단색으로 보이더라도 매개변수 행을 검사하십시오. 코스의 06:22.5 뷰는 빈 스케일 다이아몬드와 단색 포지션 다이아몬드를 보여주며, 이는 프리셋이 아니라 확인해야 할 충돌입니다 [확인 보류 중].
- 추적 레이블의 경우 포지션 전용이 기본값입니다. 레이블이 깊이를 상속해야 하는 경우에만 스케일/거리를 추가하십시오.
- 숫자 플래시의 경우 정수 프레임 계산을 사용하고 최종 값을 읽을 수 있을 만큼 충분히 오래 유지하십시오.
- 타이머/패키지가 프리셋을 사용하는 경우 프리셋과 프로젝트 프레임 속도를 기록하십시오. 다른 크기로 저장된 프리셋은 맞지 않을 수 있습니다.
- 모션 효과가 프록시 프리뷰에서만 보이는 경우 승인하지 마십시오. 인터페이스/내보내기를 확인하십시오.
CapCut 실행 참고 사항
capcut keyframe은 배치와linear/ease-in/ease-out/ease-in-out/hold를 지원합니다. 이징은 동일한 속성의 인접 키프레임이 필요하고, hold는 다음 키프레임이 필요합니다.- 이전에 확인된 macOS 경로에서는 알파 키프레임이 안정적인 페이드 메커니즘이 아닙니다. 적절한 경우 애니메이션 자료 또는
image-anim을 사용하십시오. add-text,image-anim및text-anim에는 CLI 계약이 있지만 시각적 결과는 여전히 CapCut의 승인이 필요합니다.- 추적 레이블의 경우 코스는 텍스트/트래킹 패널을 사용합니다. CLI 키프레임이 CapCut 트래킹 솔버와 동일하다고 가정하지 마십시오.
Remotion / TypeScript 어댑터
interpolate+Easing.bezier/Easing.spring으로 값을 구동하고useCurrentFrame()및useVideoConfig().fps를 읽으십시오.- 직사각형/원/별에는
@remotion/shapes, 텍스트 측정/맞춤에는@remotion/layout-utils, 블러에는@remotion/motion-blur를 사용하십시오. - 숫자 플래시:
Math.floor(frame / framesPerValue)에서 현재 값을 파생시킨 다음 프레임 그리드에서 최종 값을 유지하십시오. - Remotion에는 포인트 트래킹 패널이 없습니다. 외부 데이터에서 추적된 좌표를 변환에 공급하십시오.
실패 조건
- 동작 시간을 알 수 없고 키프레임이 감각에 따라 배치된 경우.
- 스케일과 포지션 곡선이 일치하지 않는 경우.
- 트래킹 레이블이 의도치 않게 스케일이나 원근을 상속받는 경우.
- 숫자 플래시가 밀리초 단위로 설계되어 편집 과정에서 표류하는 경우.
- 최종 값이 읽을 수 있을 만큼 충분히 오래 유지되지 않는 경우.
- 타이머 패키지가 크기/프레임 속도를 확인하지 않고 프리셋으로 빌드된 경우.
- 모션이 정지 프레임이나 프록시 프리뷰에서 승인된 경우.
승인 체크리스트
- 모션에 명시된 정보 제공 작업이 있습니다.
- 시작/종료 컴포지션 및 동작 시간이 기록되었습니다.
- 스케일/포지션 곡선이 정렬되고 일관되게 이징이 적용되었습니다.
- 추적된 레이블은 의도된 차원만 사용합니다.
- 숫자 플래시가 프레임 그리드에 있습니다. 최종 값이 유지됩니다.
- 타이머/패키지 형상 및 텍스트가 대상 크기에서 확인되었습니다.
- 폐색, 안전 영역 및 인접 애니메이션이 확인되었습니다.
- 결과가 CapCut/내보내기에서 일반 속도로 시청되었습니다.
출력 계약
반환: 모션 작업, 정확한 키프레임 타이밍, 매개변수 값, 이징 선택, 트래킹 차원, 프레임 그리드 계산 및 확인된 사항과 아직 확인되지 않은 사항. 코스 프리셋을 보편적인 기본값으로 제시하지 마십시오.
코스에서 파생된 패턴, 실패 확인 및 시간 코드는 참조/모션-디자인.md를 읽으십시오.