wechat-cover

概述

微信公众号封面生成器

从标题和主题描述出发，生成完整的微信公众号封面配图（AI 底图 + 文字合成）。

触发条件

• 用户提到"公众号封面"、"封面配图"、"头图"、"文章封面"、"公众号配图"
• 用户说"生成/做/制作一张封面"，且上下文是微信文章
• 用户提供标题并要求生成配图

工作流程

第一步：收集参数

从用户输入中提取以下参数：

支持的封面比例：

• 2.35:1 — 公众号头条封面（推荐，1880×800）
• 16:9 — 二条/次条封面（1280×720）
• 1:1 — 正方形封面（1024×1024）
• 自定义比例

若用户未指定比例，默认使用 2.35:1。

若用户只给了标题未给风格描述，根据标题内容自动推断合适的视觉主题和风格。

第二步：生成 AI 底图

调用 ImageGen 工具（通过 DeferExecuteTool）生成底图。

Prompt 构造规则：

1. 以"WeChat official account cover design"开头
2. 包含封面比例信息（如"cinematic 2.35:1 wide aspect ratio"）
3. 根据标题主题设计画面内容和视觉元素
4. 指定色调、光照和风格
5. 明确"文字区域留白"以便叠加标题
6. 使用英文 Prompt（ImageGen 对英文理解更好）

ImageGen 参数：

• prompt: 构造的英文描述
• size: 根据比例选择最接近的尺寸（见下表）
• quality: "high"
• revise: true（开启 Prompt 改写提升质量）
• output_dir: 当前工作目录

尺寸映射表：

注意：ImageGen/混元生图 API 对分辨率有限制（仅支持预定义列表），无法直接生成 2.35:1。

对于 2.35:1 需求，先生成 1280×720 底图，再在 HTML Canvas 中裁剪为 1880×800。

第三步：合成封面（HTML Canvas）

使用 assets/cover_generator.html 模板，将 AI 底图与标题文字合成为最终封面。

操作步骤：

1. 将 AI 生成的底图文件名记为 {base_image}
2. 读取 assets/cover_generator.html 模板
3. 替换模板中的占位符：
   • {{IMAGE_SRC}} → 底图文件名
   • {{CANVAS_W}} → 目标宽度
   • {{CANVAS_H}} → 目标高度
   • {{TITLE_LINE_1}} → 标题第一行
   • {{TITLE_LINE_2}} → 标题第二行（可选）
   • {{TITLE_COLOR}} → 标题颜色（默认白色）
   • {{SUBTITLE_COLOR}} → 副标题颜色（默认金色 #FFD700）
   • {{OUTPUT_NAME}} → 输出文件名
   • {{INFO_TEXT}} → 信息描述文本
4. 将渲染后的 HTML 写入工作目录
5. 通过 preview_url 打开预览

标题分行规则：

• 若标题含 | 分隔符，按分隔符分行（如"一年白扔近9万：|这笔账，90%的小老板从没算过"）
• 若标题超过 12 个字且无分隔符，根据语义断句自动分行
• 第一行为主标题（白色，大字号），第二行为副标题（彩色，略小字号）
• 若标题较短（≤12字），不分行，居中显示

字体选择： Microsoft YaHei > SimHei > PingFang SC > sans-serif

第四步：交付

1. 通过 preview_url 预览 HTML 封面
2. 通过 deliver_attachments 交付文件：
   • 合成后的 HTML 文件（用户可在浏览器中下载 PNG/JPG）
   • AI 原始底图
3. 告知用户操作方式：
   • 在预览窗口中点击"下载 PNG"或"下载 JPG"按钮
   • 下载的文件即最终封面，可直接上传到公众号

Prompt 模板库

根据文章主题选择合适的底图 Prompt 模板：

财务/商业类

A professional business cover with [具体元素]. Dramatic financial scene with [关键物体] as the focal point. 
Dark navy and charcoal background with subtle charts and data streams. Gold and crimson accents. 
Cinematic lighting, professional commercial illustration style, high detail, 8k quality

科技/数字化类

A futuristic tech cover featuring [具体元素]. Glowing neon circuits and holographic displays on dark background. 
Electric blue and cyan color palette. Clean modern tech illustration, depth of field, 8k quality

生活/情感类

A warm lifestyle cover with [具体元素]. Soft natural lighting, bokeh background with warm tones. 
Inviting and relatable atmosphere. Editorial photography style, shallow depth of field, high quality

知识/教育类

An educational cover featuring [具体元素]. Clean modern design with books, lightbulbs or graduation elements. 
Blue and white color scheme. Professional infographic style, clear visual hierarchy, high quality

通用模板

A visually striking [主题] cover design. [主要视觉元素] as the central focus. 
[色调描述] background with complementary accent colors. 
Professional editorial illustration, dramatic composition, cinematic lighting, high detail

调色板参考