动态排版 (Kinetic Type)
当文字出现在视频屏幕上时，脑海中首先浮现的动效通常是淡入、滑动和弹出。它们效果不错，但只是默认选择，而非深思熟虑后的决策。本技能为您呈现完整的动效范围，约80种技术，涵盖18个家族，让您能够做出真正的选择。
它会提醒，但不会指挥。它不会为您的工作增加任何额外步骤、页面或审批流程。
创意优先
这里的一切都是默认选项或建议，绝非规则。当某个瞬间需要不同效果时，打破默认规则，并在您的计划、代码注释或回复中用一句话说明原因。菜单之外的技术也完全可以使用。菜单的存在是为了拓宽您的选择，而非限制您。
按时刻和含义选择
在决定文字如何运动之前，先阅读它们。思考这一行文字在做什么，然后选择与之含义匹配的技术：
| 文字... | 推荐使用 |
|---|---|
| 分裂、打破或分割某物 | slice、shatter |
| 计算出答案或揭开秘密 | scramble |
| 用力落地，或倒计时 | stomp |
| 首次定义或写出一个术语 | stroke-write-on、marker-highlight |
| 显示数字变化 | odometer |
| 描述某物消失 | disintegrate、smoke-dissolve |
| 跟随图表或方程 | text-on-a-path、sine-wave-type |
菜单中的“适用场景”一列正是为此问题而设。
多样性程度
- 教学模式（教程和讲解视频的默认模式，且当请求未明确说明时）：为每行普通文字选择一种统一风格，从标有平静标签的技术中选取，并为重要时刻保留少数强调效果：关键术语、答案、警告。标有教学标签的技术适合作为强调效果。更少的强调比更多的强调更有冲击力。
- 自由模式（当用户要求时：“要有创意”、“尽情发挥”、“给我惊喜”）：菜单中的任何技术都可以使用，但仍需按含义选择。自由并不意味着使用很多。一个大胆、精心挑选的技术胜过十个平庸的效果。
- 如果视频显然不是教程（如音乐视频、预告片），且未指定模式，请选择合适的技术并说明您的选择。
最终润色与检查
- 快速移动时添加运动模糊。 计算机动画的边缘非常锐利，因此快速移动的文字可能显得跳跃。在运动方向上添加一点模糊可以使其看起来像实拍。Remotion有运动模糊工具（
@remotion/motion-blur）；请使用与项目Remotion版本完全相同的版本来安装，方法与“在Remotion中构建”部分中的包相同（npm i -E @remotion/motion-blur@<version>）。将其作为快速移动的最终润色；对于缓慢漂移，它只会看起来失焦。 - 连写脚本会破坏字母级效果。 在阿拉伯语、波斯语和其他字母形状随相邻字母变化的脚本中，将单词拆分为字母（级联、打乱、重组、随机顺序弹出、3D翻转）会破坏字母形状。请改为对整个单词或整行文字进行动画处理。
- 检查字体是否包含所需的重音符号。 对于南非荷兰语和其他带重音的拉丁文字，请确保在动画化之前字体包含所需的字母（ê, ë, ô, ï...）。
使用菜单
在选择之前，打开references/menu.md（位于此技能文件夹内）。它列出了每种技术，按家族分组，并包含：
- 其名称和id（
KT_COMPONENTS中的键） - 一行外观描述和一个适用场景提示
- 标签：平静（好的统一风格）、教学（好的教学强调效果）、退出（以文字消失结束，适合行或场景的结尾）、✚ 新
- 构建方式：
component（现成组件），或example（一个带注释的场景以供改编，路径已给出）
浏览家族标题，然后阅读适合当前瞬间的家族中的行。
references/catalogue.md是背景资料：菜单背后的研究，包含来源、历史以及每种技术的构建难度。只有在需要深入了解时才打开它。
在Remotion中构建
- 将此技能文件夹中的
remotion/文件夹复制到项目中，命名为src/kinetic-type/。 - 确保项目拥有
remotion、@remotion/google-fonts和@remotion/layout-utils，且版本与项目的Remotion版本完全一致（Remotion要求其所有包版本一致）。例如，在4.0.536版本中：npm i -E @remotion/[email protected]（-E保存精确版本，而非^4.0.536）。 - 通过菜单ID查找组件，并在
<Sequence>中渲染它：
import { Sequence } from "remotion";
import { KT_COMPONENTS } from "./kinetic-type";
const House = KT_COMPONENTS["tracking-in"];
const Accent = KT_COMPONENTS["slice"];
export const Intro: React.FC = () => (
<>
<Sequence durationInFrames={75}>
<House text="Every whole can be shared" />
</Sequence>
<Sequence from={75} durationInFrames={60}>
<Accent text="Split it in half" keyWord="half" />
</Sequence>
</>
);
- 属性 (
KTProps)：text（必需）、keyWord（获得强调效果）、fontFamily（默认Poppins）、color、accent、fontSize（默认适应帧宽度）。 - 每个组件从其所处
<Sequence>的第0帧开始运动，并在大约一秒内稳定下来，因此Sequence的长度决定了文字停留的时间。有两种类型行为不同：退出技术在其Sequence最后一帧结束前文字消失，而声音节拍型技术（家族15）将文字分散到整个Sequence中，因此Sequence的长度决定了其节奏。 - 对于
example技术，打开菜单中指定的文件并改编场景。 - 其他视频工具：菜单和选择方法仍然适用；现成组件仅限Remotion。
观看效果，或指导完整视频
- 画廊： 每种技术都有实时预览，访问 https://dricosnyman.github.io/kinetic-type-skills/
- 完整视频，或逐行指导： 当任务是根据脚本制作完整的动态排版视频，或者用户希望在构建之前规划、审查和批准每一行的排版时，请使用
kinetic-type-director技能。它运行完整流程并基于本技能构建：它会起草一份排版脚本，在一个可编辑的页面上展示给用户，然后使用本组件构建批准的版本。