同一句话,三只国产机械蝴蝶

[复制链接]
发表于 昨天 06:46 | 显示全部楼层 |阅读模式

马上注册,结交更多好友,享用更多功能,让你轻松玩转社区。

您需要 登录 才可以下载或查看,没有账号?立即注册

×
我把同一句话喂给三个国产大模型,让它们各造一只「机械蝴蝶」——结果差距比我想象的大多了

Prompt 只有一句:
"使用 Three.js 从零编写,渲染出极其复杂精美的「机械蝴蝶」。"
没有设计稿,没有参考图,没有第二句话。然后,三位选手——智谱 GLM-5.3、阿里 Qwen3.8-Max、小米 MiMo-V2.6-Pro——交出了三只完全不同的蝴蝶。
打开页面的那一刻,我愣住了:这不是代码,这是三种人格。
一、GLM-5.3:艺术家,偏执的细节狂魔

它交付的是一只「机械凤蝶 · Machina papilio」,黄铜蒸汽朋克风,一眼钟表匠气质。

  • 翅膀是真·凤蝶翅脉:41 式翅脉全部用贝塞尔曲线数据化界说,再用管状几何逐根"锻造"出来,接缝处另有铆钉螺母;
  • 齿轮是逐齿建模的真实渐开线轮廓,带辐条、带轴孔,而不是拿个圆柱糊弄;
  • 翅膀薄膜用 Canvas 步伐化绘制纹理,叠了一层物理虹彩材质(iridescence),转动角度真的会流光;
  • 最狠的是:three.js 的轨道控制器和辉光后期它全都没用官方库,本身手写了 HDR 渲染管线 + 高斯模糊 Bloom + ACES 色调映射,着色器一行行敲出来;
  • 甚至翅膀是顶点级柔性形变——扑翼时翅尖有延迟挥摆,不是整块刚体在那硬甩。
更离谱的是代码里留着一行注释:「★ 修复:横脉条目没有 p0,必须最先分流处理(原先放在后面导致崩溃)」。它本身 debug 了本身。
一句话总结:模型里的手工耿,活儿必较真。
以下为GLM-5.3生成的机械蝴蝶代码
  1. <!DOCTYPE html>
  2. <html lang="zh">
  3. <head>
  4. <meta charset="UTF-8">
  5. <meta name="viewport" content="width=device-width, initial-scale=1.0">
  6. <title>机械凤蝶 · Machina papilio</title>
  7. <link rel="preconnect" href="https://fonts.googleapis.com">
  8. <link href=" https://fonts.googleapis.com/css2?family=Cormorant+Garamond:ital ,wght@0,500;0,600;1,500&family=Noto+Serif+SC:wght@400;600&display=swap" rel="stylesheet">
  9. </head>
  10. <body>
  11.   标本编号 · SPECIMEN M-09
  12.   <h1>机械凤蝶</h1>
  13.   Machina papilio · var. horologia
  14.   黄铜 / 青铜 / 弹簧钢 — 全部机构程序化锻造
  15. 翅脉 41 式 · 齿轮传动比 22 : 10 · 无外部模型
  16.   机构运转 · MECHANISM
  17.   扑翼 <b id="hz">0.0</b> Hz
  18.   相位 <b id="ph">000</b> °
  19.   状态 <b id="st">巡航</b>
  20.   扇频<input type="range" id="speed" min="40" max="200" value="100">
  21.   <button id="bHover">悬停</button>
  22.   <button id="bClose">特写</button>
  23.   <button id="bOrbit">环绕</button>
  24.   <button id="bWide">全景</button>
  25. 拖 拽 旋 转  ·  滚 轮 缩 放
  26.   
  27.     出错了
  28.    
  29.     按 F12 打开控制台可查看详细日志 · 刷新页面重试
  30.   
  31. </body>
  32. </html>
复制代码
二、Qwen3.8-Max:产品经理转世,工程卷王

2738 行代码,113KB,是三个文件里最重的一个。但它不是重在堆模型,而是重在做产品:

  • 完备控制台:3 种飞行模式、振翅频率、辉光强度实时可调;
  • 3 套材质主题(黄铜古董 / 青金机械 / 玫瑰琉璃),切换时全部颜色逐帧插值过渡;
  • 结构透视、爆炸拆解视图、部件标注热点+点击弹出信息卡;
  • 键盘快捷键、FPS/面数/DrawCall 实时统计、带进度条的加载页;
  • BEM 定名规范、ARIA 无障碍、响应式适配、连 prefers-reduced-motion 都照顾到了。
