Trae实践——实现小时候最爱玩的《龙棋》(1)

226 阅读5分钟

背景

最近AI编程很火,很多人推荐Cursor,但是俺是守法公民,一直用的是腾讯代码助手,最近它改名了叫CodeBuddy。虽然在用但是也只是浅显的用一下,帮忙改改代码,写写忘记的算法之类的。一直听说AI现在都可以帮忙搭建基础框架,写代码,咱只能高山仰止,心向往之。直到最近Trae出了国内版(吐槽一下为啥不优先出国内版:(),赶紧来试一下,先是搞了1个基于vue的浏览器插件,这个以前一直是怨念,有限的空闲实现根本搞不出来,但是trae很快就帮忙实现了一些基础,但是由于后续的想法需要和公司的产品结合,就暂时没搞了。后来想搞游戏吧,以前一直想把小时候玩的龙棋复刻一下,但也没能力,这不AI出现了,咱的想法似乎可以化为现实了。

开始

Trae的安装很简单,官网下载即可。和vscode一样,开袋即食。

  1. 我们建1个文件夹“longqi”,然后使用Trae打开,选择协作或者builder,我这里选了builder

  2. 然后我们对话就可以了,模型用的的deepseek-v3

  3. 向Trae提出我们第一个甲方要求,嘿嘿:我想构建一个web端的棋类游戏 基于vue3 请帮忙初始化一下项目

image.png

  1. 向Trae提出棋盘和规则:“现在我描述一下这个棋盘的样子和规则 棋盘是三个正方形套在一起,用直线链接三个正方形的顶点和各个边的中点, 你能试着画出来吗”

然后Trae随即根据我们的描述使用svg画了一个棋盘,大概是这个样子的(成品):

image.png

image.png

其实第一次Trae画的是对的,但是后来再调整规则的时候,它忽然就把这个棋盘改了,然后再也改不回来了,我就只能手动修正代码:(

5.然后,棋盘画出来之后,我开始以为它挺强,就直接扔了游戏规则给它:


很好 棋盘画的很对 现在我说一下规则

1. 棋盘中的交点是可以下子的位置

2. 游戏需要两名玩家 执白子和黑子各93. 游戏分为3个阶段

4. 第一个阶段为下子阶段 每轮次每人只能下1个子 直到9子下完

5. 第二阶段为移子阶段 玩家可以移动自己的子1格 到相邻的空位

6. 第三个阶段飞子阶段 当玩家剩子小于3个时 玩家可以移动任意自己的子 到棋盘的任意空位;

7. 吃子规则 当玩家任意3个子连成1条直线时 不管是斜线还是横线均可 即为“成龙” 成龙时可以吃掉对方的非“成龙”子 如果对方的子都处于“成龙”状态 则可以吃掉其任意一子; 最后 当玩家只剩两颗子时 被两颗子夹在中间的对方子可以被吃掉; 当玩家只剩1个子时,两个夹住该子的对方子可以被吃掉;

8. 知道1方的子被吃完游戏结束

请思考一下 并实现

然后...它就开始进入长考,失败的循环: image.png

哈哈,Trae可能委屈说我要能直接搞出来,要你有何用!

所以,我们只能把逻辑进行拆分

拆分逻辑

我根据规则开始一步一步指导Trae 把想要的棋盘效果画出。

  1. 第一步棋盘刻下子 添加玩家

这样 我们一步一步来

1. 棋盘中的交点是可以下子的位置

2. 游戏需要两名玩家 执白子和黑子各9个

请展示两个玩家 放在棋盘的左上和右上 展示各自剩余的棋子数量

Trae行为:

image.png

然后我们要求Trae把棋子画的好看一点:

可以 把棋子列出来 我们可以把 棋子做出比较符合现实的效果 还有需要展示两名玩家的头像和昵称

Trae行为:

image.png

然后我后续想把效果改的好看一点就要求Trae做了许多优化:


头像如果没有图片 可以先用黑圆 和 白圆表示

我们可以使用div css 不一定全部由svg实现

请检查一下模版 是否有 tag未结束

好的 现在我们修改一下玩家的展示位置 把玩家的头像用div实现的圆圈来表示

棋盘的话 我希望使用svg来绘画

棋盘画的不对 第一版的棋盘是正确的

还是不对 连线是顶点连线和 各个边的中点连线

顶点未连线 而且 中点的连线超出了

三个正方形的顶点连线 各个边的中点连线 现在都少了一点

顶点的连线还是不完全 最里面的正方形顶点没有连接

中点的连线多了 不需要向最里面延伸 连接到最里面那个正方形各个边的中点即可

现在最里面正方形内部的线还是没去掉 希望保持最里面正方形为空的状态

看代码 现在画很多多余的连线

好的棋盘我已画好 请把用户的信息放在页面的最上方区域

可以看到上面我和Trae沟通了许多轮,中间由于要求用户头像用div实现, 结果它把棋盘也给改了,如果是个人,我都要骂它个狗血喷头了,然后改完之后也不能指定棋盘恢复为原状,它再也画不好了,最后还是我自己又重新画的。不过好在最终的样子还不错,我们看一下效果:

image.png

第一阶段总结

其实做到这里,我已经能感到Trae带给我的惊艳,也能够感受到它所欠缺的不足。和AI交互是1个耐心活,想要驾驭AI就要多和AI沟通,这个游戏我和T rae聊了几乎快2个小时,才刚刚做到开始,不过也远比我们自己搞来的快多了,期待Trae的未来