ııı motion.md视频风格规范
Figma / V101

季度业绩|2026 Q1 数据海报

用高密度色块与巨型数字制作季度快报。一屏只讲一个指标,底部信息条始终提供名称和注释。

构图与编排 可播放 · 可替换内容
整体编排规则示例
0.00 / 25.04 秒
动作与构图示意 独立打开 ↗
查看 HTML 源码
<!doctype html><html lang="zh-CN"><meta charset="utf-8"><meta name="viewport" content="width=device-width,initial-scale=1"><title>季度业绩|2026 Q1 数据海报 · sequence</title><style>html,body{margin:0;width:100%;height:100%;overflow:hidden;background:#a3a099}canvas{display:block;width:100%;height:100%;object-fit:contain}</style><body data-mode="sequence"><canvas width="1000" height="600"></canvas><script src="data.js"></script><script src="common.js"></script><script src="scene.js"></script><script src="bridge.js"></script></body></html>
画面元素巨型数字彩色矩形指标标签底部注脚署名
MOTION LANGUAGE

动作与构图

局部动作 · 构图规则

01

巨字和色块共同构成海报

让字形占据大部分画幅,适度裁切边缘,彩色矩形紧密拼接。数字和单位保持一个阅读整体,固定页脚提供季度、指标名和说明。

02

指标逐个切换,不同时争抢

季度引导之后依次给收入、同比和留存。先让观众找到指标名称,再给主数字;每项完成一次阅读停顿,再切下一张。

内容槽位排版约束
季度建立开场主题
收入金额与单位连在一起
增长与留存百分号不脱离数字
注脚位置固定,保持可读字号
署名降低密度,结束整组海报
03

用撞色制造密度,用字重维持秩序

灰色底板上使用紫、荧光黄和亮绿,巨字以深色粗无衬线为主。注脚用较小常规字重,形成鲜明比例差;不要用过细标题抵消色块的力度。

04

换一组数据,就做成另一期

同步替换季度、指标名称、数值、单位和注释。先确认每个数字能在一屏内成立,再调整字宽与色块比例;必要时分两屏,不能为了塞下数据把注脚压得不可读。

SEQUENCE

段落与节奏

点击段落,定位到上方编排示意。

0.00 秒的构图参考
0.00s
2.00 秒的构图参考
2.00s
6.00 秒的构图参考
6.00s
13.00 秒的构图参考
13.00s
17.00 秒的构图参考
17.00s
21.00 秒的构图参考
21.00s

画面参考 · 离散静帧

KEEP THE RELATIONSHIPS

制作其他主题

  • 可换季度和数据;保留数字层级、单位以及底部注释。

制作约束

巨型数字 / 彩色矩形 / 指标标签 / 底部注脚 / 署名

  • 多种宽度的巨字与色块紧密拼接,裁切边缘形成密度;底部信息条固定。
  • 每段只强调一个指标,先标签后数字,指标单位不得分离。