编辑器基础

编辑器概览

KinoViz 编辑器是一款基于浏览器的动画制作工具，采用双模式工作流：设计模式用于布局和样式，动画模式用于关键帧和运动。通过顶部栏的 设计 / 动画 切换按钮在两种模式间切换。

元素类型

KinoViz 提供 8 种主要可创建元素类型，以及组织类型（群组、组件）和特效图层（GLSL 特效）。

形状

矩形、圆形、多边形、星形、线条等。支持填充、描边、渐变、圆角半径。

可动画属性：位置、缩放、旋转、不透明度、填充颜色、描边颜色、圆角半径

文字

可编辑文字，支持字体、字号、字重、颜色、对齐、行高、字间距。支持文字绑定路径。

可动画属性：位置、缩放、旋转、不透明度、颜色

图片

PNG、JPG、SVG、WebP。支持图片滤镜（亮度、对比度、饱和度、色相、模糊、灰度、噪点等）。

可动画属性：位置、缩放、旋转、不透明度、所有滤镜值

视频

MP4、WebM、WebP、GIF。支持单次/循环/乒乓播放模式，内联播放。文件大小遵循套餐的单次导入限制（Free 10 MB / Pro 100 MB / Studio 1 GB）。播放控制在动画模式中显示，在设计模式中隐藏。

可动画属性：位置、缩放、旋转、不透明度、播放状态（播放/暂停/停止）

路径

使用钢笔工具绘制的自由矢量路径，也是布尔运算的输出类型。

可动画属性：位置、缩放、旋转、不透明度、描边颜色

气泡

预置的对话气泡和思考气泡，可配置尾部方向、背景颜色和文字内容。

可动画属性：位置、缩放、旋转、不透明度

3D 模型

导入 GLB/GLTF 文件（支持 Draco 压缩）。完整 3D 场景，含光照、相机轨道和材质控制。所有套餐均支持基础 3D 编辑；SVG→3D 挤出、高级材质和环境需要 Pro+。

可动画属性：相机轨道（水平/垂直）、缩放、焦距、GLTF 片段动画

文字特效

内置动画预设的文字元素（5 个分类共 40+ 预设）。一键应用包含多个关键帧的完整动画。完整预设列表请参阅物理与特效。

组织类型

• 群组——多元素容器（普通、遮罩或效果器）。通过 Ctrl/Cmd+G 创建。
• 组件——可复用的符号，采用主控/实例模型。修改主控后自动同步到所有实例。
• GLSL 特效——基于着色器的特效图层（高级预设需要 Pro+）。

时间轴

时间轴在动画模式下可见（编辑器底部）。

• 播放头——拖动可在时间轴上浏览
• 关键帧——记录特定时间点属性值的菱形标记
• 片段条——每个元素的可见范围；拖动边缘可设置入点/出点
• 时长——默认 10 秒，可按项目自定义

使用关键帧

1. 在画布上选中一个元素。
2. 将播放头移到目标时间。
3. 在属性面板中修改属性值。
4. 关键帧自动创建。
5. KinoViz 在关键帧之间自动平滑插值。

按 K 可在当前播放头位置手动添加关键帧。

缓动

每个关键帧过渡支持缓动曲线。KinoViz 提供 40+ 预设曲线——线性、缓入/缓出变体、弹跳、弹性、回弹、步进等。在右键缓动菜单中，每个预设都有 SVG 曲线预览图。也可输入自定义三次贝塞尔进行精确控制。

画布操作

• 缩放：滚轮，或触控板捏合手势
• 平移：按住 Space + 拖动，或鼠标中键
• 选择：点击元素；拖动可框选多个
• 移动：拖动选中的元素
• 适合屏幕：Ctrl/Cmd+0
• 实际大小：Ctrl/Cmd+1

键盘快捷键