모션 그래픽은(는) 무엇을 하나요?
addHtmlElement는 디자인된 컨테이너와 레이아웃을 위한 명령어이며, 텍스트 및 캡션 명령어는 일반 단어를 위한 것입니다.
워크플로우
- 기성 컴포넌트가 이미 적합할 수 있습니다:
addMotionComponent는 생성 비용 없이 비디오 방향에 맞춰 편집 가능하고 타임라인 기반 그래픽을 추가합니다 (setMotionComponent로 텍스트 변경 가능;searchCatalogue종류elements에서 컴포넌트 검색: reveal-title, speaker-card, progress-ring, feature-spotlight, stat-counter, keyword, checklist, chat-bubbles, search-bar, proof-card, icon-card, quote-card). 화자가 말하는 내용에 따라designInserts는 이를 대본과 대조하여 배치합니다. 어느 것도 맞지 않을 때만 HTML을 직접 구축하세요. - 먼저 계약서를 읽으세요:
searchCatalogue종류commands에서 정확한 idaddHtmlElement를 검색하고 마크업을 작성하기 전에 전체 작성 계약서를 읽으세요. - 콘텐츠와 공간에 따라 크기 결정: 복사와 가용 영역에 따라 크기, 스타일 및 배치를 결정하세요. 하단 3분할 패널이 항상 어두운 패널일 필요는 없으며, 통계가 항상 그라데이션 카드일 필요는 없습니다.
- 타임라인 시계를 기준으로 애니메이션: 지원되는 타임라인 기반 애니메이션 계약을 사용하세요. 벽시계 CSS 애니메이션은 타임라인 재생이 아니며 내보내지지 않습니다.
- 컨테이너 대 객체: 하나의 HTML 클립에 변환을 적용하면 해당 구성 전체가 이동하며, 하위 요소는 이동하지 않습니다. 내부 객체를 이동하려면 해당 클립의 HTML을 읽고 의도한 하위 요소를 타임라인에서 애니메이션하거나 별도의 실제 클립을 사용하세요. 첨부된 세부 정보는 동일한 이동 컨테이너에 유지하세요.
- 사용자 지정 컴포넌트: TSX 모션 컴포넌트는 스크립팅이 가능할 때
agentWorkspace액션motion_compile(워크플로우motion-authoring)을 통해 컴파일됩니다. - 검증: 렌더링된 프레임에서 여러 시간 지점에 객체 위치를 확인하세요. 카메라 줌만으로 객체 동작을 만족시킬 수 없습니다.
주의사항
- 인라인 SVG에는
xmlns가 필요합니다. 그렇지 않으면 조용히 0픽셀로 렌더링됩니다. - 전체 프레임 배경을 칠하는 HTML 요소는 해당 지속 시간 동안 아래 모든 것을 가립니다. 루트를 투명하게 만드세요.
- 사용자가 변경 사항이 없다고 말하면 저장된 결과를 검사하고 동일한 키프레임을 반복하는 대신 실제 메커니즘을 변경하세요.
- 디자인된 UI, 다이어그램 및 절차적 그래픽은 유료 이미지 생성 없이 워크플로우를 표시할 수 있습니다.
관련 스킬: 제목, 텍스트 중심 비디오. 전문가: 모션 디자이너.