MoldPage：把「找工作的痛」做成产品的两周

📍 真实案例

一个求职者刚做完自己的个人主页，屏幕上是网页 mockup，旁边有时钟显示 30 分钟

一个找工作时的痛

洁柔投简历时，每天都在重复一件事——把 PDF 简历发出去，然后等回信。

3 周过去，回信寥寥。

她意识到一个真问题：「我跟所有人长得一样」。

同样的 PDF 模板
同样按时间倒序的工作经历
同样的 bullet point 描述
没法放项目截图、没法嵌视频、没法链接 demo

她想做一个自己的个人主页——能放项目图、放过往作品、链接 GitHub / 公众号 / 视频号。但市面上的方案她都不满意：

Wix / Squarespace：贵、模板浮夸、不像作品集
Notion 公开页：不专业、URL 怪
自己写 HTML：不懂代码
Cursor（AI 编程编辑器）/ ChatGPT 帮我写：她试了，AI 每改一处都要把整页几千 token 的网页代码读一遍、再写一遍，免费额度撑不了几轮修改——没订阅 AI 服务的求职者根本扛不住

她想：「求职者大部分根本没 AI 订阅，连 Cursor 都没听过。这事得我自己做。」

两周后，MoldPage 上线 —— 不懂代码 + 用免费 AI 的人，也能 30 分钟做出图文并茂的个人主页。

求职者投简历石沉大海 / 没有作品展示页的痛

灵魂洞察：给 AI 改的东西，按 AI 的习惯设计

洁柔为什么能做到「用免费 AI 也建得起来」？

她做了一个反直觉的决定——

用 MoldPage 的人不会自己改网页代码，动手改的是 AI。那为什么还要让 AI 去啃给人手写的 HTML？ 换一种 AI 好读、好改的格式就够了。

平常让 AI 改网页，它得把几百行 HTML（网页代码）整个读一遍，找到要改的地方，再把代码重写一遍，还得祈祷别改坏别处。改一句自我介绍，几千个 token 就没了。

MoldPage 的做法是这样的：

页面不再是 HTML，而是一份结构化的 JSON（一种按「字段名：内容」整理数据的文本格式）：页面信息、主题、每一段版块各放各的位置
字段名写全、正常缩进，人和 AI 都看得懂——省 token 靠的不是把代码写丑
要改哪一段，AI 就只把这一段的几个字段发给 MoldPage 的接口（API，程序之间约好的调用方式），不用读整页、不用重写整页
怎么把 JSON 变成好看的网页，交给预先写好的渲染引擎（下一节讲）

结果：

按项目自己公布的数字，改一处从约 3,500 token 降到约 100 token，省了约 97%
生成一整页个人主页，JSON 也就几千 token
项目测过 5 个免费用的 AI（ChatGPT 免费版、Gemini、Grok、Claude 等），第一次就都做成了
求职者不用花一分钱订阅 AI

一大摞网页代码 vs 一小张数据卡片，中间一个向下的箭头

牺牲是什么：得有人先把渲染引擎和主题写好；页面也只能用引擎支持的那些版块（11 种），不能像手写 HTML 那样想怎么排就怎么排。但用 MoldPage 的人要的就是一个像样的个人主页——版块够用就行。

这是个「目标用户决定取舍」的经典设计判断 —— 真正动手改网页的是 AI，那就让页面格式迁就 AI；用户只管看渲染出来的网页。开头归档框里说的「砍掉人类可读这一层」，砍掉的就是这层给人手写、手改的 HTML，不是把代码写得没人看得懂。

架构：AI 只写数据，引擎负责渲染

AI 输出一小段数据 → 引擎工厂 → 渲染出完整网页

完整架构：

求职者（用免费 AI）              MoldPage
──────────────────────────────────────────────
1. 把主题的「配方」贴给 AI
2. 回答 AI 一个个问的问题
3. AI 输出页面 JSON ─────────→  4. 服务器收下、存好
                                 5. 浏览器打开页面时，
                                    通用引擎 + 主题插件
                                    把 JSON 画成完整网页
6. 以后要改：AI 只提交那一段 ──→  7. 服务器只更新那一段

分工：

AI：照着「配方」（recipe，每个主题一份写给 AI 看的说明）问问题、填内容，只输出 JSON
通用引擎（mold-core.js）：解析 JSON、生成页面结构、做动画和多语言，跟具体主题无关
主题插件（每个主题一个 *.theme.js 文件）：管配色、版式和每种版块长什么样，写好后自己登记到引擎里，加新主题不用改引擎
服务器（Node.js + Express）：收下提交的页面、提供按段修改的接口、生成查看链接
用户视角：只看到一个干净的渲染网页，完全无感

