不用设计软件:我让 AI 用网页代码做封面图
写 Pi 1.0 实测那篇时,我没有打开任何设计软件,封面图是 AI 用 HTML 和 CSS 排出来、再用浏览器导出的。这篇把四个步骤拆开讲:先有真实素材、再想版面、用网页排版、导出后检查。改一个字几秒钟就能重新出图。
B-01 · POSTS
做过的事、用得上的方法,以及过程中的判断与修正。
写 Pi 1.0 实测那篇时,我没有打开任何设计软件,封面图是 AI 用 HTML 和 CSS 排出来、再用浏览器导出的。这篇把四个步骤拆开讲:先有真实素材、再想版面、用网页排版、导出后检查。改一个字几秒钟就能重新出图。
Pi 在 10 天里从 0.87 连发到 1.0,最重要的升级是 Codemode:让 AI 写一段脚本一次把活干完,而不是一趟一趟地调用工具。我用同一个任务各跑 4 次做了对比:工具调用从 17 次降到 2 次,token 少了 61%,花费少了 72%。
BopoType 原来只有一个测速页,想同时接住“打字练习”“中打测验”“注音键盘”“英打”“打字游戏”所有搜索。改版时我把它拆成了 6 个工具页和 2 篇指南,每个页面只回答一个需求。这篇讲怎么拆、拆完之后技术上要做哪些事,以及为什么体验问题要和 SEO 一起修。
用 Ego Lite 加一个开源 Skill,让 Agent 采集 X 推荐页和自己主页的推文,统计哪类内容被收藏、哪类只被点赞,再给出涨粉方案。附提示词、脚本和我自己的分析结果。
一篇写给潜在合作者的说明:我能做什么、怎么开始、做到什么程度算完成,以及哪些需求我会直接说“不值得做”。
很多网站做完没人看、没人联系,问题往往不在设计和技术,而是在开工之前没想清楚。这是我接网站项目时一定会先问的 6 个问题,你也可以自己先回答一遍。
打字测速工具,用户只在乎两件事:打开快,打起来顺。BopoType 是我给台湾用户做的注音打字测速网站,这篇讲为了“快”做的几个取舍:纯前端、本地运算、声音反馈,以及让工具页同时也是一篇好指南。
XiMD 是我做的 macOS Markdown 编辑器:行内所见即所得、原生毛玻璃界面,常驻内存约 90MB。这篇讲它从两年前一个网页版小工具开始,到这次为什么选择 Tauri,以及还没做好的地方。
第一次做 Agent,最常见的失败不是技术问题,而是一开始就选错了流程:太大、太模糊、错了代价太高。这篇给出 4 个判断问题和一张打分表,帮你挑出最适合当“第一个试点”的那段工作。
“哪个 Agent 最好用?”这个问题本身就问错了。它们形态不同、适合的人不同、风险也不同。这篇给出一张对照表和 5 个判断条件,帮你在 5 分钟内缩小范围。
把一段工作交给 AI,最常见的问题不是模型不够强,而是没把事情说清楚。这篇拆开一个 Skill 的五个部分,附一份可以直接改的 SKILL.md 模板和写完后的检查清单。
AgentClaw 从一个 OpenClaw 教程站,变成按任务组织的 AI Agent 学习平台。这篇复盘写的是几个关键取舍:先问读者要完成什么,把完成标准写在前面,并且说清楚每篇内容到底验证过什么。
Vizruna 是我做的本地 Agent 工作台,一个多月里发了 10 个 Alpha 版本。这篇不讲功能清单,只讲做下来最重要的 5 条原则:过程要看得见、用到才加载、上下文要管、“完成”要有证据、改进要能比较。
用 Agent 写 Vizruna 这一路,最有用的不是更强的模型,而是两份文字:一份是给所有项目用的“工作守则”,一份是给这个项目用的“任务合同”。这篇把两份说明拆开讲,附上可以直接借用的写法。
Pi 是一个极简的编程 Agent:默认只给模型 read、write、edit、bash 四个工具,其他能力全靠按需安装。我用它写出了 Vizruna。这篇讲为什么“少”反而好用:更轻、更省 Token,而且每一样能力都由你自己决定。
Thai Work Tools 是我做的泰语职场工具站,第一个工具只做一件事:生成一封泰语辞职信。这篇讲为什么从这么小的需求开始,为什么坚持不上传用户数据,以及“工具 + 指南”这个组合。
AI 图像工具最难定价的地方在于:用户在付费之前,不知道结果好不好。Piximagi 的答案是把“试”和“用”分开:预览便宜、带水印,高清和 4K 按质量付费。这篇讲这套定价是怎么想的,以及上线第二天就修掉的一个问题。
AI Story 是我做的英文儿童故事生成器。给用户一个空白输入框很容易,让用户知道该写什么却很难。这篇讲 AI Story 怎么把开放式写作收窄成四个选择,以及从第一版到“独立主题页”的几次迭代。