16:900:14Voir le modèleFragment animé
Prism Studio · Art visuel
Centre de modèlesMis à jour 13 nov. 2026
科技数据可视化 MG Reel
Innovation25 秒、16:9 深色科技风数据可视化 MG 短片：开场标题字、增长折线/柱状图与 KPI 卡、节点网络脉冲流、三张产品 UI 卡片、品牌落版五段连续动效。画面由 HTML/CSS/SVG 逐帧驱动，配本地原创合成 BGM；图表与 KPI 数字为演示占位，复用时替换为真实数据。
Partager
Fragment animé
Une animation pour une ouverture, une transition, un sous-titre ou une scène qui complète votre vidéo.
PREVIEWdefault1920×1080 · 30fps
Free template
Download free. Customize and create again.
Free to download, with no top-up required. Reuse and customize it: replace text, images and audio, and adjust visuals and animation.
Personal and commercial video production · Individuals and businesses may make and publish videos under the template license. Unless authorized, you may not repost or resell the template package or source code, including modified versions, or use them to develop a third-party online service.
- 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.
À propos de ce modèle
一支 25 秒、1920×1080、30fps 的深色科技风数据可视化 MG 短片，作为工作室作品集 Reel 的第一条。五个连续场景，全部由 HTML / CSS / SVG 与逐帧时间线驱动；包内不内嵌音频，BGM 仅作默认演示素材，正式音轨由宿主音乐合同接入。
场景拆解（固定 25 秒）
| # | 时间段 | 场景 | 实现位置 | | --- | --- | --- | --- | | 1 | 0.0–3.0s | DATA / MOTION / STORY 三词模糊上浮 + 副标题，对角划像收尾 | src/index.js · drawS1 | | 2 | 3.0–9.0s | 平滑折线图 + 柱状图升起 + 三张 KPI 卡片滑入 | src/index.js · drawS2 | | 3 | 9.0–15.0s | 八节点网络连线浮现，脉冲点沿主路径循环流动 | src/index.js · drawS3 | | 4 | 15.0–21.0s | 三张产品 UI 卡片：环形进度、迷你柱状、受众与目标进度 | src/index.js · drawS4 | | 5 | 21.0–25.0s | 品牌落版，分隔线展开，尾部整体淡出 | src/index.js · drawS5 |
入口 src/index.html；参数集中在 src/config.js；共享缓动、配色与划像组件：src/lib.js；BGM 合成脚本：src/make_bgm.py，演示音频：assets/bgm.mp3。
素材与许可
- 画面图形均为包内 SVG/CSS 程序化绘制，无外部图片。
assets/bgm.mp3由src/make_bgm.py本地原创合成，无第三方采样；页面不内嵌<audio>，许可见licenses/TEMPLATE-LICENSE.txt。- 字体使用系统无衬线字体栈，未捆绑字体文件。
Ressources pour les développeurs
给 AI 的说明
这是 MotionGit 模板包（.motion，ZIP 容器）。请按顺序读取：
motion.json：模板身份、运行要求、输出画幅与时长- 本文件
params.schema.json：可替换的主题参数与约束guide.json：用途、素材角色、容量与适配限制asset-manifest.json与licenses/：素材来源与许可
先读数据、不执行代码。只有在宿主具备文件、命令与渲染能力并得到用户授权后，才检查依赖并运行。默认不联网；本包不引用外部字体、图片或网络资源。
运行
运行配置：html-canvas/1，入口 src/index.html。页面挂载 window.renderFrame(integerFrame, inputs)：宿主按 30fps 传入整数帧（0–749）与参数对象，返回该帧画面。画面只依赖帧号与输入参数，不依赖实时时钟或机器速度；同一帧号重复渲染结果一致，状态不跨帧累积。宿主渲染 1920×1080、25 秒成片。
随包工具链流程：check-params（核对 inputs 类型与兜底）→ plan（列出五场景时长与素材）→ prepare（落包内素材与配色）→ preview（逐帧抽帧核对默认帧、改参帧与首尾）→ render（导出成片并接入音乐合同）。
可替换的内容
参数集中在 src/config.js 的 DEFAULTS，并在 params.schema.json 中声明；宿主通过 inputs 覆盖：
brand：片尾落版品牌名（最多 24 字符，默认MOTION STUDIO）introWord1/2/3：第一幕三个开场词introTag：第一幕副标题s2Kicker/s2Title：数据页小标题与主标题kpiLabels/kpiValues：三张 KPI 卡片标签与数值（各 3 项）s3Kicker/s3Title：网络页小标题与主标题s4Kicker/s4Title：UI 卡片页小标题与主标题outroMeta：片尾品牌名下方的元信息行accent：强调色（默认#00E5FF）background：背景色（默认#060918）
S4 卡片内环图百分比、迷你柱、受众数与进度条数值为代码内演示占位常量；图表与 KPI 数字均为演示占位，复用前须替换为真实数据。
Ce que vous pouvez remplacer
| Paramètre | Description | Type | Contraintes | Par défaut |
|---|---|---|---|---|
brandRequis | 落版品牌名 | string | ≤ 24 caractères，≥ 1 caractères | MOTION STUDIO |
introWord1 | 开场词 1 | string | — | DATA |
introWord2 | 开场词 2 | string | — | MOTION |
introWord3 | 开场词 3 | string | — | STORY |
introTag | 开场副标题 | string | — | WE CRAFT MOTION THAT MOVES PEOPLE |
s2Kicker | 数据页小标题 | string | — | Quarterly Growth |
s2Title | 数据页主标题 | string | — | Revenue · Q1 → Q4 |
kpiLabels | KPI 标签（3 项） | array | — | ["TOTAL REVENUE","GROWTH YOY","UPTIME"] |
kpiValues | KPI 数值（3 项） | array | — | ["$2.4M","+38.4%","99.99%"] |
s3Kicker | 网络页小标题 | string | — | System Architecture |
s3Title | 网络页主标题 | string | — | Nodes · Connections · Flow |
s4Kicker | UI 卡片页小标题 | string | — | Product Interfaces |
s4Title | UI 卡片页主标题 | string | — | Dashboards · Metrics · UI |
outroMeta | 落版副标 | string | — | MG Reel · 2026 |
accentRequis | 强调色 | string | #RRGGBB | #00E5FF |
backgroundRequis | 背景色 | string | #RRGGBB | #060918 |
Historique des mises à jour
Améliorations, corrections et points à traiter pour chaque version.
Mettre à jour avec votre assistant IA
Donnez l'ancien modèle à l'assistant et envoyez la phrase suivante. La nouvelle version est enregistrée dans un fichier séparé et les anciens packages et projets sont conservés.
Veuillez appuyer sur https://motiongit.cn/update.md pour mettre à jour ce modèle MotionGit directement, conserver l'ancien package et le projet existant, et dites-moi quel nouveau fichier utiliser lorsque vous avez terminé.
1.0.1 重构：运行契约由 OpenFilm window.film.frame(t) 迁移为平台原生 html-canvas/1 的 window.renderFrame(整数帧, inputs)；品牌、开场词、各场景标题、KPI 标签与数值、强调色与底色接入参数；页面不内嵌音频，BGM 由宿主音乐合同接入。图表与卡片内数字为演示占位，复用时替换真实数据。
Plus de Art visuel
16:900:14Voir le modèle
16:900:13Voir le modèleFragment animé
Prism Studio · Art visuel
16:900:13Voir le modèleFragment animé
Prism Studio · Art visuel
16:900:14Voir le modèleFragment animé
Prism Studio · Art visuel
COMMUNITY
Commentaires et créations
Partagez vos questions, votre expérience ou une création réalisée avec ce modèle.
Aucun commentaire. Partagez la première création.