codex为我的键盘打造了一个赛博分身

AI 时代程序员必备技能

Codex、Claude Code、Cursor、Hermes Agent、OpenClaw等工程化实战专栏 ,讲透 AI 如何接管脏活累活

「Vibe Coding」系列~这是一个自然对话颠覆代码编程的时代。

突发奇想,用 Codex 做了一个
可交互的 3D 机械键盘展台

基于 Three.js ,codex为我开发了我的 AULA F75 机械键盘 的3D赛博分身。能旋转视角、切换灯光、展示键帽悬浮结构,并且支持真实按键反馈的Web。

Vibe Coding 3D 机械键盘展台首图

从一句话和几张照片,到一个 3D 作品

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

它具体能玩什么?

1. 真实三维视角
可以在浏览器里旋转、缩放,从斜视、俯视、侧面到底部结构,观察键帽、外壳、旋钮和脚撑细节。

2. 键帽悬浮展示
一键打开爆炸视图,键帽会从机身上方浮起,模型的层次关系会立刻变得清楚。

3. 物理按键反馈
按下实体键盘时,页面里的对应 3D 键帽也会同步下压,并带有回弹动画。

4. 动态灯光调节
可以调整光照强度和颜色,让同一个模型呈现不同桌面氛围。

三维高精度渲染

场景灯光调整

快速视角切换

物理按钮响应

Vibe Coding 的魅力越来越惊人

对于古法编程,开发者需要先熟悉 Three.js 的相机、材质、灯光、几何体、事件监听和动画循环。现在我更像是在做导演:告诉 Codex 想要怎样的质感,哪里不像实物,哪个角度不够好看,交互是否顺手。

AI 负责把这些自然语言反馈落到代码。以前或许需要一次对话调键帽比例,一次对话修旋钮位置,一次对话加物理回弹。现在,一次对话,codex能自主丰富作品,键帽弹起效果、视角切换...都是codex由一次对话直接完成。想法到作品的路径越来越短。

3D 键盘俯视细节

3D 键盘键帽悬浮结构

在线体验

平台限制,请关注小姜公众号获取

开源链接

平台限制,请关注小姜公众号获取

「Vibe Coding」|对话AI,零手写代码,轻松编程

持续更新,解锁更多实用工具,更多系列作品请关注小姜✨

AI 时代程序员必备技能

Codex、Claude Code、Cursor、Hermes Agent、OpenClaw等工程化实战专栏 ,讲透 AI 如何接管脏活累活

评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包

打赏作者

Freshman小姜

你的鼓励将是我创作的最大动力

¥1 ¥2 ¥4 ¥6 ¥10 ¥20
扫码支付:¥1
获取中
扫码支付

您的余额不足,请更换扫码支付或充值

打赏作者

实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值