卡卡颂 Vibe Coding 记录

用 vibe coding 做了一个卡卡颂 web 版:kaka-world.vercel.app。
在做之前 还特意上网 找了一下是否有人做了。
找到都是 质量堪忧的,于是 用多余的 token 让它做了一个。
什么是卡卡颂
它是个桌游,挺好玩的,一个类似拼图桌游,比较休闲。
具体 Wiki
基础架构
整体交互 没什么问题,基础架构使用了 Three.js 来实现 画布。
现在 AI 的知识库越来越新,使用 Three.js 实现这个很方便。
后续一些 游戏都能用它来实现,很不可思议。
方块衔接规则
在开发的过程中,有一个问题,反复沟通了很久才实现,但是看代码似乎比想象的要复杂。
毕竟 AI 没有视觉,无法理解 游戏在视觉上的感官。
所以 在 卡卡颂的 方块衔接逻辑上实现得 没那么优雅。
后来 重新思考后,让它实现了一版更简单的校验逻辑,逻辑如下:
道路逻辑
- 获得所有道路块
- 每个方向的道路开口数据类似这样 (x, y, d)。x, y 代表坐标,d 代表某一个方向 0, 1, 2, 3
- 每个道路开口先单独成组 group:[data1]
- 贴边两边都是道路的两块并成 group:[data1, data2]
- 同一张牌上恰好有两个道路开口时,把这两个开口所在的组合并成二维数组 [group1, group2]。相对或相邻都并。开口数是 1、3、4 的牌不并
- 一个二维数组成为一条路,当且仅当每个组的 length == 2。这包括两端都接到头的一条路,以及全部由双开口牌绕回来的环
城堡逻辑
- 获得所有城堡块
- 每个方向的城堡碎片数据类似这样 (x, y, d)。x, y 代表坐标,d 代表某一个方向 0, 1, 2, 3
- 匹配所有块的城堡碎片数据,每个数据一个 group:[data1]
- 遍历合并配对的碎片数组,组成 group:[data1, data2]
- 遍历合并所有同一块 block、centerSlot: 2 的数组,组成二维数组 [group1, group2]
- 判断每个二维数组是否成对,length == 2。如果都成对,则代表可以成为城堡
神庙逻辑
- 获得所有神庙模块
- 当 8 个方向都有牌占领,则激活神庙
Coding 心得
我感觉针对一些特定的 逻辑,需要有一定 编程基础才能让它很好地输出代码,
不然只是纯跟 AI 沟通你的游戏规则,它很可能在实现上有偏差。
突然觉得自己作为 编程人员,在会不会被 AI 替代这个问题上,有了自己的答案。
未来的编程人员 需要拥有 AI 所无法涉及的领域知识。
以及具备 能够抽象领域知识 到 数据架构层的能力。
