如何制作 Logo 揭示动画

读完这篇，你会得到一段两到四秒的 Logo 揭示动画，导出为 MP4 或 WebM。需要准备一个 KinoViz 账号和 .svg 格式的 Logo。整套流程在免费版上就能跑通，付费套餐只影响导出分辨率、帧率和水印。

你需要准备

• SVG 格式的 Logo。PNG 也能用，但无法拆分为路径，会失去描边画出和逐形状揭示这些做法。
• 一个大致的节奏设想：图形标先、文字标后，是最稳妥的默认方案。
• 十到二十分钟。

分步操作

1. 定好画布与总时长

新建项目并按播放位置选画布：横版（1920 × 1080）用于视频片头或网站首屏，方形用于社交贴文，竖版用于 Reels 和 Stories。然后用时间轴工具栏上的时长按钮设置总时长——它显示当前长度（例如 10s），点开是一组预设长度加一个自定义输入框。揭示动画很少需要超过四秒。

2. 导入 Logo 并拆成几部分

把 SVG 拖到画布上，右键选拆分为路径让每个形状独立，或者选转换为可编辑保留可编辑文字。

在图层面板里用 Ctrl/Cmd+G 把该在一起的部分成组，常见的分法是两组：图形标和文字标。

3. 先把最后一帧摆好

在设计模式里，把 Logo 摆成揭示结束时应有的样子。后面每个关键帧都是回到更早的时间、把某样东西「拿走」——不透明度、缩放、描边长度。从落位帧倒推，能保证 Logo 最终停在你想要的位置。

4. 让描边自己画出来

选中一条带描边的路径，属性面板里有起点和终点两个滑块，控制描边被画出多少。

1. 播放头放在开头，把终点设为 0，描边消失。
2. 播放头往后移，把终点设为 100，描边完整。

两个关键帧之间，线条就会自己画出来。起点做的是同样的事，只是从另一端开始，适合做线条收回。

5. 让图形标淡入并落位

用设计 / 动画开关切到动画模式。在时间轴靠前的位置把图形标不透明度设为 0、缩放调到略小于最终尺寸；稍后把不透明度恢复到 100、缩放恢复到落位值。每个属性两个关键帧就够。

6. 文字标晚于图形标出现

让文字标有自己的节拍，等图形标落定之后再来。

• 可编辑文字 — 套用 TextFX 预设。typewriter 类按字符、单词或行揭示，所有套餐都能用；motion_advanced 里的 slideUp、elasticOut 等需要 Creator 及以上。
• 轮廓路径 — 手动错开：在时间轴里拖每个字母的片段条，让它比前一个稍晚开始，或者把它的第一个关键帧往后拖。

7. 用缓动决定手感

右键关键帧选缓动。KinoViz 内置 40 多条曲线，每条都带预览图：

预设接近但不完全合适时，可以自己填三次贝塞尔参数。

8. 导出

从顶部栏打开导出弹窗，常规分发选 MP4，想要体积更小的网页文件选 WebM。两者都会把画布背景烘进视频，需要透明素材请改导出 PNG 单帧。设置套餐允许的分辨率和帧率后开始渲染，渲染在浏览器标签页里进行。

小技巧

• 结尾留半秒静止。 让 Logo 静静停一会儿，观众才有时间认出它。
• 错位按十分之一秒算，不是按秒。 每个元素错开 0.05–0.15 秒读起来是一个连贯动作，间隔更大就变成几件互不相干的事。
• 图形标和文字标不要同时进场。 同时出现会互相抢注意力，把揭示压平。
• 修剪片段条。 在时间轴里拖每个图层片段条的边缘，别让任何元素提前出现在画面里。

常见问题

Logo 揭示动画做多长合适？

片头或社交短动画通常两到四秒。用时间轴工具栏上的时长按钮设置总长，别留着默认的十秒。

Logo 揭示动画能导出透明背景吗？

静帧可以。在背景面板里把画布背景选成棋盘格色板，然后导出 PNG，透明会被保留。视频导出不行：MP4 和 WebM 都会把画布背景烘进每一帧，透明视频导出暂未提供。需要会动的 Logo 压在其他画面上时，把那段画面导入 KinoViz 项目里合成好再导出。

同一段揭示动画能在多个项目里复用吗？

把 Logo 做成组件。组件是主体与实例的关系，改主体会同步到所有实例，每个实例还能带自己的小幅覆盖（例如换色）。组件在所有套餐可用。Creator 及以上还能导出 .kino 文件在别处导入。

做 Logo 揭示动画需要什么套餐？

整套流程在免费版上都能用。免费版导出上限 540p / 24 fps 并带水印；Creator 去水印并提到 1080p / 30 fps。

相关内容

• 如何在浏览器里给 SVG 做动画
• 如何导出透明 PNG
• 动画与时间轴 — 关键帧、缓动、片段条与 TextFX
• 组件 — 主体与实例复用
• 导出格式
• 术语表
• 价格