每个写代码、做设计的人都天天消费曲线:字体轮廓、UI 缓动、游戏相机路径、动画软件里的关键帧线——但几乎没人说得清“顺滑”到底是什么。Freya Holmér 的《The Continuity of Splines》(样条的连续性)用大量可交互的可视化,把“顺滑”这个词变成了一套可检查的语法:曲线拼接处有 C0、C1、C2 三个等级,每升一级,就治好一种你见过千百次却叫不出名字的“视觉病”。本文按视频叙事顺序拆解它的论证结构,补上工程实践里的关键细节,并对几个被社区传歪的说法做一次校正。看完这篇,等于看完视频,还多懂一层曲线为什么必须这么设计。
| 项目 | 内容 |
|---|---|
| 视频标题 | The Continuity of Splines(样条的连续性) |
| 频道 | Freya Holmér(瑞典游戏开发者,曾参与 VR 游戏《Budget Cuts》的开发,以图形学与着色器教学闻名) |
| 发布时间 | 2023 年(据频道页面,具体日期以页面为准) |
| 时长 | 半小时以上(据频道页面) |
| 播放量 | 数百万级,长期被游戏开发与动效设计社区反复推荐(据频道页面,具体数字以页面为准) |
| 核心主题 | 给“顺滑”立语法:曲线拼接处的连续性分级,以及每一级背后的数学与工程取舍 |
这是一节数学课而非时事课,内容没有任何折旧问题——它讲的曲线理论定型于上世纪,支撑着今天屏幕上的每一个字和每一次动画。
视频开场不谈公式,先铺开样条的“势力范围”:字体轮廓是曲线,UI 缓动函数是曲线,游戏相机路径、动画软件的关键帧曲线、SVG 路径、道路与铁路的线形设计、机械臂的运动轨迹,全是曲线。你每天盯着它们十几个小时,但如果问你“这两段曲线拼在一起,为什么一处看着硌眼、另一处却丝般顺滑”,你大概率答不上来。这条视频的全部野心,就是把“顺滑”从一个手感词,变成一套可逐级检查的工程标准。这个切入点决定了它和普通数学科普的分野:它不是教你认识曲线,而是教你验收曲线。
要谈拼接,先得选零件。视频做的第一个关键区分是:曲线和控制点有两种关系。插值(interpolation)是曲线必须穿过每个控制点;逼近(approximation)是控制点像磁铁,只把曲线“拉弯”,不要求穿过。贝塞尔曲线属于后者——这是很多人第一次接触贝塞尔时最意外的性质:除了首尾两个点,中间那些“手柄”根本不在曲线上。
然后是全片第一段高潮:德卡斯特里奥算法(de Casteljau's algorithm)。视频展示了三次贝塞尔曲线的全部构造过程——只用一个最原始的操作“线性插值”(lerp):把相邻控制点两两连线,在线上按同一比例取点;把得到的新点再两两连线、再取点;重复三层,最后剩下的那个点,就是 t 时刻曲线上的位置。让比例 t 从 0 扫到 1,这个点的轨迹就是整条曲线。这里的多懂一层在于:动画工业的标准曲线,原材料只有“插值”这一块积木。数学上它是 Bernstein 多项式,但工程上你只需要记住“套娃式 lerp”四个字。
一段贝塞尔的表达力有限,真实的字体轮廓、相机路径都是很多段曲线首尾拼接成的。于是真正的主角登场了:接缝。视频用一组可拖动的演示,把接缝处的三种状态拍在观众脸上:
这套 C0/C1/C2 分级是全片的骨架。它的价值不只是术语,而是一张诊断表:你做的动画“说不上来哪不对”,多半能在这三级里找到对应的病名。
接下来视频做了一次表达方式的切换,这是很多人第一次看会“哦”出来的部分:贝塞尔存的是控制点,而 Hermite 形式存的是端点位置加端点切向量——两者描述的曲线集合完全相同,可以互相换算,换算关系干净得漂亮:对三次曲线而言,端点切向量除以三,就是贝塞尔的两个内部控制点。存控制点还是存速度,只是同一数学对象的两种打包方式。
那工程上为什么还需要 Hermite?因为手调控制点太累。视频随后引出 Catmull-Rom 样条:每个点的切向量不由人手调,而是由它的左右邻居自动算出(大致就是“邻居连线方向”)。于是它同时拿到两个梦寐以求的性质:穿过所有控制点(插值)+自动 C1 连续(零手工对齐)。这就是它成为关键帧插值、相机路径事实标准的原因——不是它数学上最高级,而是它把“顺滑”从手艺变成了默认值。
这是全片最“值钱”的一段,也是课本最少讲的一段。Catmull-Rom 并非无懈可击:当控制点疏密悬殊时,均匀参数化(相邻点之间的时间配额相同)会让曲线出现尖点(cusp)甚至自交(loop)——视频演示了一条本来优雅的路径如何在密集控制点处突然绕出一个死圈。解法是换一种 t 的分配方式:弦长参数化按相邻点距离分配配额,而向心参数化(centripetal,按弦长的平方根分配)进一步抑制尖点与自交,E. T. Lee 在 1989 年的论文里给出了它的数学理由。今天主流图形库和游戏引擎的路径插值普遍以向心参数化为默认——你之前以为的“曲线玄学”,其实是参数化没选对。
视频在这里还埋了一层容易被略过的辨析:C 连续与 G 连续。C1 要求切向量作为完整向量(方向+大小)连续;G1 只要求方向连续、大小可以突变。肉眼看运动轨迹,两者常常一样;但对“沿曲线匀速跑”的物体,速度大小的突变会立刻暴露。工程黑话里的这两套等级,视频以视觉直觉为主带过,但知道这层区分,你读图形学文档时不会懵。
全片收束成一张选型指南:要穿点且免手调,取向心 Catmull-Rom;要精确捏造型,用贝塞尔分段拼(字体 industry 就这么干);要最高阶的整体顺滑,上 B 样条——它 C2 起步、控制局部、逼近型,是 CAD 工业(NURBS)的血统,代价是曲线不再穿过控制点。视频没有说“越高越好”,而是把每一级的代价摆在台面上——这个克制的结尾,恰恰是它比大多数科普诚实的地方。
证据充分的部分。 德卡斯特里奥构造、C0/C1/C2 分级、参数化对曲线形态的影响,与教材、字体规范和图形库实现完全一致。作为入门,它经得起工程师的挑剔——尤其“均匀参数化会绕圈、向心救场”这一段,是很多正规课程都跳过的实战知识。
被教学简化、需要补课的部分。 第一,样条给的是形状,不是速度表。参数 t 均匀推进,不代表物体沿曲线匀速移动——弧长增长忽快忽慢,跟拍相机就会一冲一停。工程解法是弧长重参数化:预先采样建一张累计弧长表,再按目标弧长反查 t。视频对这层点到即止,但它是把样条用在动画里时最容易栽的坑。第二,“阶数越高越顺”的直觉要主动打折:动画里的急停、打击感、steps() 阶梯缓动,都是故意的断裂;电影剪辑的硬切更是合法的“负样条”。顺滑是手段,不是目的。第三,C1/C2 之外还有 G1/Gn 这套几何连续的黑话(方向连续即可、大小可跳),视频以视觉直觉为主没有摊开,读图形学文献时会撞上。
被社区传歪、不应照单全收的部分。 流传甚广的说法是“向心 Catmull-Rom 永不自交、永远完美”——这比 Lee 原文的结论强:向心参数化保证的是抑制尖点与自交,不是保证任何审美意义上的理想曲线,过冲(overshoot)仍可能出现。另外“Catmull-Rom 是默认安全牌”也要看数据质量:它的切线直接由邻居连线决定,控制点数据一抖,抖动会原样映射进曲线——垃圾进,垃圾出,样条不负责洗数据。
第一条:调缓动时,知道你手里四个数是什么。 cubic-bezier(x1, y1, x2, y2) 里的两个纵坐标,本质是曲线进出口的“初速度/末速度”。拼接两段动画时,先对齐前段出速与后段入速(至少做到方向一致,即 G1),再谈风格化——大量“说不上来哪不对”的动效,病根就是接缝处速度断崖。
第二条:记一条选型口诀。 要穿点、免手调,取向心 Catmull-Rom;要精确捏造型,用贝塞尔分段(字体工业同款);要物理级的整体顺滑,上 B 样条家族。同时记住前提:控制点疏密悬殊时,避开均匀参数化——那是尖点和死圈的老家。
第三条:形状不等于速度,匀速要自己造。 任何“沿路径匀速移动”的需求——跟拍镜头、传送带上的道具、进度轨迹上的高亮标记——都先做弧长重参数化:离线采样、建累计弧长表、运行时反查。一张小小的查表,换整段动画不忽快忽慢,这是样条知识里投入产出比最高的一招。
flowchart TD
A["样条无处不在<br/>字体·缓动·相机路径"] --> B{"控制点要被穿过吗"}
B -->|"要穿过"| C["插值样条<br/>Catmull-Rom"]
B -->|"只被拉动"| D["逼近样条<br/>贝塞尔·B样条"]
D --> E["德卡斯特里奥<br/>套娃式取点"]
E --> F["多段拼接<br/>接缝问题登场"]
F --> G["C0 位置接上<br/>硬角硌眼"]
F --> H["C1 速度对齐<br/>动起来不顿挫"]
F --> I["C2 加速度对齐<br/>身体感到的顺滑"]
C --> J["控制点疏密不均<br/>均匀参数化会绕圈"]
J --> K["向心参数化<br/>抑制尖点与自交"]
K --> L["按需选型<br/>顺滑是手段不是目的"]
H --> L
I --> L
本文由「51学通信」技术团队出品。51学通信由通信行业18年老兵爱卫生(微信ID: gprshome201101)维护,聚焦5G/6G核心网、3GPP标准解读、通信前沿技术深度分析。 出版作品有《5G核心网原理与实践》《IMS原理与实践》等4本通信专业书籍。知识星球「51学通信」提供深度技术答疑和行业洞察。
[!tip] 51学通信知识星球 星主:爱卫生(微信:gprshome201101)——公众号「51学通信」创办者,19 年通信行业运维与讲师经验,著有《GPRS网络信令实例详解》《EPC原理与实践》《5G核心网原理与实践》三本纸质书(各大电商平台有售)。 星球定位:深耕 5G 核心网、IMS、NFV/AI、云原生等 ICT 领域,主打运维岗位与信令分析。 当前规模:5200 篇主题 / 990 个回答,198 元/年。 加入福利:加入星球后请加爱卫生微信,拉您进知识星球年度陪伴与答疑群——不限量回复您的各种问题,另有群内分享。 AI 加持:51学通信知识星球已作为 skill 接入 WorkBuddy,使用 deepseek-4-flash 在海量星球帖子中精准找贴、找视频、找 FAQ 和案例,做总结、找文档和 PPT 等场景全覆盖。
