用完全新 Qoder，回不去了...

QODER · SKILL TO PRODUCT 用 Qoder 做了个电子书架 先验证想法，再做成能用的产品 一个小时 · 从 Skill 到产品 WEB → SKILL → BOOKSHELF 网页 / 文档 SKILL Website to Book MY BOOKSHELF 教程 蓝皮书 I 蓝皮书 II Browser Use · 检查与修正 想法验证 → 产品交付

4 PARTS · CONTENT MAP

PART 01

先造 Skill

轻量验证，模型对照

PART 02

做成电子书架

从网址到离线书库

PART 03

前端与边界

三个作品，看效果

PART 04

结语

一个下午，交付产品

大家好啊，我是甲木。

前段时间不是刚跟好朋友们一起发布了WorkAgent的蓝皮书么，正好看到这篇推文底下有条评论，说想看印刷的纸质版。

说实话我也想过这事。

但是 AI 领域的内容做书籍出版有个天然矛盾：出版周期长，但AI 更新太快，刚交付新东西又出来了。所以蓝皮书一直用网站形式在更新。

ps.但我们确实有一本书在路上...先行做个预告，跟 skill 相关的

不过转念一想：用户要的可能不是「纸」，是另一种翻阅方式。网站负责持续更新，电子书负责好翻好带，各干各的。

正好看到阿里的Qoder 8 月 27 号做了一次大升级，从 AI 编程 IDE 变成了智能体工作台。新用户上来就有两周 Pro 试用。我就拿这个需求去试它。

而且，现在 Qoder 桌面端有个桌宠，有想法不想打字的时候，可以直接对着它说就行，然后自己进入计划、Coding、执行和验证。

为什么要用Qoder来实现呢？过去⼀年，Qoder 持续深耕Coding Agent，已服务全球600 万⽤户和10 万家企业客户，看看这实力。。。

PART

01

先造 Skill：最轻的方式验证想法

Build a Skill

做东西我习惯先跑个最小版本。这里我先让 Qoder 写个 skill，做可行性验证。

为什么是 skill？因为它够轻。

一个 skill 就是一套打包好的提示词+ 指令，告诉 Agent 拿到输入以后该干什么、按什么顺序干、最后交付什么。

Qoder 有个扩展市场，里面技能就有两万多个 skill，可以指导 Agent 解决不同的问题。

比起直接做一整个软件，先用 skill 试水，成本低、反馈快。不行，换个思路也不心疼。

我把同一个任务分别丢给Auto 模式（它会自己挑选合适的模型）和选择千问 3.8 Max，看看各自跑成什么样。

Auto 模式这边，进来先规划，Plan Mode计划。

之后派了三个子 Agent 分头探路：一个勘察工作区结构，一个搜寻技能范式，一个查验证工具配置。

Qoder 右边面板能看到它挂了哪些技能和数据源，下面步骤条实时跟进度。

千问 3.8 Max这边，风格完全不同。没搞什么子 Agent 分头探索，直接就开始干：跑终端命令，找参考 skill 结构，curl 抓页面。

到写代码阶段差异更明显。千问 3.8 Max搭好 Python 环境，一口气写了116 行。

顺带一提，Qoder 9 月 4 号更新了自定义模型，在原有 GLM、Kimi、MiniMax 等模型的基础上，新增支持OpenAI 和 Anthropic 协议的BaseURL形式，免费版就可以用。在设置里切到「自定义」，添加供应商就能接自己的 API。

回到正题。

Auto 模式跑通 Skill 后，做了个简单的 benchmark。有 skill 的情况下通过率 100%，没 skill 的情况下只有 17%。时间差不多，都在 40 秒左右。

Website to Book这个 Skill 算是验证通过了。

我分别让它给 Qoder 的教程文档和我的两本蓝皮书生成了对应的 PDF，两个模型各跑一遍，效果大家自己对比：

Auto 模式：

千问 3.8 Max：

PART

02

从 Skill 到书架

Ship a Product

Skill 跑通了，说明这事能做。接下来让 Qoder 把它做成一个产品。

我的要求：做一个书架。可以输入任意网址，转换后保存成一本书。攒多了就是一个电子书库，离线也能看。

第一版肯定有问题。有些页面排版崩了，有些图片没抓到。

这时候 Qoder 的Browser Use 就派上用场了：它自己打开浏览器，把转换后的页面跟原站对着看，哪里不对自己回去改代码。

这个改的过程比结果还有意思。写代码 → 跑一遍 →打开浏览器看效果→ 发现排版错位 → 回去改 →再跑一遍验证。几轮下来，排版稳了。

PART

03

前端与边界：哪些成了，哪些还不行

Honest Verdict

书做完了，顺手试了下 Qoder 做前端。

给它的提示词里放了 basement.studio 和 locomotive.ca两个参考站链接。Qoder 有Browser Use，自己会打开参考站，看完再写代码。

CASE 01

HANDBUILT 工作室官网

左边代码区，右边浏览器实时预览。这个 HANDBUILT 工作室官网的效果我觉得可以，大字排版、hover 联动变化、滚动节奏都在。用的千问 3.8 Max。

CASE 02

OBSERVER PRESS 出版物官网

第二个是OBSERVER PRESS，模仿 Stripe Press 的出版物官网。六本虚拟书目，衬线标题，米白纸感底色，书封用 CSS 画的。这个我切了 Grok 4.6 跑，就是前面说的自定义模型，自己接 API 进来。

CASE 03

产品说明书网站

第三个Case 让他做了一个产品说明书网站，整体还挺有工业设计感的。

三个前端，两个模型。效果大家自己判断。

PART

04

结语

FINAL TAKE

回到开头那条评论。

蓝皮书的内容一直在网页上更新，缺的就是一个随手能翻的形式。这次从一个 skill 开始验证，跑通了做成书架，中间还顺手试了三个前端、换了两个模型。一个下午，从想法到能用的产品。

Qoder 8 月底这次升级，从写代码的工具变成了能帮你做东西的工具。编程的底子还在，但用的人不一定要懂代码了。做什么、做成什么样、哪里要改，这些还是你说了算。它负责执行，你负责拍板。

今天Qoder刚更新了手机远程控制能力，随时随地就能指挥本地电脑和云端Agent干活！

对了，官⽅这边也给了我一些粉丝福利，填码注册有额外福利，评论区见！

以上。

我是甲木，热衷于分享一些AI干货内容，同时也会分享AI在各行业的落地应用。觉得有用的话，点个赞、在看、转发三连，谢谢大家。

/// END · FROM SKILL TO PRODUCT