1. 摘要
用TRAE SOLO 做了个叫「豆绘 BeadForge」的小工具，专门用来设计拼豆图案。能直接上传图片转成像素画，也能打字让 AI 帮你生成图案，还能算出来做这个要多少颗豆子、大概多少钱。从有想法到能跑，就花了不到半小时，然后反复调整，我自己不懂前端技术，全程靠 TRAE SOLO 帮我写的代码。
2. 背景
我是一名建筑学本科生，平时没课的时候喜欢拼拼豆。
但问题是每次想做个新图案都特别麻烦——要么自己在方格纸上画，要么用 PS 把图片转成像素再一个个对颜色，一套下来时间全花在作图上了，真正拼豆的时间占不了多少。
现有的工具要么是太过于臃肿，要么是功能不全，要么是太丑，要么就是收费太多。
我就想啊，能不能有个工具，把图片丢进去，自动给我匹配好拼豆颜色，然后直接出一张带编号的图纸，我照着拼就行？顺便还能告诉我每种颜色要多少颗，大概花多少钱。搜了一圈发现现有的工具要么太丑，要么功能不全，干脆自己做一个算了。
3. 实践过程
我是怎么想的
一开始其实没想搞这么全，就想弄个简单的画板能涂涂格子就行。结果跟 SOLO 聊着聊着，功能越加越多，最后搞成了现在这个样子。大概分了这么几块：
- 画板部分：能画像素、擦除、填充、取色，基本操作都要有
- 颜色库：把 Perler 官方的 70 多种颜色都塞进去，按色系分类
- 图片转换：上传一张照片，自动转成像素风格，还能选用几种颜色
- AI 生成：打字描述想要的图案，让 LLM 生成像素数据
- 统计导出：算豆子数量、预估成本、打印带编号的图纸
跟 SOLO 怎么配合的
其实就是不停地跟它说人话。比如一开始我就说：
“帮我做个拼豆设计工具的网页，左边放工具栏和颜色选择，中间是画板，上面放几个按钮。风格要好看一点，像 iOS 那种毛玻璃效果。”
然后 SOLO 就给我生了一版。我看了觉得还行，但颜色库太简陋，就说：
“颜色太少了，我要 Perler 官方的颜色，70 多种，按白色、黄色、橙色、红色、粉色、紫色、蓝色、绿色、棕色、灰色分类。”
它就给我整了一套完整的数据。后面图片转换、AI 生成这些功能也是这么一个个加上去的。
踩过的坑
- 颜色匹配算法：一开始直接取最近色，效果很烂，颜色断层严重。后来加了 Floyd-Steinberg 抖动算法，过渡自然多了，但计算量也大了。最后折中了一下，小图用精确匹配，大图用快速匹配。
- 大画布卡顿：刚开始没做优化，画布设成 100x100 就开始卡。后来 SOLO 帮我优化了渲染逻辑，只重绘变化的部分，还加了个性能警告，超过一定尺寸就提醒用户。
- 打印样式：网页上看好好的，打印出来乱七八糟。调了好几版 CSS，最后单独写了一套打印样式才搞定。
4. 成果展示
现在能干嘛
| 功能 | 具体能干啥 |
|------|-----------|
| 像素画板 | 画笔、橡皮、填充、取色，撤销重做，键盘快捷键都有 |
| 图片转拼豆 | 拖张图进去，选想要几种颜色，一键转换。还能开抖动让颜色过渡更自然，或者自动去掉背景 |
| AI 生成图案 | 打字描述"一只像素风格的小猫"，生成提示词去 ChatGPT/Claude 跑，把返回的 JSON 贴回来就能生成图案 |
| 成本估算 | 实时显示用了多少颗豆子、几种颜色，还能设单价看总价（义乌豆 0.001/颗，进口 0.026/颗）|
| 导出打印 | 可以导出 PNG，也可以打印带颜色编号的图纸，照着拼就行 |
| 保存导入 | 作品存成 JSON，下次打开继续弄 |
一些截图
代码仓库
5. 效果与总结
省了多少事
以前做一张拼豆图纸，PS 转像素 → 手动对颜色 → 数豆子 → 手动画编号，两三个小时起步。现在用 BeadForge，图片丢进去调两下，三十秒，还能直接打印。
SOLO 到底帮了啥
说实话，如果没有 SOLO，这个项目我根本做不出来。我不是程序员，让我自己写代码连门都摸不着。但 SOLO 让我可以只操心"我要什么"，不用管"怎么实现"。颜色匹配算法、本地存储、文件导出这些技术细节，我完全没碰，全是 SOLO 搞定的。
一点心得
- 别想着一次说完：一开始需求不用太细，先跑个大概，再慢慢加功能。SOLO 改代码很快，不用担心返工。
- 不同模型负责不同功能：doubaoseed和kimi负责撰写plan，glm5.1负责编写代码，
- 让 AI 做它擅长的：复杂的算法、繁琐的样式调整，交给 SOLO；产品方向、用户体验，你自己把控。
这次搞完最大的感受是，做一个小工具的成本被压到了极低。以前需要懂设计、懂前端、懂算法才能做的东西，现在只要你能说清楚要啥，SOLO 就能帮你做出来。感觉以后会有越来越多这种"小而美"的工具冒出来，因为做它们的门槛已经低到忽略不计了。