一句话总结:别人交作品,它交的是一个可以上线的小型数字展馆。
以下为Qwen-3.8Max生成的机械蝴蝶代码
  1. <!DOCTYPE html>
  2. <html lang="zh-CN">
  3. <head>
  4. <meta charset="UTF-8" />
  5. <meta name="viewport" content="width=device-width,initial-scale=1,maximum-scale=1,user-scalable=no" />
  6. <meta name="theme-color" content="#05080c" />
  7. <title>机械蝴蝶 · Clockwork Lepidoptera</title>
  8. </head>
  9. <body>
  10. <canvas id="scene"></canvas>
  11.   <header >
  12.    
  13.    
  14.       <h1>机械蝴蝶</h1>
  15.       <p>Clockwork Lepidoptera · Three.js</p>
  16.    
  17.   </header>
  18.   
  19.   
  20.     <button id="panelToggle"  aria-expanded="false" aria-controls="panelBody">
  21.       控制台 · CONSOLE
  22.       <svg  viewBox="0 0 24 24" aria-hidden="true"><path d="M6 9l6 6 6-6" stroke-linecap="round" stroke-linejoin="round"/></svg>
  23.     </button>
  24.    
  25.       <section >
  26.         <h2>飞行模式</h2>
  27.         
  28.           <button type="button"  data-mode="hover">悬停</button>
  29.           <button type="button"  data-mode="orbit" data-primary-action>环绕飞行</button>
  30.           <button type="button"  data-mode="display">展翼陈列</button>
  31.         
  32.       </section>
  33.       <section >
  34.         <h2>振翅频率 <output id="freqOut" for="freq">1.00×</output></h2>
  35.         <input id="freq" type="range" min="0.2" max="2.4" step="0.05" value="1" aria-label="振翅频率" />
  36.       </section>
  37.       <section >
  38.         <h2>辉光强度 <output id="bloomOut" for="bloomS">0.85</output></h2>
  39.         <input id="bloomS" type="range" min="0" max="2" step="0.05" value="0.85" aria-label="辉光强度" />
  40.       </section>
  41.       <section >
  42.         <h2>材质主题</h2>
  43.         
  44.           <button type="button"  data-theme="brass"><i ></i>黄铜古董</button>
  45.           <button type="button"  data-theme="steel"><i ></i>青金机械</button>
  46.           <button type="button"  data-theme="rose"><i ></i>玫瑰琉璃</button>
  47.         
  48.       </section>
  49.       <section >
  50.         <h2>视图</h2>
  51.         
  52.           <button type="button"  id="tSpin" aria-pressed="true">自动环绕</button>
  53.           <button type="button"  id="tXray" aria-pressed="false">结构透视</button>
  54.           <button type="button"  id="tExplode" aria-pressed="false">拆解视图</button>
  55.           <button type="button"  id="tHot" aria-pressed="true">部件标注</button>
  56.         
  57.       </section>
  58.       <section >
  59.         <button type="button" id="reset" >复位视角</button>
  60.         <p ><kbd>空格</kbd> 暂停 · <kbd>W</kbd> 透视 · <kbd>E</kbd> 拆解 · <kbd>R</kbd> 复位</p>
  61.       </section>
  62.    
  63.   </aside>
  64.   
  65.     <button type="button"  id="infoX" aria-label="关闭">×</button>
  66.     COMPONENT
  67.     <h3 id="infoT">部件</h3>
  68.     <p id="infoD">说明</p>
  69.   
  70.   
  71.     <b id="sFps">--</b> FPS
  72.     <b id="sTri">--</b> TRIS
  73.     <b id="sCall">--</b> CALLS
  74.   
  75.   拖拽旋转视角 · 滚轮或双指缩放 · 点击光点查看部件
  76.   
  77.    
  78.       <svg viewBox="0 0 100 100">
  79.         <g ><circle  cx="50" cy="50" r="42"/></g>
  80.         <g ><circle  cx="50" cy="50" r="29"/></g>
  81.         <circle  cx="50" cy="50" r="17"/>
  82.         <circle  cx="50" cy="50" r="4.5"/>
  83.       </svg>
  84.    
  85.     <h2>机械蝴蝶</h2>
  86.     <p >Clockwork Lepidoptera</p>
  87.    
  88.     正在初始化渲染器…
  89.    
  90.   
  91. </body>
  92. </html>
复制代码
三、MiMo-V2.6-Pro:极简快刀手,标准答案呆板

168 行,12KB,单字母变量名,代码密度高得像压缩饼干。
官方全家桶安排得明显白白:OrbitControls、EffectComposer、UnrealBloomPass 一步到位。齿轮、复眼、触角、关节该有的都有,发光呼吸、粒子灰尘、自动环绕一样不少,打开就能跑。
不炫技,不铺摊子,用最少的代码到达 80 分效果。
一句话总结:性价比之王,交付界的闪电侠。
以下为MiMo-2.6Pro生成的机械蝴蝶代码
  1. <!DOCTYPE html>
  2. <html>
  3. <head>
  4. <meta charset="UTF-8">
  5. <title>Mechanical Butterfly</title>
  6. </head>
  7. <body>
  8. ⚙ 机械蝴蝶 ⚙
  9. 拖拽旋转 · 滚轮缩放
  10. </body>
  11. </html>
复制代码
横向对比

维度GLM-5.3Qwen3.8-MaxMiMo-V2.6-Pro代码量1084 行2738 行168 行美学完成度★★★★★★★★★★★★功能丰富度★★★★★★★★★★★★工程规范★★★★★★★★★★技能炫技度★★★★★(全自研管线)★★★★★★人格偏执艺术家卷王产品经理极简快刀手这场测试真正有意思的地方

三只蝴蝶,其实是三种「AI 思维方式」的显影:
GLM 在回答"什么是最精美的",Qwen 在回答"什么是最完备的",MiMo 在回答"什么是最有效的"。
同一句 Prompt,模型没有问任何反问,而是各自调用了本身训练时内化的价值观。这比跑分真实多了——跑分测的是知识,同题创作测的是审美、性格和工程哲学。
2026 年了,国产大模型的代码能力早就不需要怀疑。真正拉开差距的,是那句 Prompt 之外的进化方向:当全部人都能一句话生成作品时,决定价值的是生成物的"灵魂"。
哦对了,三只蝴蝶都是单文件 HTML,零依赖、零模型文件,双击就能飞。
**你 pick 哪一只?评论区见。
素材:三只机械蝴蝶均为 AI 一次性生成,无人工修改。

免责声明:如果侵犯了您的权益,请联系站长及时删除侵权内容,谢谢合作!qidao123.com:ToB企服之家,中国第一个企服评测及软件市场,开放入驻,技术点评得现金.
回复

使用道具 举报

登录后关闭弹窗

登录参与点评抽奖  加入IT实名职场社区
去登录
快速回复 返回顶部 返回列表