跟 Opus 4.8 打得有来有回？！Kimi K3 首测

参考自「归藏的 AI 工具箱」

Kimi K3 正式上线了。

官方给的成绩单是全新 Kimi Linear 混合线性注意力架构，1M 上下文，编程、Agent、多模态都覆盖到了，同时模型有 2.8T。在一众国内的 1T 模型里面，相当大了。

前几天泄露的时候，Twitter 上一些人说超过 Fable 5 了，或者说跟 Fable 5 打平了，我自己试了一下，其实没有。

数字归数字，手感得自己试。我找了 Claude Opus 4.8 当对照组，挑了四个有实际技术门槛的前端场景来测。包括了 WebGL shader、3D 玻璃折射、多阶段滚动状态机、Awwwards 这些前端里面比较复杂的活。

所有案例都是一次性生成，提示词丢进去，不手动改代码，直接看结果。我专门跟 Opus 4.8 做了对比测试，试完以后，发现确实能跟 Opus 4.8 打得有来有回。

案例一：从视频复刻 3D 玻璃棱镜网页

给模型一段视频，里面是一个旋转的 3D 玻璃菱形体，带棱镜折射、环形文字和产品信息。

提示词就一句话：看懂这个视频，复刻出来，文案换掉，其他尽量还原。

这题难在哪？“看视频 → 理解 3D 结构 → 写 WebGL 代码”（WebGL 是浏览器里做 3D 图形的底层技术，写起来接近游戏开发）。

模型得从动态画面里自己推断几何体形状、玻璃材质参数、排版方式，然后一口气生成 Three.js 3D 渲染加 CSS 环形文字加中文书法字体。没有任何文字标注可以参考，全靠自己看。

K3 赢得还是比较明显的。

K3 的构图完整度很高。 棱镜居中，玻璃折射层次分明，环形文字均匀排布，中文书法字”棱镜”放在两侧位置恰当，左下角产品文案排列整齐。整体氛围跟原视频很接近。

Opus 4.8 的 3D 建模本身没有 K3 有玻璃的通透感，灰灰的，而且元素过大导致不协调，用来放在建模里面的表现折射的文字超出了 3D 元素的范围。排版上”PRISM”几个大字直接叠在环形文字上面，各种元素互相打架，画面又挤又乱。3D 及格，整体观感拉胯。

K3 执行时间也更短。视频理解这个方向，K3 确实非常有优势。

案例二：贝塞尔曲线 WebGL 光带

Web3 暗黑科技风首屏：纯黑背景上一条发光贝塞尔波浪持续流动呼吸，被 20 多条垂直玻璃条覆盖形成棱镜色散，鼠标移动时波浪会跟着弯。

这题的提示词大概是四个里面技术密度最高的，已经不算前端了，是计算机图形学。

简单列一下它要求模型做的事：

• 写 Fragment Shader（一种在 GPU 上逐像素运行的程序，屏幕上每个像素的颜色都要靠它实时算出来）。
• 用牛顿法反解贝塞尔参数（屏幕上 180 万个像素，每个都要算出自己离那条曲线有多远，这需要解一个三次方程，通常用牛顿迭代法来逼近）。
• 多组失谐正弦驱动曲线运动（让曲线像呼吸一样有节奏地蠕动。“失谐”的意思是几组不同频率的波叠在一起，避免看起来太机械）。
• RGB 三通道差异偏移做色散（模拟棱镜效果：红、绿、蓝三种颜色沿稍微不同的方向折射，叠在一起就出现了彩虹镶边）。
• exp 函数控制发光衰减（控制光线从亮到暗的过渡速度，参数给了精确范围，偏一点要么糊成一片白光，要么暗到什么都看不见）。
• bloom 泛光（让最亮的部分溢出柔和的光晕）的强度、半径、阈值也全给了对应的值。

一次性把这么一个 shader 写对并调到位，说实话是很苛刻的要求。

这一局基本打平，各有侧重。

K3 更干净。黑底纯净，光带细而锐利，前景文字克制，没有喧宾夺主。不过玻璃条的色散效果不太看得出来。在细节上 K3 单独对左上角 Logo 文字做了处理，还选择了左对齐，曲线也配合了排版。一个发挥得好的点是，他给那几个散落的标签做了视差效果，鼠标在移动的时候，那几个标签也会移动。

Opus 4.8 的玻璃折射做得好一些，竖向条纹清晰可见，色散的彩色镶边也有。但代价是画面整体偏亮，光带更粗，跟提示词要求的”亮区 <15%“有些距离，同时排版上没有 K3 有新意。

