小红书图文生成器 · HTML 程序型技能 (xhs-html-studio)
概述
本技能面向"北京小学资料引流"赛道，交付一个可复用的 HTML 程序（assets/app/index.html）：用户打开即可输入方向/关键词，自动套用爆款封面公式与两段式正文，选风格，生成小红书轮播图文（封面大图 + 多页内容卡 + 引流页），并可逐页导出 PNG 直接发笔记。同时，本技能也可由 Agent 基于 references/ 的框架直接生成一份定制 HTML 交给用户。
核心理念：文案与版式规律沉淀在参考文档，出图程序沉淀为可离线复用的 HTML，而不是每次都重画图片。
两种用法
- 交给用户自用的生成器：直接把
assets/app/index.html作为成品交付/打开，用户日后自行填词出图。 - Agent 一键出稿：用户提供指令+关键词，Agent 读取参考文档生成文案，并产出一个已填好内容的独立 HTML（复制
assets/app/index.html模板、把文案写入对应字段/段落即可）。
工作流（Workflow）
输入（方向 / 关键词） → ① 判定方向 → ② 生成文案（参考 copywriting.md）→ ③ 套用爆款排版（参考 style-guide.md）→ ④ 产出 HTML（打开生成器 or 定制 HTML）→ ⑤ 交付。
步骤 1：判定方向
- 三方向：资料蓄养（资料引流）、小升初政策（北京升学）、剑桥备考（KET/PET）。
- 命中则采用；未命中默认"资料蓄养"或向用户确认。
步骤 2：生成文案
- 读
references/copywriting.md，按方向产出：封面标题（年级+学科+资料名+效果词）、正文（两段式：痛点/价值 → 钩子引流）、话题标签。 - 正文每段空一行对应一页内容图；首行作封面标题；末段引流不计入内容页（由生成器"引流页"承载）。
步骤 3：套用爆款排版
- 读
references/style-guide.md：封面大标题+价值标签+痛点钩子；正文两段式；评论区引导与私信承接话术；标签策略。 - 风格六选一（白底干货/清新手账/国潮/极简杂志/卡通/奶绿），按方向推荐。
步骤 4：产出 HTML
- 方式 A（推荐给用户复用）：打开/交付
assets/app/index.html。该页含：方向切换、账号名、正文输入、标签、引流页开关、6 风格、实时手机预览、逐页下载 PNG。 - 方式 B（Agent 定制）：以
assets/app/index.html为模板，将用户文案填入COPY对应方向或<textarea>默认值，调整STYLES与默认style，输出一份独立 HTML 文件。
步骤 4.5：违禁词审核（生成前必过）
生成器内置「③ 违禁词审核 · 信息源导入」面板，确保发布不踩小红书红线：
- 内置词库：约 90 条常见违禁词，分两级——🔴 高危（导流/外部联系方式/违规营销/医疗功效，导出必拦截）、🟡 风险（绝对化词/极限词/导流诱导，导出前确认）。
- 信息源导入（可复用、可换源）：文本框粘贴（格式 词|建议替换|high/warn）、或上传 .txt/.csv 文件；支持"合并导入 / 覆盖导入 / 恢复内置 / 导出词库备份"。机构可把自家最新红线词库导入覆盖。
- 实时审核：输入文案/账号/标签即扫描，列出命中词、等级、出现次数、上下文与替换建议。
- 生成前自查：① 每次生成预览自动跑一次；② "🔍 生成前自查"按钮出报告；③ 点"下载全部 PNG"时若命中🔴高危词直接拦截并提示修改，命中🟡风险词弹确认。可在面板关闭审核（关闭后导出不再拦截）。
步骤 5：交付
- 用
present_files展示生成的 HTML（可本地打开预览）与导出说明。 - 提示：换风格/改文案/调页数/导词库，直接在生成器里改；或说一声由 Agent 重出。
资源
assets/app/index.html— 自包含的小红书图文生成器（canvas 渲染，离线可用，逐页导出 PNG，含违禁词审核+信息源导入+生成前自查）。本技能的可复用程序本体。references/copywriting.md— 三方向文案框架、封面公式、引流钩子、标签库。references/style-guide.md— 爆款风格与排版规律（封面/正文/配图/引流合规/风格映射/账号人设）。
备注
- 成品图统一 1080×1440（3:4）。标题文字由 canvas 渲染，大且清晰，不依赖 AI 生图（避免中文糊字）。
- 合规：敏感词用谐音/表情替代；主页不留联系方式，引流走评论区与私信；生成前以违禁词库自查拦截高危词。
- 与
xhs-content-generator（PNG 出图技能）可互补：本技能出 HTML/可复用程序，后者出带 AI 背景图的真实 PNG。
