「Vibe Coding」系列~这是一个自然对话颠覆代码编程的时代。
突发奇想,用 Codex 做了一个
可交互的 3D 机械键盘展台
基于 Three.js ,codex为我开发了我的 AULA F75 机械键盘 的3D赛博分身。能旋转视角、切换灯光、展示键帽悬浮结构,并且支持真实按键反馈的Web。

从一句话和几张照片,到一个 3D 作品
这次开发过程几乎完全交给 Codex 推进。我提供目标、审美偏好和功能方向,Codex 负责拆解任务、写 Three.js 场景、调材质、做键盘布局、接入交互,再通过截图自行一轮轮校准效果。


它具体能玩什么?
1. 真实三维视角
可以在浏览器里旋转、缩放,从斜视、俯视、侧面到底部结构,观察键帽、外壳、旋钮和脚撑细节。
2. 键帽悬浮展示
一键打开爆炸视图,键帽会从机身上方浮起,模型的层次关系会立刻变得清楚。
3. 物理按键反馈
按下实体键盘时,页面里的对应 3D 键帽也会同步下压,并带有回弹动画。
4. 动态灯光调节
可以调整光照强度和颜色,让同一个模型呈现不同桌面氛围。

三维高精度渲染

场景灯光调整

快速视角切换

物理按钮响应
Vibe Coding 的魅力越来越惊人
对于古法编程,开发者需要先熟悉 Three.js 的相机、材质、灯光、几何体、事件监听和动画循环。现在我更像是在做导演:告诉 Codex 想要怎样的质感,哪里不像实物,哪个角度不够好看,交互是否顺手。
AI 负责把这些自然语言反馈落到代码。以前或许需要一次对话调键帽比例,一次对话修旋钮位置,一次对话加物理回弹。现在,一次对话,codex能自主丰富作品,键帽弹起效果、视角切换...都是codex由一次对话直接完成。想法到作品的路径越来越短。


在线体验
平台限制,请关注小姜公众号获取
开源链接
平台限制,请关注小姜公众号获取
「Vibe Coding」|对话AI,零手写代码,轻松编程
持续更新,解锁更多实用工具,更多系列作品请关注小姜✨

545

被折叠的 条评论
为什么被折叠?



