如何 Vibe Coding 一个 3D 五子连珠消消看

用 GLM 4.7 Vibe Coding 基于 Three.js 实现了 3D 五子连珠消除游戏:6×6×6 透明立方体棋盘,6色玻璃珠子,支持13方向5+连消;含 BFS 路径寻路、粒子消除动画、移动预览与多维交互,视觉通透流畅,玩法兼具策略性与观赏性。

发布于2026年2月2日 08:23
编辑零重力瓦力
评论0
阅读193

五子连珠消消看大家应该都玩过,那 3D 版的你试过吗?

用 GLM 4.7 Vibe Coding 了一个 3D 版的五子连珠消消看,感兴趣的话可以来挑战一下。

视频里完整记录了整个制作过程,有任何问题欢迎留言评论!

另外在 Trae 里,GLM 4.7 目前还没法自动启动测试,希望之后能优化一下。

完整提示词

请用 Three.js 开发一款 3D 五子连珠消除游戏。

游戏规则
1. 棋盘是 6×6×6 的透明立方体网格,共 216 个位置
2. 珠子有 6 种颜色:红、橙、黄、绿、蓝、紫
3. 玩家点击选中一颗珠子,再点击空位移动它(必须有连通路径,只能走空格,不能斜走)
4. 移动后检测 13 个方向(3轴向 + 6平面对角线 + 4立体对角线),5个及以上同色连线自动消除
5. 消除得分 = 珠子数量的平方(5连得25分,6连得36分...)
6. 若移动未产生消除,系统在随机空位添加 3 颗新珠子
7. 棋盘填满游戏结束

视觉风格
风格明亮通透。背景柔和渐变色。

棋盘设计
1. 立方体外框白色发光线条描边
2. 底部有网格线帮助定位
3. 空位用微弱光点标识
4. 选中珠子后可到达的空位高亮闪烁

珠子设计
1. 晶莹剔透的玻璃球质感,内部发光核心
2. 6种颜色饱和鲜艳,各有独特光晕
3. 待机时轻微浮动 + 呼吸灯效果
4. 选中时放大 + 脉动光环
5. 移动时沿路径飞行,有拖尾光轨
6. 消除时闪耀膨胀后粒子爆散

交互方式
1. 左键点击选中珠子,再点击目标空位移动
2. 右键拖拽旋转棋盘,滚轮缩放
3. 双击重置视角
4. 选中珠子后显示到悬停位置的路径预览

界面元素
1. 顶部显示当前得分和历史最高分
2. 左侧显示下回合将出现的 3 颗珠子预览
3. 显示剩余空位数量
4. 底部层级切换按钮 1-6 和全部显示
5. 游戏结束显示最终得分和重新开始按钮

请确保路径寻找正确(BFS算法),消除检测覆盖所有 13 个方向,动画流畅。

相关文章

GPT-6 Astra 做完整游戏,39 小时与 15.6 亿 token 账本
AI 教程知识
2026年9月14日
0 条评论
小创

GPT-6 Astra 做完整游戏,39 小时与 15.6 亿 token 账本

开发者 Emm Tee 用 GPT-6 Astra 加 Blender 做出完整可玩的送报游戏 PaperRoute,并公开了逐小时、逐 token 的完整账本:39 小时追踪工时、15.6 亿 token、90 次提交。他把流程拆成八步:先写自己的 brief,只给机制不给美术方向,把游戏引擎和画面表现跑成两条独立工作流,角色概念图在 ChatGPT 做、网格走 Meshy、由 Astra 完成减面绑定,每一次改动都产出审查渲染图。他还给出了未验证的部分:手机端稳定 60fps 尚无定论。

#智能体#Blender#3D建模
阅读全文
ChatGPT Work 深度实测,一句自然语言调度 223 个内置工具完成自主闭环
AI 教程知识
2026年9月14日
0 条评论
小创

ChatGPT Work 深度实测,一句自然语言调度 223 个内置工具完成自主闭环

ChatGPT Work 是 OpenAI 推出的自主智能体操作系统,具备全网访问、持久化文件系统及无头浏览器等核心能力。其内置 223 个工具与 44 项技能,支持代码运行、网站部署及自然语言定时任务,实现从指令到可交付成果的闭环。实测显示其能自主完成路线规划、数据抓取等复杂工作流。但系统存在间接提示词注入风险及多代理文件冲突问题,使用时需注意安全边界与版本管理。

#AI工具#智能体#ChatGPT Work
阅读全文
GPT-Image-2.5 实战选型指南,教你用双模型搞定精准改图与草图成图
AI 教程知识
2026年9月14日
0 条评论
小创

GPT-Image-2.5 实战选型指南,教你用双模型搞定精准改图与草图成图

OpenAI 发布 GPT-Image-2.5,核心突破在于实现无漂移局部精修。API 端拆分为 Flare 与 Sunburst 双模型:Flare 主打低延迟与高吞吐,适合批量出图;Sunburst 专注高精度多轮编辑,保障品牌物料一致性。前端新增草图模式、模板系统及图上评论功能,提升创作效率。该模型解决了 AI 改图画面漂移痛点,已在多个平台落地应用,但在超长对话多层修改场景下仍存在回溯局限。

#AI 绘画#生图模型#ChatGPT
阅读全文
互动讨论

评论区

围绕《如何 Vibe Coding 一个 3D 五子连珠消消看》展开交流,未登录用户可浏览评论,登录后可参与讨论。

评论数
0
登录后参与评论
支持发表观点与回复一级评论,互动后将同步到消息中心。
登录后评论
暂无评论,欢迎成为第一个参与讨论的人。