共计 3683 个字符,预计需要花费 10 分钟才能阅读完成。

大家好,我是人月聊 IT,今天简单分享一下我对 Trae Solo 的初步体验,先给出一些结论。

5. 输出速度偏慢,整体性能一般,等待时间较长。如果在 Vibe Coding 模式下开发效率和输出性能无法得到提升,建议谨慎使用。一次迭代和等待周期过长,实际上还不如将需求任务进行分解,分阶段输出。
接下来,我们来看看实际的测试任务,要求 AI 帮我们实现一个摇卦的应用,使用三个铜钱。

具体提示词如下:
请用 html5 和 js 开发一个三个铜钱摇卦的小应用。铜钱的正反面图片已放在当前项目目录,点击开始可以看到三个铜钱抛起的动画效果,随机落地形成不同的正反面。需要基于铜钱的算卦预测法,给出对应的卦象及动爻,并解释该卦。请注意界面美观易用,摇卦动画效果要自然,其他内容可自行完善。
首先,Solo 进行了任务规划,规划内容如下:
功能概述
技术方案
- 采用纯前端技术,使用 HTML5、CSS3 及原生 JavaScript,无需使用第三方库。
- 动画效果结合 DOM 与 CSS3 transform(rotate/translate),使用 requestAnimationFrame 实现简单的物理效果(重力、弹跳、旋转减速)。
- 资源使用已存在的图片:
铜钱正面_透明.png(记作“正面 = 阳 =3”)、铜钱反面_透明.png(记作“反面 = 阴 =2”);映射可以在设置中切换以适应不同流派。 - 结构设计:
index.html:布局与交互入口styles.css:主题与动效样式app.js:核心逻辑(动画、随机、卦象计算、渲染)yijing-data.js:64 卦的元数据(卦名、上下卦、简要解读)与 8×8 卦矩阵映射
算卦规则与实现细节
- 每枚铜钱的取值为:正面 =3(阳),反面 =2(阴);一爻之和为:6/7/8/9。
- 6= 老阴(动阴,画“— —”,标记动)
- 7= 少阳(静阳,画“——”)
- 8= 少阴(静阴,画“— —”)
- 9= 老阳(动阳,画“——”,标记动)
- 六爻从下往上得到本卦;动爻处的阴阳反转得到之卦。
- 上下卦拆分:下三爻为下卦(内卦),上三爻为上卦(外卦)。
- 卦名查询:根据上下卦(八卦)在 8×8 矩阵中查找对应卦(使用通用文王卦序矩阵)。
- 解读内容:
- 本卦给予简要说明(卦象含义、整体趋势)。
- 若存在动爻:列出动爻序号(如“二、五爻动”),生成之卦并简要说明;提示“以之卦为用”。
- 版本 1 先提供每卦 1 - 3 句的现代语简解,后续可扩展爻辞、彖辞与象传。
界面与交互设计
- 顶部:包含标题与“开始摇卦”按钮;右上角设置(是否启用声音、动画速度、正反映射)。
- 中央“桌面”区域:三枚铜钱初始叠放;抛掷动画在此区域发生,带有轻微阴影与运动模糊效果。
- 右侧面板:
- 六爻进度条(自下而上),实时绘制阴 / 阳线,动爻高亮标识。
- 本卦 / 之卦名称、上下卦、动爻列表。
- 底部结果区域:
- 本卦简解、之卦简解。
- 操作选项:再摇一次、保存结果图片。
- 适配移动端:按钮尺寸充足,文本中文排版优化,支持暗色 / 亮色主题。
动画细节
- 每次抛掷三枚铜钱并发:
- 随机初速度(向上)及旋转角速度(绕 X /Y/ Z 轴),同时加上重力与地面碰撞(可进行 1 - 2 次弹跳)。
- 减速后根据随机结果锁定为正面或反面,平滑停留在桌面不同位置,避免重叠。
- 添加细节:阴影缩放、轻微金属音效(可关闭)、运动模糊(CSS filter)。
数据设计(yijing-data.js)
TRIGRAMS:八卦编码与名称(乾、兑、离、震、巽、坎、艮、坤),及三位二进制表示(阳 =1,阴 =0)。HEX_MATRIX[upper][lower]:8×8 矩阵映射到 64 卦索引与卦名(按照通用表)。HEX_META[hexKey]:包含中文名、序号、上下卦名、简要解读(2- 3 句)。- 可拓展:
LINE_TEXT[hexKey][lineIndex]存储爻辞简解,后续版本可加入。
主要函数(app.js)
startCasting():初始化状态,触发 6 轮抛掷。throwThreeCoins(round):执行第round轮动画,返回三枚结果(2 或 3)。toLineType(sum):6/7/8/ 9 的转换为阴 / 阳及动爻状态。buildHexagram(lines):从 6 条线生成本卦的键值,标注动爻,生成之卦。hexagramName(hex):查询卦名与上下卦名。renderProgress(round, line):绘制右侧六爻进度。renderResult(mainHex, changedHex, movingLines):渲染最终的解读与操作区域。saveSnapshot():将结果区导出为图片(采用叠绘或html2canvas的纯替代方案)。
文件结构
index.html:语义化结构(header/main/aside/footer),预留桌面容器与结果面板。styles.css:- 主题色(古铜金与墨色)、中文字体优化、动效样式类。
- 响应式布局、阴影 / 模糊 / 高亮效果。
app.js:状态机(轮次 0 -5)、动画控制器、卦象计算与渲染逻辑。yijing-data.js:八卦与 64 卦之间的映射、简解数据。
验证与测试
- 功能验证:
- 6 次抛掷后必得一卦,动爻反转正确生成之卦,卦名与上下卦匹配。
- 随机性:多次摇卦结果分布合理,不出现异常。
- 视觉验证:
- 动画流畅(目标为 60fps);桌面与阴影效果自然;停留位置不重叠。
- 兼容性测试:支持桌面 Chrome/Edge 与主流安卓 / 苹果移动端浏览器。
后续可扩展功能
- 增加“手动定爻”和“单次抛掷模式”。
- 提供完整爻辞、彖辞、象传与占断建议,动爻多条时的选择提示。
- 实现历史记录与分享图片功能(包含日期与问卜事项)。
- 增加声音效果与更细腻的物理模拟(更真实的旋转与碰撞)。
请确认以上方案,确认后我将按照此结构创建页面与脚本,并接入您提供的铜钱图片,以完成动画与卦象解读。
基于该任务规划方案,输出了完整源代码,具体执行界面如下:

