你看到一个设计,感觉到某种东西——安静、高级、有生命——可一旦让 AI "做出那种感觉",话说出来是模糊的,结果回来是平庸的。
差的是那份感觉从没被拆成可迁移的手法。
Cabinet 就做这件事:把一张参考图拆成 facet(手法)——有名字、能复用的最小单元,交给你的 coding agent 当精确指令,迁移技法,而不是照搬画面。
收藏夹 / mood board 解决的是:"看到好东西,先存起来。"
Cabinet 解决的是:"这种感觉,怎么做进我自己的产品?"
先感受一下 → 在线体验版,「找灵感」中也放了高质量的设计参考网站,一站式找灵感,读灵感,用灵感。
借鉴从来不是把原作复刻一遍,而是向它学习。美术和中国书法的启蒙都是「临摹」——但临摹的目的从不是那张摹本,而是把一个东西「为什么成立」吃进去,直到能离帖,画出自己的画,写出自己的字。
到了 AI 时代,临摹不再只是手眼的训练。真正值得练的,是观察与表达——
我喜欢的到底是哪一部分? 是什么手法营造了这种感觉? 换作我自己的作品,会怎样把它表达出来?
Cabinet 不给你整图 prompt,而是在使用中去学习作者使用了什么手法、以及它为什么起作用,再尝试把技法迁移过来。在学中用,在用中学,而不是做一个别人成品的复制件。
Cabinet 是一个带可视前端的 Claude Code 项目——浏览器页面用来「看」,你的 coding agent 才是「干活」的地方。开始前确认两样东西:Claude Code + 一个 Chromium 内核浏览器(Chrome / Edge)。
复制这三行,装一次:
git clone https://github.com/pxx-design/cabinet
cd cabinet
./setup/install.shinstall.sh 装好 /translate + 转译 触发器,并第一次替你打开 app。macOS 还会装一个自动入库 watcher——点「入库」即自动拆(加 --no-watcher 跳过);Linux 上点「入库」暂存后,在 Claude Code 里敲 /ingest。
同样三行,但要在 Git Bash 里跑(装过 Git for Windows 就有;Claude Code 在 Windows 上本来就依赖它):
git clone https://github.com/pxx-design/cabinet
cd cabinet
./setup/install.sh三点不同:
- 粘图用
Ctrl+V。 - 没有自动入库 watcher——点「入库」暂存后,在 Claude Code 里敲
/ingest。 - 裸词
转译触发未在 Windows 上实测;/translate是一样的,用它。
Windows 路径未经完整实测。若哪一步跑不通,直接走方式三——页面本身、
/ingest、/translate都是跨平台机制,不依赖安装脚本。
不想碰命令行,就把这段话原样贴给 Claude Code,它替你装:
帮我装好 Cabinet:git clone https://github.com/pxx-design/cabinet && cd cabinet,
运行 ./setup/install.sh,并在浏览器打开 index.html。然后告诉我点左下「连接」选 cabinet
文件夹。我每次把参考粘进页面、点「入库」,你就运行 /ingest。
浏览器安全,谁都自动不了:第一次照页面左下的提示(那颗脉冲红点)——点「连接」→ 选这个 cabinet 文件夹 →「允许」。这一步让页面能写盘。只此一次。
以后再开,直接双击 index.html——现代 Chrome 下就是全功能。若浏览器在 file:// 下拦了文件夹授权,改用 ./start.sh(localhost)。
- 入库
/ingest—— 把参考粘进页面(⌘V/Ctrl+V,或直接丢进_inbox/),点「入库」。agent 读INGEST.md把每张图拆成手法:zh/en命名、图上锚点、感觉词、为什么起作用、怎么对 AI 说、借鉴边界。macOS 装了 watcher 就全自动;其他系统敲一句/ingest。 - 转译
/translate—— 在任何项目里,agent 读你选好的手法(_desk.json),结合你正在做的产品,先出转译稿、你确认后再动代码。
防照搬是结构性的:手法只带 say(说法),不带整图 prompt;tune 边界随手法走;配色不自动带过来。规范是 agent 中立的——Claude Code 用 /ingest,其他 agent 直接读 INGEST.md(见 AGENTS.md)。
- 参考(plate)——你收集的一张截图或图像。
- 手法(facet)——参考上的一个具体技法:柔彩渐变、邮政拟物道具、照片打底 UI。命名到 AI 认得,收口到能迁移进你的产品。
- 感觉——涌现出来的。一张参考之所以"有那种感觉",是它叠的那些手法共同达成的。感觉词长在手法上,不在图上。
浏览器(输入/可视) 磁盘(桥) 对话(模型能力)
丢一张参考 → _inbox/ → /ingest:拆成手法
在感觉地图上逛、
看锚点解析
跨参考混选手法 → _desk.json → /translate:你的 agent 读已选手法 +
它本就知道你在做什么 → 出转译稿,
你确认后直接做进产品
浏览器是操作界面,磁盘是桥,和 coding agent 的对话才是模型能力真正发生的地方。 Cabinet 不在页面里生成转译稿,你的 coding agent 更知道你的产品语境。
index.html 主程序(感觉地图 + 抽屉 + 召唤 + 入库托盘 + 磁盘桥)
data-v3.js 数据源 —— 6 张精选种子(字段说明见文件头)
assets/ thumbs/ 种子参考图(低清)+ 缩略图
folio/ shots/ 「找灵感」目录 —— 指向各设计站的缩略图
_inbox/ 待入库的参考丢这里
INGEST.md agent 中立的入库规范
start.sh localhost 兜底(浏览器在 file:// 下拦连接时用)
setup/ install.sh —— 安装 /translate、转译 hook、(macOS) 自动 watcher
这是 6 张种子,让首次打开不空。重点是用你自己的参考把它填满。打包图片的版权说明见 NOTICE.md。
- Claude Code(或任何能读
INGEST.md的 agent)—— 入库和转译的活儿靠它干,浏览之外的一切都需要它。 - Chromium 内核浏览器 跑前端。磁盘桥用 File System Access API——现代 Chrome 下双击
file://页面就能用;被拦的话用./start.sh走localhost。 - Python 3(
start.sh靠它)+ Pillow(入库时量图);命令名叫python3或python都认。Node 用来校验data-v3.js语法。 - 其他 agent(Codex 等):app、
INGEST.md、AGENTS.md都是 agent 中立的,入库/转译靠它们就能跑;/ingest、/translate、转译快捷触发和自动 watcher 暂时只支持 Claude Code。