这就是为什么 MoldPage 能让免费版 AI 跑起来 —— 重活全在引擎和主题里，AI 只产出一段数据。

主题：按风格起名，标上适合的方向

示意图：写作、时尚、金融、IT、户外五个职业方向的卡片

上面这张是写作时按职业方向画的示意图。实际上线的是 6 个按视觉风格命名的主题，每个主题下面再标上适合的方向：

主题	风格	标注的方向
Golden Hour	暖色、电影感	创意
Sterling	藏青配金色	金融
Aurora	青色、未来感	科技
Bloom	渐变、杂志风	设计
Ink	黑白、衬线字体（像报刊的印刷字）	编辑出版
Neon	赛博朋克、霓虹光	音乐

选完主题之后，每个主题内部还有几种配色，在编辑器里就能切换，不烧后端。

为什么这样设计：

风格用名字和关键词说清楚，求职者一眼就知道每个主题长什么样
每个主题标上适合的方向，知道自己做哪一行的人可以先按方向挑，不用在抽象审美里纠结

用户的 30 分钟体验

挑主题 → 挑配色 → AI 生成 → 上线

当时，一个完全不懂代码的求职者，30 分钟流程：

时间	用户做的事
0–2 分钟	进 MoldPage 首页，挑一个主题（比如适合科技方向的 Aurora）
2–5 分钟	选一种配色（之后在编辑器里也能换）
5–10 分钟	一键复制这个主题的「配方」，贴给免费版 AI
10–20 分钟	回答 AI 一个个问的问题：名字、职位、做过的项目、技能
20–25 分钟	补上项目截图、视频链接
25–30 分钟	提交发布，拿到自己的 `moldpage.dev/view/名字` 链接

30 分钟后，她就有了一个可以发给招聘方的链接——不是 PDF、不是 Notion 公开页、是一个看起来专业的个人主页。

两周的真实节奏

阶段	时间	做的事
Week 1（MVP）	2026 年 4 月上旬	通用引擎骨架 + 第一个主题 + 给 AI 的配方和 JSON 格式 + 提交接口，端到端跑通（网址能打开）
Week 2（打磨）	又一周	扩到 6 个风格主题和多种配色 / 手机适配 / 引导问答 / 打磨文案 / 上线 moldpage.dev 域名

两周后,效果还不错——洁柔用她自己的 MoldPage 作品集再投出去时，回信率明显上升。自己的痛点，自己解决了。

Claude Code 在每一步做了什么

整个项目，洁柔自己不会写 JS/Python 代码 —— 全程跟 Claude Code 说人话，它写。

Week 1 关键瞬间

挑技术栈：跟 Claude 商量后，定下最常见、资料最多的组合——服务器用 Node.js + Express，页面交给浏览器里的原生 JavaScript 渲染，没有用 React 这类框架。
设计给 AI 用的页面格式：这是最磨人的一步——怎么让格式既好让 AI 读写，又能让程序直接解析？ Claude 提了几种方案，最后定下结构化 JSON：页面信息、主题、各个版块分开放，字段名写全。再配一份写给 AI 看的「配方」，规定 AI 必须按固定结构输出、按固定顺序向用户提问。
写引擎和服务器：浏览器端的通用引擎负责把 JSON 画成网页，Node + Express 服务器负责收下提交的页面、提供按段修改的接口。Claude 一晚上写完 v1，后来又把引擎拆成「通用核心 + 每个主题一个插件」，加新主题不用动核心。

Week 2 关键瞬间

做 6 个风格主题：洁柔逐个描述每个主题想要的感觉和适合的方向，Claude 把每个主题写成一个插件文件，负责配色、版式和各种版块的样子。
加引导流程：让小白能「被牵着走」——对话式问答，每一步只问 1 件事，避免一上来贴大表单吓退人。
手机适配：很多求职者是在手机上看、在手机上改，不能只做桌面。Claude 把所有主题都做成了能跟着屏幕宽度自动换排版的样子。
打磨文案 + SEO：着陆页文案、SEO meta（写给搜索引擎看的页面说明）、Open Graph 卡片预览（链接被转发时显示的预览卡片）——Claude 一上午全部出完。

三个看 MoldPage 能学到的产品观

💡 1. 目标用户决定你能砍多少

给程序员的工具 → 必须代码可读（他们要 fork，也就是复制一份自己改）
给设计师的工具 → 可视化编辑 + 所见即所得（WYSIWYG）
给求职者的工具 → 他们不碰代码、动手改页面的是 AI，页面格式就可以按 AI 的习惯设计

洁柔的核心判断：把「目标用户根本不需要的功能」砍光，你的成本立刻下来。