总体来说如下:
继承相同的提示词,我们使用 iflow 结合 Qwen 进行了测试与验证。最终的效果如下所示:

从上面的图像中可以观察到,整个界面的用户友好性和视觉效果得到了显著提升,然而三个铜钱的抛投随机动画效果比起 Solo 稍显逊色,此外,对卦象的文字解释也较为普通,未能充分体现变卦的核心思想。
最后,我尝试使用 Claude4.5 大模型进行再次实验。在前面的基础上,微调了一些提示词,具体内容如下:
请帮我用 html5 和 js 开发一个包含三个铜钱摇卦的小应用。铜钱的正反面图片已存放在当前项目目录中。点击开始后,可以看到三个铜钱抛起的动画效果,呈现出随机的抛投效果,十分真实。随后,铜钱随机落地,显示出不同的正反面。接着,请根据铜钱的算卦方法,给出对应的卦象及具体动爻,并提供对该卦的解释。卦象的绘制中,阳爻应使用红色底色,阴爻则用黑色底色,阴爻之间的两个断开矩形需间隔 10px。务必确保界面的美观与易用性,摇卦的动画效果也需逼真,其余部分请自行完善。整个应用无需启动 http 服务器便可正常访问与使用。

最终,ClaudeClode 一次性成功输出,整体效果完全达标。
综上所述,当前 AI 编程的竞争不再限于 IDE 或 CLI 工具,关键在于底层大模型的能力。Trae 目前下架 Claude 大模型所带来的影响显著。当然,从辩证的角度来看,这也可能加速我们自身编程大模型的研发进程。


功能设计很有趣,但实际输出的质量让我有些失望。希望在后续版本中能加强细节处理,提升结果的准确性。