口播稿封面的创作指南

本文件是「程序员晚枫」视频封面专属设计规范。
每次设计新封面之前，必须对照本文档检查是否符合品牌视觉体系。
每次发布后根据完播率和点击率数据，更新优化本文件。

零、封面核心原则

封面不是「配图」，是「钩子」—— 用户在信息流中停留不到 0.3 秒，必须用视觉瞬间传递两件事：

这期讲什么（大字号金字标题，一眼可读）
这人值得听（真人出镜，表情即态度）

绝对禁止：

❌ 纯文字封面（无人物，冷冰冰）
❌ 标题被人物/装饰遮挡导致读不清
❌ 颜色过多（超过 3 种主色）
❌ 把标题放在人物背后露出不全
❌ 人物表情平淡和标题情绪不一致

一、品牌色彩体系

「暗底 + 金字」是账号的视觉烙印，所有封面严格统一。

1.1 色彩定义

层级	颜色	色值	用途
底色	深蓝黑	`#070B14` ~ `#0D1426`	全幅背景
主文字	金黄色	`#F5C518`	主标题（不可替代）
辅文字	纯白	`#FAFAFA`	副标题、期号、标签
装饰	暗青蓝	`rgba(10, 132, 255, 0.15)` ~ `rgba(10, 132, 255, 0.3)`	科技发光图形、节点网络
描边	纯黑	`#000000` (`text-shadow` 或 `-webkit-text-stroke`)	白色文字的对比保底

1.2 配色禁忌

标题金色不可替换为其他黄色（那是另一种「廉价感」）
不要使用大面积纯黑（#000）做背景——会丢失科技感的层次
人物照片本身色调若偏暖，需做冷色调处理使之融入底色
装饰色只能用暗青蓝，不可引入绿/红/紫（破坏品牌统一性）

二、格式与尺寸

根据不同平台，封面有两种比例，但色彩和风格完全一致。

2.1 横版（16:9）

属性	值
尺寸	1920 × 1080
适用平台	B站、YouTube、公众号头图
推荐字号	主标题 120-160px / 副标题 48-56px

构图特点：文字主导型，人物以小头像（约 280×280）置于右下角。整体是「排版感很强」的极简科技风。

2.2 竖版（3:4 · 推荐）

属性	值
尺寸	1080 × 1440
适用平台	小红书、抖音、视频号、B站竖屏
推荐字号	主标题 160-200px / 副标题 48-56px

构图特点：人物主导型，半身肖像占画面 40%-55%，文字围绕人物错位排布。整体是「人物表情驱动」的情绪冲击风。

当前推荐：优先制作 3:4 竖版，横版可作为衍生版本。竖版在移动端信息流中视觉占有率更高。

三、字体体系

3.1 指定字体

用途	字体	字重	说明
主标题	Montserrat Black 900	900	中英文混排均可，极粗极有力
副标题	Inter Medium 500 / Bold 700	500-700	清晰但不抢戏
期号	Montserrat Bold 700	700	左上角，56-64px
标签	Inter Medium 500	500	底部标签行，28-32px

3.2 回退字体

当设计工具不支持 Montserrat/Inter 时：

主标题 → PingFang SC Heavy / 思源黑体 Heavy（字重 900）
副标题 → PingFang SC Medium（字重 500）

四、主标题设计规则

4.1 拆分结构（核心技法）

主标题不写成一整句，而是故意拆成 2-3 个词组，错位排布。这是本账号封面的核心视觉特征。

规则：

找到标题中最有冲击力的关键词（通常是数字、对比词、否定词）
把这个关键词单独成一行，用最大字号强调
其余文字与之形成左右/上下错位

示例：

原句	拆分方式	视觉节奏
AI大模型，我只用国产	「AI大模型」/「我只用国产」	上下两行，下方缩进
OpenAI亏100亿，免费要没了	「OpenAI亏100亿」/「免费要没了」	上下两行，下方右缩进
600亿买工具	「600亿」/「买工具」	上下两行，右行下沉
姐妹听我一句，珍惜会用AI的男人	「姐妹听我一句」/「珍惜会用AI的男人」	上下两行错位

