English

实现教程来源（感谢大佬！）：小红书@乌托邦的香蕉🍌

一个 Codex Skill：对 Codex 说一句话，收获一张会随视角流光溢彩的 3D 全息闪卡。 能在浏览器里拖着转、翻到背面、拉滑块看它闪；还附赠一个可以随便改的 Blender 工程。

小时候在文具店门口舍不得买的那种闪卡，现在你想印谁就印谁。

你：「给我做一张赛博朋克风的机械猫闪卡，背景霓虹雨夜，编号 No.007」

Codex：
  🎨 画好四层图（主体 / 背景 / 线稿 / 文字）
  🧊 搭好 Blender 场景，视差、镭射、星光一次到位
  🌐 组装成 Three.js 网页，本地跑起来
  📦 递给你：网页链接 + card.blend + 渲染图

你只负责想，剩下的它来。

上传一张猫主子的照片，加一句"传说稀有度、金色边框、名字叫布丁"。 主体保留它本猫的神态和构图，背景和线稿全新绘制。拖一拖，猫在卡里往前凸，背景往后退，镭射彩虹随角度流动——朋友圈晒图请自便。

一个角色一句描述，批量出一整套：战士、法师、盗贼、Boss。 每张卡自带 card-config.json，稀有度、编号、属性文字都在里面，改完重新跑一遍流水线就更新。发售前发一波"抽卡预告"，玩家会疯。

把同事做成卡牌：头像当主体、部门色当背景、Slogan 当文字层。 每人一张，网页链接一发，大家在浏览器里翻自己的卡翻一下午。比 PPT 里的"团队介绍"页好玩一百倍。

"复古胶片风、粉金配色、背面写一句话"。 做好之后发一个链接过去，对方在手机上转着看，翻到背面看到那句话。仪式感这东西，闪光效果拉满就有了。

产品发布做一张产品卡，讲到最后一页丢一个链接："扫码看会闪的那种"。 响应式网页，手机横竖屏都能玩，观众当场就转起来了。

不只是网页，card.blend 是真正可编辑的 Blender 工程。 共享节点组里有中文命名的 缩放、深度、视差效果，镭射条纹、星光、线稿发光都是独立可调的材质节点。想研究全息卡是怎么"闪"起来的，打开它就是最好的教材。

四层图叠在同一块画布上，视差把它们在空间里"撑开"：

        👀 你的视线
         │
   ┌─────┴──────┐
   │  text.png  │  文字层     ─ 稳稳贴在表面
   ├────────────┤
   │ lineart.png│  线稿层     ─ 发光的轮廓
   ├────────────┤
   │ subject.png│  主体层     ─ 往前凸出来
   ├────────────┤
   │ background │  背景层     ─ 往后缩进去
   └────────────┘

再铺上镭射彩虹（相位跟着视角走，转到哪闪到哪）、Voronoi 星光、金色卡边。 浏览器端用 Three.js 按同一套 UV 公式重建这四层合成，呈现相同类型的视差和镭射效果；网页着色与 Blender 离线灯光不同，颜色、辉光和背面装饰会有差异。 镭射卡默认查看器采用纯白无边框画布、黑色无衬线排版和扁平控件，只保留卡片标题、直接操作与材质/景深滑杆，让卡片本身成为视觉中心。

把这个目录放进 Codex 的 skills 目录即可：

~/.codex/skills/holo-card-studio/

• Python 3 + Pillow
• Node.js + npm
• Blender 不用自己装 —— 流水线会自动把官方便携版放到 <project>/tools/，校验 SHA-256，项目自带、互不干扰

已有 Blender 时会优先复用，也可用 --blender 指定可执行文件。全息路线适配旧版合成节点和新版合成节点组，macOS 可使用 Metal；偏好设置保存在项目的 tools/blender-config/。

准备好素材与配置后，可以直接运行：

python scripts/run_pipeline.py --project <project-dir> --mode holographic

