ııı motion.md视频风格规范
Webflow / V353

Welcome to the Age of No-Code

通过一次从暗到亮的空间穿越，把紧密的界面与代码区域转成开放、可探索的创作世界。

构图与编排 可播放 · 可替换内容
整体编排规则示例
0.00 / 89.83 秒
动作与构图示意 独立打开 ↗
查看 HTML 源码
<!doctype html><html lang="zh-CN"><meta charset="utf-8"><meta name="viewport" content="width=device-width,initial-scale=1"><title>Welcome to the Age of No-Code · sequence</title><style>html,body{margin:0;width:100%;height:100%;overflow:hidden;background:#09091c}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

前半段收紧空间

前半段收紧空间规则示例
0.00 / 8.00 秒
20–28 秒 · 动作示意 独立打开 ↗
查看 HTML 源码
<!doctype html><html lang="zh-CN"><meta charset="utf-8"><meta name="viewport" content="width=device-width,initial-scale=1"><title>Welcome to the Age of No-Code · sequence</title><style>html,body{margin:0;width:100%;height:100%;overflow:hidden;background:#09091c}canvas{display:block;width:100%;height:100%;object-fit:contain}</style><body data-mode="clip" data-start="20" data-end="28"><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>

深蓝近黑背景，代码与网页平面包围中心；用重复框架和旋转多边形形成纵深，中心小球作为穿越方向的锚点。

02

越过边界后打开尺度

进入浅色空间后提高背景明度，增大物体间距；球体、平面和曲面不再密集包围视点。蓝紫仍贯穿，青、粉作为新空间的材质变化。

03

以空间扩张代替长篇宣言

从控件、页面走到场景再走到星系，规模逐段放大。最后切干净白底与小标志，给复杂运动一个明确结束。

04

迁移时保留前后反差

新主题可以换创作对象，但暗／亮、拥挤／开阔、局部／整体三组反差要对应同一个成长叙事。不要把全片变成随机三维素材串联。

SEQUENCE

段落与节奏

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

0.00 秒的构图参考
0.00s
16.00 秒的构图参考
16.00s
35.00 秒的构图参考
35.00s
43.00 秒的构图参考
43.00s
68.00 秒的构图参考
68.00s
88.00 秒的构图参考
88.00s

画面参考 · 离散静帧

KEEP THE RELATIONSHIPS

制作其他主题

  • 替换具体创作对象；保留空间从封闭到开放的变化。

制作约束

暗色网页 / 代码平面 / 旋转门户 / 球体 / 开放地形 / 星系轨道

  • 深蓝近黑背景，代码与网页平面包围中心；用重复框架和旋转多边形形成纵深，中心小球作为穿越方向的锚点。
  • 进入浅色空间后提高背景明度，增大物体间距；球体、平面和曲面不再密集包围视点。蓝紫仍贯穿，青、粉作为新空间的材质变化。
  • 从控件、页面走到场景再走到星系，规模逐段放大。最后切干净白底与小标志，给复杂运动一个明确结束。
  • 新主题可以换创作对象，但暗／亮、拥挤／开阔、局部／整体三组反差要对应同一个成长叙事。不要把全片变成随机三维素材串联。