# 黑板粉笔

> 16:9 横屏黑板课程模板。木框 + 墨绿板面 + 粉笔字，版式与知识看板完全同名，多了课程名页眉、章节号和标题两色分词，适合成系列的课程讲解。

Source: https://www.remixmate.ai/learn/templates/html-slide-blackboard · Updated: 2026-09-30

## 什么时候选它

要做**一门课**或一个系列讲解：每集都是同一个课程名、有章节号、画面风格统一。板书的视觉语言让「上课」的感觉更强。

它和 [知识看板（html-slide）](/learn/templates/html-slide) 是同一套骨架，只是换成了板书风格。已经会用知识看板，这里只需要看下面「特有的参数」。

## 规格

| 项 | 值 |
|----|----|
| 画幅 | 16:9（只有横屏，1920×1080） |
| 时长 | 15–600 秒 |
| 内容语言 | 中文 |
| 场景类型 | opening / point / cta / ending |
| 旁白 | 需要（音频） |
| 字幕 | 描边字幕 |
| 数字人 | 可选 |

主题变体 3 套：green-board 墨绿黑板（默认）、black-board 深灰黑板、light-board 牛皮纸浅板。字体默认霞鹜文楷。

## 版面

- **木框 + 板面**：默认背景就是木框黑板，不用写。
- **页眉**：左上课程名、右上章节号（暖黄粗体），全片常驻。
- **板书主体**：26 种版式，`slideId` 与知识看板完全同名（hero-title、feature-grid、timeline-axis、compare-table、formula-steps、quiz-reveal 等），每屏在 `customPayload.slideId` 里选一个。各版式的字段、数组上限见 [知识看板](/learn/templates/html-slide)，两个模板的 DSL 可以互换。
- **标题两色**：命中的关键词用暖黄，其余用淡蓝。

## 关键参数

以下是本模板特有或与知识看板取值不同的参数。版式本身的 `templateData` 字段与知识看板一致。

| 参数 | 位置 | 类型 / 取值 | 默认 | 说明 |
|------|------|-------------|------|------|
| `slideId` | `customPayload.slideId` | 26 种版式 id，与 html-slide 同名 | — | 每屏必须显式写。不写或写错会静默回落到只有一行标题的默认版式 |
| `watermarkText` | `customPayload.watermarkText`（场景顶层） | 字符串 | 不显示 | 页眉左上的课程名，整门课写同一个 |
| `pageNo` | `customPayload.templateData.pageNo` | 字符串，如 `"1.1"` | 不显示 | 页眉右上的章节号 |
| `highlight` | `customPayload.templateData.highlight` | 字符串，须是 `title` 的子串 | 不给则整句米白 | 标题两色分词：命中部分暖黄，其余淡蓝 |
| `background.preset` | `customPayload.background` | `board` / `solid` / `gradient` / `image` / `video` / `noise` / `none` | `board` | 木框黑板是默认值，通常不用写。从知识看板迁 DSL 时把 `grid` 改成 `board` |
| `background.woodFrame` | `customPayload.background` | 布尔 | true | 最外圈木框。只有整屏图片 / 视频出镜时才值得关 |
| `background.boardOverlay` | `customPayload.background` | 布尔 | false | 在图片 / 视频上叠一层板面质感，让照片像「贴在黑板上」 |
| `background.motion` | `customPayload.background` | `static` / `kenburns-in` / `kenburns-out` / `pan-left` / `pan-right` | `kenburns-in` | 图片背景运镜 |
| `background.overlayOpacity` | `customPayload.background` | 0–1 | 0.55 | 图片 / 视频上的蒙版，设 0 关闭 |
| `background.overlayColor` | `customPayload.background` | 颜色 | `rgba(24,32,26,1)` | 蒙版颜色，默认取板面深绿调 |
| `background.blurPx` | `customPayload.background` | 0–40 | 0 | 图片 / 视频模糊，让粉笔字更清楚 |
| `highlightMap` | `customPayload.templateData.highlightMap` | 对象：字幕行下标 → 卡片下标 | 自动推导 | 旁白带 outro 行时手写，把 outro 也映射到最后一张卡 |
| `digitalHuman.position` | `customPayload.digitalHuman` | 九宫格 `top-left` … `bottom-right` / `custom` | 右下角 | 老师出镜位置。避开 `top-left` / `top-right`，那里是页眉 |
| `digitalHuman.size` | `customPayload.digitalHuman` | `small` / `medium` / `large` / `full`，或 0.1–1 | `medium` | 小窗高度，档位分别占画面短边 0.28 / 0.42 / 0.62 / 0.92 |
| `digitalHuman.shape` | `customPayload.digitalHuman` | `rect` / `rounded` / `circle` | 圆角 | 不支持抠像 |
| `digitalHuman.layout` | `customPayload.digitalHuman` | `overlay` / `reserve` | `overlay` | `reserve` 会把板书等比缩小让出一侧 |

数字人只在场景写了 `visuals.avatar.assetRef` 时出现；相邻几屏引用同一个 assetRef 就是一段连续视频。

## 什么时候别选它

- **不需要课堂感、想要更通用的科普看板** → [知识看板](/learn/templates/html-slide)。
- **一道数学题从头讲到尾** → [数学解题讲解](/learn/templates/math-principles-expl)，它有题面、图形和红框圈选。
- **要竖屏** → 只有 16:9。

## 常见坑 {#pitfalls}

- **没写 `slideId`**。渲染成功、零报错，画面只剩一行居中标题，看起来像「模板本来就长这样」。整片也不要只用一种版式。
- **`highlight` 不是标题的子串**。不会报错，只会静默退回整句米白。
- **课程名写进了 `templateData`**。课程名走场景顶层的 `watermarkText`，章节号才走 `templateData.pageNo`。
- **字段名凭直觉写**。例如 feature-grid 的卡片标题叫 `name` 不叫 `title`。写错不报错，那一块静默空掉，照着版式的字段写。
- **卡片数 ≠ 旁白条数**。逐项高亮的版式要求 `narration.items` 与卡片数组等长。
- **数组超上限**。超出部分会被静默裁掉，内容多就拆成多个场景。
- **图片只写了 URL**。slide 内的图要先在 DSL 的 `assets[]` 声明，再用 `assetRef` 引用，否则静默不显示。