我博客的原始首页设定在外太空,一个宇航员和一艘飞船,1.36 MB 的模型,加上 444 KB 贴图。运行起来长这样: check_debris_hero 点击这里查看live演示

做的时候我觉得挺酷的。我没用现成的素材,也没艺术细胞,但是跟AI聊一聊就能出效果。所以我不知不觉投入了不少时间和token,用在了这些地方:

01

用kimi做了初稿

02

用豆包生成了程序员、飞船的三视图,生成2D漂浮物

03

用NASA的航拍照片生成地球

04

用workbuddy的3D skill做成了3D的宇航员和飞船

05

剩下的就是让workbuddy用threejs按照我的想法搭建3D场景

01

PART

 

第一版很丑

kimi做的初稿是个白模,宇航员是代码画的,四肢是四个圆柱体,有点出戏。

地球也是代码画的,像个白色波棱盖。

image
image

好在底子有了,改改应该能用。

02

PART

 

再版很乱

漂浮物大小没设定,喧宾夺主。光源位置有问题,该亮的不亮。

我没有艺术细胞,只是觉得不对劲,但说不清是哪里。

不过这些都好调,按照直觉和感受跟AI聊就行了。

顺便说下,AI的理解能力杠杠的,只要舍得token。

好在workbuddy的免费积分我都薅了,能白嫖绝不充值: image

03

PART

 

3D模型入场

2D转3D的方法很多,我们依旧白嫖:workbuddy有2D转3D模型的Skill,每天有5次免费转换的次数,我们的3D模型就3个:宇航员、飞船、地球,绝对够用 image 先让豆包出了宇航员、飞船的三视图,再去workbuddy中的技能广场中安装“图片转3D模型”这个技能,把三视图丢给它就搞定了

小黄鸭、小企业、deepseek小鲸鱼也是豆包生成的,2D就够用了

素材搞定后,再让AI把他们接入场景替代原有代码绘制的素材,基本可看。

04

PART

 

性能优化

到这里,实际上首页已经做完了。

但是我的笔记本硬件比较落后(8代CPU,集成显卡),edge还装了很多插件,首页的鼠标随动效果会时不时卡一下。

3D性能优化我是外行,所以这里就是AI的主场了。我变成了测试,不断找BUG挑刺。

AI会调用playwright截图看效果,埋点算帧数耗时,做前后对比。

image
image

经过一番折腾,模型画质有所下降,但是性能上在我的老笔记本上过关了。

05

PART

 

成本收益复盘

整个开发流程,我消耗了:几个小时、若干token(虽然免费)、几次edgeone的部署次数,得到了:

  • 一个带交互的太空人场景,生硬地集成到博客首页
  • 以后看到别人分享酷炫的首页,大概知道是怎么做出来的

但性能优化这部分还是偏黑箱。反过来说,我懂一点点,就能把事做了。

属于是把AI当玩具了。

///

END

 

AI 更快,也更容易跑偏

回过头来说,AI时代要学的东西很多,能做的也很多。

比如,我不会建模。宇航员三视图裁出正面那一张,喂给图生 3D 的接口,才得到一个能用的 GLB。没有这一步,这个场景在开头就停住了,我大概会去干点别的。

这类事它确实帮我省了很多时间。但问题也在这里,AI太容易给出反馈了。

我说一句话,AI就开始改参数,调曲线,画面立刻变化,跟手的程度当场就可以试验。我总能拿到一个明确的“对了”,或者“不对,这里要这么改”的感受,然后进入下一轮循环。

程序员有个舒适区:可控、可测、有确定答案。

AI能够击中这个舒适区,所以沉迷AI很多时候就是退守在这个舒适区。

更多是要沉下心来记录所思所想所学,面向真正的需求。