動態圖形
addHtmlElement 用於設計容器與佈局；文字與標題指令則用於純文字內容。
工作流程
- 可能已有現成元件可用：
addMotionComponent可新增一個可編輯、時間軸驅動的圖形，順應影片方向，且無需生成成本（使用setMotionComponent變更其文字；以searchCatalogue kind 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 kind commands搜尋確切 idaddHtmlElement，並在撰寫標記前閱讀其完整作者合約。 - 根據內容與空間決定尺寸： 讓文案與可用區域決定大小、樣式與位置。下三分之一不一定需要深色面板；統計資料不一定需要漸層卡片。
- **在時間軸時鐘上製作動畫，**使用支援的時間軸驅動動畫合約。壁鐘 CSS 動畫並非時間軸播放，無法匯出。
- 容器與物件： 對一個 HTML 剪輯進行變換會移動其整個合成內容，而非其子元素。若要移動內部的物件，請讀取該剪輯的 HTML 並在時間軸上對預期的子元素設定動畫，或使用獨立的真實剪輯。將附屬細節保留在同一個移動容器中。
- 自訂元件： 當腳本功能可用時，TSX 動態元件可透過
agentWorkspace動作motion_compile（工作流程motion-authoring）編譯。 - 驗證 在多個時間點的渲染影格上檢查物件位置。僅靠攝影機縮放無法滿足物件動作。
注意事項
- 內聯 SVG 需要
xmlns，否則會靜默渲染為零像素。 - 繪製全畫面實色背景的 HTML 元素會在其整個持續時間內隱藏底層所有內容；請將根元素設為透明。
- 若使用者表示某項變更未出現，請檢查已儲存的結果並變更實際機制，而非重複相同的關鍵影格。
- 設計好的 UI、圖表與程序化圖形無需付費圖像生成即可展示工作流程。
相關技能：titles、text-led-video。專家：motion-designer。