字号梯度：

数字/否定词行：160-200px
叙述行：120-160px
两行之间的字号差至少 30-40px

4.2 发光阴影

金色标题必须带有 text-shadow 发光，不然在暗底上不够「跳」：

text-shadow:
  0 0 30px rgba(245, 197, 24, 0.4),
  0 0 60px rgba(245, 197, 24, 0.15),
  0 4px 8px rgba(0, 0, 0, 0.6);

规则：

发光色必须是 rgba(245, 197, 24, x) —— 跟随金色主色
至少两层发光：近层 0.4 透明度 + 远层 0.15 透明度
底层黑色投影保证在任何背景下都清晰

五、人物肖像规则

5.1 位置与大小

版式	位置	大小	处理方式
横版 16:9	右下角	约 280×280	圆角框（12px）独立放置
竖版 3:4	右侧偏中	约画面宽度的 42%-48%	直接抠图融入背景，左侧渐变过渡

5.2 竖版人物的融入技巧

竖版封面人物不能用框，必须与背景无缝融合：

人物层放在最上层
人物左侧做 linear-gradient 遮罩：从左到右 rgba(7,11,20,1) → transparent
梯度宽度约 120-180px
人物下方与背景之间加发光层（blur 大圆）过渡

5.3 表情与标题的匹配

这是封面的灵魂。标题说什么，人物的脸就要「演」出那个情绪。

标题情绪	人物表情	示例
真相揭露 / 惊讶	瞪眼、半张嘴、微微后仰	「我查到了真相」类标题
得意 / 自信	歪嘴笑、抬下巴、直视镜头	「我只用国产」类标题
质疑 / 冷笑	侧脸、嘴角微扬、眼神偏向一侧	「不是因为它好用」类标题
严肃 / 警示	眉头微皱、正面、眼神坚定	「免费要没了」类标题
共鸣 / 亲近	微笑、侧头、轻松自然	「姐妹听我一句」类标题

规则：

表情要夸张 20%—— 手机的缩略图很小，微妙表情看不出来
人物视线一般看向镜头或略微偏向标题文字方向
黑框眼镜是本人标志，不可 P 掉

5.4 人物生成要点（AI 肖像）

当使用 AI 生成肖像时：

构图：正方形半身照，头顶留白 8%-10%
背景：深色/纯黑，便于抠图融入
光线：金色/青蓝色轮廓光（rim light），与封面色调统一
着装：深色系（黑/深灰），不抢戏
脸部：方脸、短发、黑框眼镜——保持本人特征
必须有「图片由AI生成」水印或标注

六、副标题与元信息

6.1 副标题

字号：48-56px
颜色：纯白 #FAFAFA
位置：主标题下方或右侧，形成视觉节奏差
必须加黑色 text-shadow 确保可读性
一行，不超过 10 个字

6.2 期号

格式：#029 或 NO.029
位置：左上角
字号：56-64px
颜色：金色 #F5C518（与主色调呼应）
字重：Bold 700

6.3 标签

位置：底部
字号：28-32px
颜色：白色 #FAFAFA，透明度 0.7-0.85
格式：SpaceX · Cursor · 600亿收购 · AI编程
用 · 分隔，不用 / 或 |
3-5 个标签，每个 2-4 个字

七、背景装饰

7.1 节点网络（Node Network）

科技感的灵魂装饰：

/* SVG 或 Canvas 绘制，配置：*/
- 圆点半径: 2-3px
- 连线宽度: 0.5-1px
- 颜色: rgba(10, 132, 255, 0.15)
- 点密度: 每 100px 间距一个节点
- 整体透明度: 0.3-0.5

节点网络覆盖面积约 40%-60%（主要集中在画面左上、右下区域，避开人物主体）。

7.2 发光圆

直径：300-500px
颜色：rgba(245, 197, 24, 0.04) 金色 / rgba(10, 132, 255, 0.06) 蓝色
模糊：blur(80px) - blur(120px)
位置：背景角落，营造层次感
可叠加 2-3 个不同颜色、不同大小的圆

7.3 斜切装饰线

