jane-xiaoer 好奇果冻 3D · 公众号排版 Skill
将文章排成明亮、年轻、有 3D 卡通记忆点的微信公众号正文。保留好奇果冻 3D 的视觉语言，但将 WebGL 场景转换为微信可渲染的静态 PNG 与 inline HTML。Three.js 只用于生成、截图或挑选素材，不进入公众号正文。
适用边界
触发于 3D 卡通公众号、黏土风公众号、果冻 3D 文章、年轻化视觉排版等请求。用户只要网页 PPT 时，走仓库根目录的多风格 PPT 工作流；用户要剪纸/卡纸公众号时，走现有公众号剪纸工作流。用户明确要求混搭时，先说明两套视觉语言的差异，再只在章节边界混搭，不把两套组件随机交叉。
工作流
1. 对齐文章与输出
完整文章已提供时直接分析；只有主题时，最多询问受众、文章目的和期望长度，其余采用合理假设并明确记录。确定：标题、摘要、封面图、正文 2–5 张图、章节数量、CTA 与是否只生成预览还是创建微信草稿。
将文章拆成：钩子 → 解释 → 方法/案例 → 复盘 → CTA。每个段落只承担一个信息任务。优先短句、具体动作和读者收益，避免连续的风格自嗨描述。
2. 建立 3D 视觉预算
先为每章选择语义素材，再决定版式：
hero：一件承担记忆点的主物件或人物，通常占图片主体 30–60%。support：最多两件帮助解释论点的物件。accent：最多一件小型符号、贴纸或颜色节点。
使用 references/haoqi-3d-wechat-images.md 选择 balloon、camera、phone、gamepad、plant、skate 等素材。不要用随机黏土物件填空；物件必须对应记录、互动、成长、迭代等语义。
采用暖象牙、果冻蓝、珊瑚橙、柠檬黄、薄荷绿和深墨色的角色分工。避免整篇只用蓝色，也不要把 PPT 的蓝色渐变直接当成公众号底色。
3. 制作静态图片
使用已有 Deck 页面作为构图参考：
styles/haoqi-3d/demo.html?p=0&still=1&s=plus
使用 still=1 关闭动画，截取干净静态图；或从 styles/haoqi-3d/assets/clay/ 取透明 PNG，重新组合信息图。图片中不放中文、标题、数字、Logo 或关键说明，全部文字由正文 HTML 承载。按照 references/haoqi-3d-wechat-images.md 输出：头图 900×383，正文主图 900×506 或 900×675，单张不超过 1MB。
正文图片使用图片相框或 3D 卡片组件承托，不将图片直接散落在段落之间。上传前运行：
python3 scripts/upload-body-images.py article.md --dry-run
需要发布时再去掉 --dry-run，将本地图替换为微信 CDN URL。不要把 AppSecret 写进文章、skill 或示例文件。
4. 生成微信安全 HTML
读取 references/haoqi-3d-wechat-components.md。使用主题：
assets/wechat-themes/haoqi-3d.json
组件只能使用适合微信的简单标签和 inline style。带 background-image 的面板外层必须是 styled <section>；微信可能清掉 styled <div> 的背景图。禁止 flex、grid、绝对定位、脚本、外链 CSS、WebGL、canvas、SVG、滤镜和混合模式。
保持以下组件节制：
- 开场卡：每篇 1 个。
- 黏土知识卡：每个大章节最多 2 个。
- 数据/对比卡：最多 2 个。
- CTA：结尾 1 个。
- 正文配图：每个大章节最多 1 张。
让主题默认的 h1/h2/h3/p 负责大部分排版，不让卡片变成每段文字的背景。每个正文 <p> 明确设置颜色。列表项之间压紧标签，避免公众号把换行识别为空 bullet。
5. 预览、验证和草稿
先生成 dry-run HTML，再用移动宽度预览；不要把 Chrome 预览当成微信最终结果。运行：
python3 scripts/validate-haoqi-wechat.py article.md
逐项检查 references/haoqi-3d-wechat-checklist.md。确认图片引用存在、禁止 CSS/HTML 特性未出现、图片大小合规。必要时使用 wechat-publisher 的 publish.py 走官方 API 创建草稿；先预检 token，只有 API 返回成功才报告草稿已创建。不要改走第三方 SaaS 或浏览器搬运发布。
6. 交付说明
交付时列出：文章 Markdown、dry-run HTML、封面图、正文图、主题 JSON、验证结果和微信草稿状态。明确说明：动态 3D 已转换为静态图片；修改文字在 Markdown/HTML 中完成，修改 3D 构图需要重新截图或重新组图。
Additional Resources
references/haoqi-3d-wechat-components.md— 微信安全的 3D 卡片、开场、步骤、数据和 CTA 组件。references/haoqi-3d-wechat-images.md— 静态 3D 图片、尺寸、裁切、语义素材和提示词规则。references/haoqi-3d-wechat-checklist.md— 公众号交付前的内容、视觉、HTML 和发布检查清单。assets/wechat-themes/haoqi-3d.json— 可供 wechat-publisher 注入的主题 JSON。examples/wechat-3d/article.md— 一篇可复制的示例文章结构。scripts/validate-haoqi-wechat.py— 检查微信禁用标签、CSS 能力、图片大小和本地引用。