有一个细节值得说：K3 在跑的过程中会自己截图来检查。第一次生成的光带太粗了，更像一根发光棍子，但它自己看到了、自己改回来了。Opus 4.8 是一次出货，不需要回头。路径不一样，最终效果差不多。

案例三：视差滚动卡片动画

9 张卡片在滚动过程中走过 5 种形态：扇形展开、斜向视差、3×3 九宫格、7 倍穿梭放大、横向滚动平移。全部用一条 GSAP master timeline 驱动，配合 Lenis 平滑滚动。

这个案例的复杂度跟前面几个不太一样。不是某个技术点特别难，而是整体编排的工程量太大。

9 个元素在 5 种拓扑之间切换，每种形态的数学逻辑完全不同（扇形要算角度、斜向要算对角线坐标、九宫格要算行列位置、穿梭要计算缩放中心、横滚要算水平偏移），但必须首尾相连跑在同一条时间轴上，中间不能跳帧。

卡片形态变了，文字位置也得跟着联动：扇形时标题居中，散开时文字挪到左边，九宫格时缩到顶部让路。ScrollTrigger 和 Lenis 两套滚动系统还得同步（一套管动画触发时机，一套管滚动手感的丝滑度）。人类开发者从零写这个，少说也得一整天。

Opus 4.8 略胜。

Opus 4.8 的首屏完成度不错。“DEAL”超大标题居中，9 张卡片在下方扇形堆叠，底部有 SCROLL 提示，层次清楚。

K3 有一个小 bug：首屏的标题短暂出现后又消失了，只剩一张蓝色卡片的角露在底部。入场动画的时序出了问题，文字淡出被意外触发了。核心的滚动动画流程倒是两边都跑通了，但首屏印象上 Opus 更稳当。

案例四：家具网页动效设计

Awwwards 级全屏水平手风琴：4-5 个垂直列展示家居场景，hover 展开收缩，配 clip-path 遮罩揭示、圆形画中画、文字淡入微交互、自定义光标跟随。

看着好像就是做个手风琴，但实际上要四层动效同时运作：

GSAP 缓动控制宽度伸缩（要有弹性和阻尼感，不是匀速机械运动）；clip-path 动态遮罩做图片揭示（图片不能直接显示，需要像拉开幕布一样从中间向两边露出来）；文字淡入位移要卡准展开节奏、自定义光标要 Lerp 插值跟随（带一点”拖尾”的滑动感）。一层不难，四层一起上还得保持流畅和品质，就是另一回事了。

Opus 4.8 在设计感上更好些。

核心交互两边都实现了，hover 展开收缩都丝滑，动效质量差距不大。差距在审美判断上。K3 走了一个明亮展览风：5 个面板均匀分布，底部各带标题，干净但层次有点平。

Opus 4.8 选了深色基调，默认展开第一栏露出白色椅子特写，每个面板有编号和竖排文字，顶部有品牌导航。看起来更像一个真正在运营的设计工作室网站，信息层级和排版节奏都更讲究一些。

总结

案例	判定
3D 玻璃棱镜（视频复刻）	K3 胜，构图和排版完整度高出一截
贝塞尔 WebGL 光带	平手，K3 更克制，Opus 折射更到位
视差滚动卡片	Opus 小胜，首屏即正确，一次性成功率更高
家具网页动效	Opus 小胜，排版更细腻，审美判断更成熟

K3 有一个比较突出的特点：多模态能力确实在发挥作用。案例一里它直接从视频提取 3D 结构和排版细节，还原度远超 Opus，这是”看得懂”带来的实打实的优势。案例二里它在生成过程中自己截图检查、发现光带太粗、自己修正。

Opus 4.8 稳在精细排版和一次性成功率上。K3 偶尔会有时序小问题或者第一版参数偏差，需要再跑一轮修正。

但 K3 是开源的，价格在 Sonnet 级别，用 Sonnet 的价格拿到接近 Opus 的产出。相较于之前的 K2.6、2.7 确实贵了一些，但是毕竟参数大了这么多，也能理解。

同时，我也用这套提示词跑了跟 GPT-5.6-Sol 的对比测试。在效果上，5.6-Sol 明显会比 K3 好一些，同时 Fable 5 肯定也是类似的。但这依然是一个非常值得庆祝的进步，毕竟 GPT-5.6-Sol 和 Opus 5 在价格上跟 K3 差得实在是太多了。

附录：完整提示词

以下是四个案例使用的完整提示词截图，感兴趣可以拿去自己跑一遍。

案例二 · 贝塞尔 WebGL 光带

案例三 · 视差滚动卡片

案例四 · 家具网页动效