长度：150-250px
宽度：2-3px
颜色：金色 #F5C518，透明度 0.3-0.5
位置：标题旁或角落
角度：30°-45°

7.4 装饰密度控制

竖版封面：节点网络 + 1 个发光圆 + 1 条装饰线 → 刚好
横版封面：节点网络 + 2 个发光圆 + 2-3 条装饰线 + 网格底纹 → 科技排版感
装饰不能盖过人物和文字，默认透明度都压到 0.3 以下

八、竖版封面制作流程（SOP）

Step 1：提取封面信息

从口播稿 .md 文件的 封面标题 字段中提取：

主标题（拆分前）：600亿买工具
副标题：不是因为它好用
情绪基调：质疑/冷笑（结合文章整体态度）
标签：SpaceX、Cursor、600亿收购、AI编程

Step 2：标题拆分

按「四、主标题设计规则」拆分标题，确定每行字数、字号、位置。

Step 3：画布创建

尺寸：1080 × 1440（3:4）
底色：#070B14
所有元素在一个画布内

Step 4：背景层

底色填充
叠加发光圆（2 个，不同位置/颜色）
叠加节点网络（右侧密度高，左侧留白给文字）

Step 5：人物层

将半身肖像抠图后置于右侧
左侧加渐变遮罩融入背景
下方加发光过渡层
人物占画面宽度 42%-48%

Step 6：文字层

左上角：期号（金色，Bold）
主标题：第一行（上）→ 第二行（下），错位排布
副标题：主标题下方或右侧
底部：标签行

Step 7：装饰收尾

斜切线 1-2 条
网格底纹（可选，竖版通常不需要）
标题发光阴影

Step 8：验证检查

标题在小缩略图（120px 宽）中是否清晰可读？
人物表情和标题情绪是否一致？
颜色是否严格限定在深蓝黑 + 金色 + 白色？
字号梯度是否有 30px 以上的差异？
是否标注了期号 #029？
是否有 AI 生成内容的水印标识？

九、横版封面制作流程（SOP）

横版作为竖版的衍生版本，核心元素相同，但构图逻辑不同：

差异点	竖版 3:4	横版 16:9
人物	大（半身主体）	小（280×280 头像框）
标题位置	围绕人物错位	居中偏左，独立排版
装饰密度	低	高（网格、多条斜切线）
人物处理	抠图融入	带圆角框独立放置

横版的具体布局：

标题居中偏左（占画面宽度 55%-65%）
人物放在右侧（x: ~1500, y: ~600），280×280，12px 圆角
装饰密集：节点网络 + 多条斜切线 + 网格底纹
标签在底部居中

十、从口播稿到封面的自动化映射

口播稿 Markdown 文件中如果有以下字段，直接映射：

口播稿字段	封面元素	处理规则
`封面标题`（如「600亿买工具」）	主标题	拆分后错位排布
`封面副标题`（如「不是因为它好用」）	副标题	白字，52-56px
`文章标题` 或文件名中的期号	期号	`#029` 格式，左上角
文章 `categories` / 关键词	底部标签	`·` 分隔，白色半透明
文章整体情绪基调	人物表情方向	参考「5.3 表情与标题的匹配」

十一、踩坑经验

以下是在实际制作封面过程中积累的经验，每次踩坑后追加：

16:9 横版人物太小：第一次做 029 封面时，人物只有 280×280，视觉冲击力不足。竖版大幅放大人物后效果显著提升。默认优先做竖版。
标题不拆分就没灵魂：整句标题居中排布会显得像 PPT，没有「视频封面」的冲击力。必须拆分并错位。
金色发光必须做：不加 text-shadow 发光的金色标题在暗底上不够突出，感觉「陷进去」了。
人物表情不能太含蓄：第一版 AI 肖像表情偏自然，放到页面上发现情绪不够强。后续生成时要求「夸张 20%」。
节点网络密度要控制：第一版竖版封面的节点网络铺得太满，干扰了文字可读性。后来限制在画面 40%-60% 区域，并压低了透明度。

更新日志
2026-06-07：初稿，基于 029 期横版/竖版封面两次制作 + 3 张参考封面的分析总结。