让大师帮你「偷」设计。
「优秀的艺术家模仿，伟大的艺术家偷窃。」
good artists copy, great artists steal —
把你想要的设计风格，先给出三个版本。你确定一版、吐槽另外两版哪里不好，它据此重新生成 DESIGN.md——你的 agent 拿着这份文件，去精准修改你的产品。
用 AI 做设计最常见的失败不是「做得丑」，而是：
「做出来的和我想要的不是一个东西，但我说不清哪里不对。」
等页面写完再返工，成本已经付掉了。
列宾只做一件事：把设计方向提前具象化到一个能被否决的形态——三个用你的真实文案渲染的方案，并列在一张 HTML 上，让你指着说「要这个、不要那个、那个的圆角太软了」。
你骂出来的那句原话，才是真正的设计约束。
装好之后，直接说人话就行：
照着这个网站做一个 → https://example.com
帮我这个落地页定个设计风格
我想要那种高级感（什么参考都没有也可以）
Claude 会自动走完五步：
| 步骤 | 做什么 |
|---|---|
| 1 · 收料 | 参考是什么（我想要那样）？要设计的是什么（我现在是这样）？已经有页面就直接给网址——真实文案、真实密度一起白拿 |
| 2 · 定轴出样张 | 三个变体沿一条明确的轴排开，每个渲染三屏：首屏 / 核心操作屏 / 空状态 |
| 3 · 确认对话 | 选哪个？另外两个哪里不要？你的用户在什么状态下打开这个产品？ |
| 4 · 回写 DESIGN.md | 用 Google Labs 的 DESIGN.md 规范，把你的原话逐字写进 Don'ts，每个数值标出处，并附上实现时的创意指令原文 |
| 5 · 验收 | 页面落地之后回来看一眼：样张和成品并排，只问「这跟你当初选的还是同一个东西吗」 |
产出一份 DESIGN.md，交给 Claude Code / Codex 去写代码。列宾不替你开发产品——第五步也不写代码，只回答「像不像」。
轴不是随机的。 三个「随机好看」的方案，你选完什么也没学到。轴由「你缺哪类信息」决定：
| 手上有 | 缺的是 | 贴着做 | 取其神 | 反着来 |
|---|---|---|---|---|
| 一张截图 | 精确数值 | 紧凑 | 基准 | 舒展 |
| 网址或 DOM | 意图与取舍 | 结构、密度都搬 | 只取味道 | 故意反着来 |
| 一份 design md | 落到你内容上的合身度 | 密度高 | 中 | 低 |
| 只有一句话 | 全部 | 最字面的解读 | 另一种味道 | 故意反向 |
三版的名字固定为「贴着做 / 取其神 / 反着来」，不许另起。 变的只是它们在这条轴上的意思。
第三个变体故意偏离参考。 你贴那张图的时候，往往并不真的想要那张图，只是没有别的语言描述自己想要什么。第三个变体的作用，是把这件事逼出来。
空状态屏一定要渲染。 那是最能暴露一套风格撑不撑得住的地方，也是所有 AI 生成的样张都会跳过的地方。绝大多数「看着挺好后来崩了」，都崩在第二三屏。
名字叫「偷设计」，线得划清楚。
可以拿「怎么做」：版式骨架、留白比例、字号层级关系、色彩之间的对比关系、节奏和密度。这些是设计判断，本来就靠互相看长进。
不能拿「那一份东西」：logo、没授权的字体文件、图片和插画素材、成段文案、有版权的图标集。
灰的地方问一句：换掉我的内容之后，还有人会把这两个页面认错吗？ 会，就是搬了；不会，就是学了。
代码同理——先看 license，没写 license 的默认按不可用处理。
- 数值崇拜 — 参考里的
-2.46px字距是 80px 拉丁标题下的-0.031em。照抄到 48px 中文标题上会挤成一团。所有间距一律转 em 再迁移，中文标题不用负字距。 - 占位文字 — Lorem ipsum 会让所有方案看起来都还行。中文文案的长度、语气、断行会彻底改变一个设计成不成立。
- 只给一个方案 — 单方案只能换来「嗯挺好的」或「感觉不太对」，两种回答都零信息量。
- 替用户写 Don'ts — 模型生成的负面约束永远是「保持一致性」「避免视觉噪音」这种正确的废话。Don'ts 这一段只能由人填。
- 模型平庸设计 — 方向锁定之后，模型仍容易交出一份安全、规整、没有判断的默认稿。创意指令逼执行 agent 在未确定的选择上做具体取舍，不要退回同质化的中间值。
下载技能包： 落地页的使用区提供「下载列宾 Skill」。在支持导入技能的工具中上传 ZIP；使用本地技能目录的工具，将解压后的完整 liebin/ 文件夹放进指定目录。详见 安装说明。不同工具的运行能力不同，导入成功后仍需确认样张生成能正常执行。
Claude Code 命令行安装：
git clone https://github.com/ShaohuaDavidLee/Liebin.git ~/.claude/skills/liebin重开一个 Claude Code 会话即可生效，或直接 /liebin 调用。
放进项目里只给这个仓库用也行：克隆到 .claude/skills/liebin。
维护下载包： 修改 SKILL.md、references/、运行脚本、样张模板或安装说明后，在发布落地页前运行 python3 scripts/package-skill.py，一并提交生成的 site/downloads/liebin-skill.zip。它使用固定的打包元数据，并只包含技能运行资料；不会打包落地页、Git 目录或用户任务内容。当前静态站无构建命令，因此 ZIP 随站点文件一起发布。
SKILL.md 主流程：五步走完，什么时候该停，能偷什么不能偷什么
references/
intake.md 四条收料入口，各自能拿到什么、必然缺什么
variants.md 三变体怎么分轴、怎么渲染、拿到反馈之后怎么定位
design-md.md DESIGN.md 八小节规范 + 来源标注 + CJK 扩展 + lint 的四个坑
verify.md 验收：唯一必须回答的一问、六项体检、工具的盲区
scripts/
proof.mjs 样张脚手架，无依赖。拦占位文字，拦不满三屏
proof.test.mjs 脚手架自检
verify-page.mjs 验收体检，要 playwright。装不上有保底路径
assets/
preview-template.html 不用脚本时的手搭模板
evals/
evals.json 触发准确性与流程完整性测试
site/ 落地页静态站（Cloudflare Pages 产出目录）
wrangler.toml Pages 配置
两个脚本都是可选的。proof.mjs 只替你搭外壳，三个变体的内容还是得自己写；verify-page.mjs 装不上就退回肉眼——
把落地页截图和样张并排贴回对话里，那条路任何环境都走得通。
样张是单文件 HTML，内联 CSS/JS，除 Google Fonts 外无外部依赖，双击就能打开。它的寿命是二十分钟——别用框架，别上构建工具。
落地页是另一回事：site/ 是给 Cloudflare Pages 用的静态站（不是 Worker）。没有构建命令，产出目录就是 site。自定义域名 liebin.caojuege.com 在 Pages 项目里绑一次即可。
不负责提取设计系统。 提取器满大街都是（design-extractor、Claude Design 的 web capture、Chrome DevTools MCP），提得再准也解决不了开头那个问题。列宾里的提取只是给三个变体找个起点，粗糙没关系——它马上就要被你否决和修正。
不继续开发产品。 DESIGN.md 交出去，写代码是别人的事。第五步只回来看一眼像不像当初选的那一版，仍然不写代码。
DESIGN.md 规范来自 google-labs-code/design.md（Apache-2.0）。
site/ 发布目录新增 llms.txt、index.md、skills 发现索引与完整 ZIP。网页和下载包更新后，使用草诀歌官网仓库的 scripts/agent-resources.py 统一重新生成；入口与摘要随产物一起发布。维护说明：草诀歌官网 Agent 资源。本轮未增加在线 MCP 服务或 Markdown 请求协商。