💡 2. AI 时代，反直觉的设计赢

正常做网页，页面格式是照着「人手写、人手改」设计的。MoldPage 看到真正动手改的是 AI，就把页面换成 AI 好改的 JSON，再配上只改一段的接口——改一处的成本降到原来的约 3%。

但要分清两件事：给 AI 读写的数据格式，可以按 AI 的习惯设计；你自己要长期维护的代码，照样要写清楚。MoldPage 的引擎和主题代码以后也要靠 AI 维护，命名清楚、结构清晰，AI 才少出错。

这种「反直觉但顺着 AI 习惯」的设计——要等 AI 真的开始动手干活，才值得这么做。

💡 3. 痛点最好「自己亲身经历」

洁柔做 MoldPage 不是「市场调研」出来的——她自己投简历投到崩溃，她知道没有作品集页是什么感觉。

最好的产品都来自创始人自己的痛点——因为你不会半路放弃(自己是用户)，也不会做错方向(自己是评测员)。

三个想做类似产品的人最容易踩的坑

❌ 坑 1：一开始就想做「全功能」

「我做一个个人主页生成器，顺便加博客 / 评论 / 多语言 / SEO 工具…」

踩坑：全功能 = 永远做不完。MoldPage v1 只做「主题 + 配色 + AI 生成 + 一键发布」，其他全砍。

修正:MVP 极简——能解决 1 个核心痛点就上线，其他功能用户用着用着会告诉你他要什么。

❌ 坑 2：为程序员优化，忘了真实用户

「页面格式要方便人手写手改，最好还能直接拿 HTML 去编辑…」

踩坑：你的用户不会自己改网页代码，动手改的是 AI。照着「方便人手改」去设计页面格式，AI 每改一次都得读写整页，免费版额度很快就不够用。

修正：优化你目标用户真实使用的环节（对 MoldPage 是「30 分钟体验流畅 + 免费版 AI 扛得住」）。但别走到另一头：给 AI 读写的格式可以按 AI 的习惯设计；你自己要长期维护的代码，照样写清楚——引擎和主题以后还要靠 AI 维护，命名清楚、结构清晰，它才少出错。

❌ 坑 3：技术栈追新

「我用 Bun + Hono + 新框架 X…」

踩坑：新框架学习成本远超工具本身的价值。MoldPage 选的是 Claude 最拿手、资料最多的常见技术（Node.js + Express + 原生 JavaScript）——洁柔自己不写代码，就挑 AI 最熟的，出了问题它也最会修。

修正：用你（和你的 AI）已经熟的栈做产品。新技术留到不重要的项目去练手。

MoldPage 上线时的样子

当时上线在:moldpage.dev(如开头归档框所说，项目已停止维护，站点保留到 2027 年 4 月)

它适合谁——这个定位思路今天依然值得抄：

✅ 正在找工作 + 想要个人主页的人
✅ 不懂代码 / 不订阅 AI 服务的求职者
✅ 想给作品集 / 自由职业 / freelancer 找一个像样链接的人

不适合谁:

❌ 已经有自己的网站架构师(你自己写更便宜)
❌ 公司官网级别需求(MoldPage 是个人主页，不是企业站)

这套案例的核心信息

MoldPage 不是一个「建站工具」，是一个「痛点定向的设计判断」:

目标用户的边界，决定你能砍多少成本。

洁柔把「给人手改的网页格式」换成「给 AI 改的 JSON + 只改一段的接口」，换来「免费版 AI 也能扛」。你的目标用户决定你的产品能简到什么程度。

这就是 AI 时代普通人创业的真实剧本——不是做一个「什么都行」的工具，是做一个「对我的目标用户砍到极致」的工具。

还差最后一篇

读完 MoldPage 这一篇，你已经看完了「真实案例」5 篇里的 4 篇：

✅ AI 是配人格的伙伴 → 一窝 Claude bot
✅ 30 字需求 3 天能上线网页 app → 自建 Web Chat 三天上线
✅ 一周做一个小工具是新常态 → 工时表 + 墨水屏看板
✅ 痛点 + 目标用户 + 反直觉设计 → 你正在看的这一篇 MoldPage
→ 最后一篇：niuxue.org 自己是怎么搭起来的（8 小时搭站 + 真实踩坑）——下一步打开它

下一步

→ niuxue.org 是怎么搭起来的：本站自身案例 —— 案例板块终篇，本站的真实搭建路径

想再进一步？

进阶玩法都已上线：

Claude Code 进阶——VS Code 插件、桌面 App、Hooks、MCP、Subagents、Worktrees(程序员玩法)
自动化与协作——Routines、Remote Control、Channels、Agent Teams、Safe Autonomy(老手专属)