不写 --mode 时读取配置中的 mode，配置也没有时默认 holographic。--skip-render 跳过静态渲染，--skip-npm 跳过网页依赖安装。查看验收说明了解实际运行、渲染和浏览器检查的范围。

然后在 Codex 里直接说人话：

"用 holo-card-studio 给我做一张水墨风的锦鲤闪卡，文字用书法体，编号 No.001"

或者上传参考图：

"照这张图做一张闪卡，保留人物和构图，背景换成星空"

Codex 会先把卡片规格和它推断的细节说给你听，然后开工：画图 → 生成文字层 → 写配置 → 跑流水线 → 起本地服务 → 真正打开页面测拖拽、翻面、滑块和手机布局 → 交付。

需要持续生成和分发多张卡时，可以把每张流水线产物归档为独立目录，再由清单生成器汇总成瀑布流展厅。每张卡保留永久 URL，主页则按人物、风格、主题和稀有度自动生成筛选项。

• 在线示例：https://card.waterq.us/
• 配套项目：https://github.com/chenweilie/holo-card-gallery（私有仓库，需要所有者授权）
• 接入规范：多卡展厅与自动分类

流水线出厂就是一套顺手的参数，也都留了口子：

• 视差强度：主体默认 scale 1.25 / depth 0.4，背景 depth -0.25，想更"跳"就往上加
• 镭射条纹：条纹密度、扭曲度、角度，以及粉-黄-蓝-白的渐变
• 线稿发光：强度和遮罩密度，可以从"淡淡勾边"到"霓虹描边"
• 星光：Voronoi 尺度 + 动画噪声，从零星几颗到满天星
• Blender 界面语言：默认简体中文，存在项目本地配置里，一句话可换

holo-card-studio/
├── SKILL.md                    # Codex 读的"操作手册"
├── references/
│   ├── art-direction.md        # 分层画图的提示词写法、参考图处理
│   ├── config.example.json     # 卡片配置示例
│   └── verification.md         # 交付前的验收清单
├── scripts/
│   ├── ensure_blender.py       # 自动获取官方 Blender 便携版
│   ├── build_card.py           # 生成可编辑的 Blender 场景
│   ├── export_web.py           # 导出卡片几何
│   ├── generate_typography.py  # 精确的透明文字层
│   ├── validate_assets.py      # 四层图体检
│   ├── run_pipeline.py         # 一键流水线
│   └── package_skill.py        # 纯文本打包成可分享的 ZIP
└── assets/
    └── web-template/           # 响应式 Three.js 查看器

skill 本体只有代码和文字，轻得很。你生成的画作、.blend、模型都待在你自己的输出项目里。

想发给朋友或放进仓库？

python scripts/package_skill.py

它按白名单只打包文本文件，打出来的 ZIP 干干净净，拿走就能用。

现在除了原有的单图全息镭射卡，还可以制作光栅卡、翻转卡、双形态卡和一念神魔。

这条路线使用两张完整卡面：A 图与 B 图会随观看角度切换整张画面，不是把一张图切成左右两半。无参考图时默认采用全彩日式浮世绘构成与水墨动漫勾线；有参考图时先生成 A，再以 A 为身份锚点编辑出 B，锁定脸型、比例、服装锚点、镜头与主体尺度。

Blender 工程包含实体卡基、图像层、柱镜光栅、镭射膜、轮廓光、闪钻粒子等独立层。网页加载 Blender 导出的 GLB，用同一套视角公式驱动整卡切换，并支持鼠标与触控倾斜。

python scripts/run_pipeline.py --project <project-dir> --mode lenticular

光栅项目使用：

assets/image_a.png
assets/image_b.png
assets/text.png
card-config.json

流水线会交付 card.blend、正视/倾斜渲染、web/assets/card.glb、白底 Three.js 查看器和验证报告。原有全息路线继续使用 --mode holographic，也可以通过 card-config.json 的 mode 自动选择。

想好第一张卡画谁了吗？ ✨