Template centerUpdated Nov 2, 2026

科技办公类解说 · AI Office Explainer Kit

Innovation

AI/科技/办公类知识解说图形包:30 种场景(13 种参考重建 + 17 种原创同风格),按句子类型自动选场景,支持叠化转场(缩放模糊/擦除/翻转/白闪等)、程序化音效、真人口播帧序列接入。全部图形代码绘制,演示数据为虚构示例。1920×1080 / 30fps。

Share
Full template

A cohesive set of composable animation and motion components for creating an entire video around your content.

PREVIEWdefault1920×1080 · 30fps
Free template

Free download. Open source. Make it yours.

Free to download, with no top-up required. Reuse and customize it: replace text, images and audio, and adjust visuals and animation.

  • Free assets and musicImage, video and sticker search plus 1,000+ music tracks your AI assistant can match.Asset guide →
  • Optional generationImage, voice and video generation are optional and billed separately.Creator API →
  • First time?Follow the tutorial from template to finished video.Open tutorial →

Template code follows the license on this page; fonts, images and music keep their own licenses. Free asset services have a daily allowance.

About this template

1920×1080 · 30fps · html-canvas/1。30 种场景,按 scenes[] 顺序拼接;type 可写场景名或句子类型(经 sentenceTypeMap 映射)。场景之间默认 transition(zoomBlur 0.4s),单个 scene 可用 transition 覆盖:cut / fade / wipeUp / slide / flash / flip / zoomBlur(叠化期间前后两个场景同时运动)。

句子类型 → 场景

| 句子类型 | 场景 | 来源 | 主要参数 | |---|---|---|---| | opening | dark_title_cups 发光打字 + 低多边形杯子群 | 参考重建 | title, cups[3]{text,color}, cupsAt, cps | | keyword | light_type 浅色像素底打字 | 参考重建 | title, cps, size | | ecosystem | icon_orbit 图标环 | 参考重建 | count | | data_compare | stat_compare 双数字对比 | 参考重建 | left{value,unit}, right{name,value,unit}, rightAt | | capability | card_flip 三色能力卡翻页 | 参考重建 | items[{title,color:purple/light/dark,tag}], tags[] | | judgment | code_cloud 代码云 + 像素人 + ✔✘ 牌 | 参考重建 | cards[{text,ok}], cardAt | | people | photo_wall 头像墙 + 快讯条(抽象头像) | 参考重建 | name, seed, ticker[], tickerLabel | | talk | talking_head 暗场桌面口播 | 参考重建 | badge;host 帧序列 | | demo | screen_card 软件窗口卡 + 主持人 PiP | 参考重建 | title, heading, hlAt, hlRow, dark | | story | robot_scene 代码绘制机器人插画 | 参考重建 | caption, robots[{x,s,color}] | | montage | rapid_cuts 快闪多切 | 参考重建 | words[], every | | emphasis | glow_word 紫色发光大字 | 参考重建 | word, size | | outro | ending_lineup 米色底大字 + 像素小人排队 | 参考重建 | words[2], count, footer | | ranking | ranking 排行榜 | 原创 | title, items[{name,value}], unit, dark | | timeline | timeline 时间线 | 原创 | title, events[{date,text}] | | process | steps 步骤流程 | 原创 | title, steps[] | | quote | quote 引用卡 | 原创 | text, source | | compare | compare_grid 工具对比表 | 原创 | title, cols[], rows[{label,vals[]}], highlight | | trend | chart 柱状+折线图 | 原创 | title, values[], labels[], unit, dark | | checklist | checklist 清单打勾 | 原创 | title, items[{text,done}] | | chapter | chapter 章节分隔 | 原创 | num, title, kicker | | share | donut 环形占比图 | 原创 v0.3 | title, center, parts[{name,value}], highlight | | location | map_pins 抽象点阵地图 + 定位针 + 虚线航线 | 原创 v0.3 | title, pins[{label,x,y}](x/y 为 0–1 画面比例) | | dialogue | chat 聊天气泡对话(AI 端带输入中动画) | 原创 v0.3 | title, messages[{from:me/ai,name,text}] | | before_after | before_after 左右分屏对比 + 滑块 | 原创 v0.3 | title, before{label,items[]}, after{label,items[]} | | kpi | kpi_tiles 数据看板卡片 | 原创 v0.3 | title, tiles[{label,value,unit,decimals,delta,spark[]}] | | pros_cons | pros_cons 优缺点两栏 | 原创 v0.3 | title, pros[], cons[], prosLabel, consLabel | | faq | faq 问答手风琴 | 原创 v0.3 | title, items[{q,a}] | | reveal | countdown 倒数 + 数字揭晓 | 原创 v0.3 | from, value, unit, decimals, caption | | mindmap | mindmap 思维导图生长 | 原创 v0.3 | center, branches[{name,leaves[]}] | 所有原创场景支持 dark:true 切到暗绿点阵底。

全局参数

canvas · theme{font, accent, ca2, icons[], darkBg, darkDot, disc, lightBg, lightDot, board, logo} · mark{enabled,text}(自有角标)· subtitles · transition · sentenceTypeMap · host{framePattern,frameCount,fps}(null=剪影占位)· duration(可选,按比例缩放所有 scene)。

渲染

环境:Node 20+、playwright-core 1.58(cd src && npm ci)、Chromium headless shell、ffmpeg、python3+numpy、Noto Sans CJK SC。

node src/render.js presets/demo.json out.mp4 --stills 3,20,40      # 静帧
src/render_parallel.sh presets/demo.json out.mp4 4                 # 并行整片(4 进程)
src/render_parallel.sh presets/new9.json out.mp4 4                 # 仅 v0.3 新增 9 场景

来源与许可

参考重建:动效节奏参考一段公开科技解说视频,未使用其素材、Logo、频道名或人物;厂商标识、App 图标、看板 Logo、人物、机器人均为原创代码绘制,演示数据为虚构示例。音效 numpy 合成。许可:草稿占位,待模板所有者决定(licenses/TEMPLATE-LICENSE.txt)。

Developer resources

给 AI 的说明

  1. 依次读 motion.json → 本文件 → guide.json → params.schema.json;先读数据,不直接执行包内代码。
  2. 在新实例写 inputs.json(以 presets/demo.json 为起点),每句文案一个 scene,dur = 该句时长;subtitles[] 句级。
  3. 数字/人物/截图须有真实来源;示例数据保留“虚构示例”。不得加入真实人物肖像或第三方 Logo。
  4. 先渲 --stills 给用户确认,再渲整片。

What you can replace

ParameterDescriptionTypeConstraintsDefault
canvasRequired—object——
themeRequired—object——
mark—object——
subtitles—array——
scenesRequired—array——
durationoptional total; scenes scaled proportionallynumber≥ 3,≤ 600—
transition————
sentenceTypeMap—object——
host—objectnull——

Update history

Improvements, fixes and remaining issues in each release.

Update this template with your AI assistant

Give the old template to the assistant and send the following sentence. The new version is saved as a separate file, and the old packages and projects are retained.

Please press https://motiongit.com/update.md to update this MotionGit template directly, keep the old package and existing project, and tell me which new file to use when you're done.
  1. v0.3.0Latest

    v0.3.0:30 个场景(新增环形图、地图定位、聊天、前后对比、数据看板、优缺点、问答、倒数揭晓、思维导图),新场景自动缩字号/折行防溢出;完整 114 秒中文 Demo。待完善:许可待作者确认;真人口播接入未实测;看板“越低越好”指标配色。

More Animated explainers

COMMUNITY

Comments & creations

Ask a question, share your experience, or show what you made with this template.

No comments yet. Share the first creation.