Friction：制作网页 SVG 和视频动效的二维动画工具

做网页图标动效、片头文字动画或简单的动态图形时，可以用 Friction 在本地完成从矢量图形调整、关键帧编排到导出的流程，兼顾网页端与视频制作的需求。

导入与外部链接素材

软件支持同时处理矢量与位图素材，但两者的管理方式有所不同：

• 导入 SVG 矢量图：使用导入（Import）方式添加 SVG 时，图形路径会直接写进工程内部，可以在软件里继续修改颜色、形状以及 SVG 的渐变和文本；macOS 用户还支持直接从 Inkscape 复制并粘贴 SVG 内容。首次运行时的快速设置向导可以协助完成基础配置，升级后可以从帮助菜单安装新增预设，也可以用快速设置向导安装。
• 外部链接素材：使用链接（Link）方式引入 SVG 或 JPEG、PNG 等位图时，素材仅保留外部引用并增加变换参数。由于软件本身没有像素级修图工具，位图无论用哪种方式添加都会自动转为外部链接。保存工程时，链接的素材不会打包进去。移动或分享工程时，需要把这些外部文件一并带上。

用关键帧和表达式编排动效

界面支持同时开启多个场景、预览视图、时间轴和曲线图表，适合在大屏幕上对照调整不同镜头的节奏。

除了手动打关键帧和添加矢量、文字特效，参数与特效还支持使用 ECMAScript 编写表达式。软件内置了带语法高亮、自动补全和自定义函数的代码编辑器，并提供了帧重映射循环与弹跳循环等表达式预设，做重复摆动或周期循环动画时不必逐帧手动复制。

截图：Friction contributors，原图文件 · GPL v3。

导出网页 SVG 动画与视频素材

根据成品投放到网页还是视频剪辑软件，可以选择对应的导出格式：

• 网页 SVG 动画：支持导出基于 W3C SMIL 标准的动态 SVG 文件。需要注意 SVG 导出器仅支持软件功能的一个子集，编辑视图里看到的效果不一定全部都能原样写入 SVG；导出时可以用快速预览功能直接调用默认浏览器查看实际表现。
• 视频与序列帧：内置了 WebM 渲染预设，并配有专门的图像序列导出对话框，可将动画输出为 TIFF、PNG 或 JPEG 序列帧，方便导入其他视频软件继续合成。

平台与安装注意

官网提供 Windows 10/11、macOS 11 及以上和 Linux 安装包。Windows 和 macOS 的安装包没有用于系统验证的数字证书签名，打开时可能出现安全提示，请先确认文件来自官网。Linux 默认使用 EGL；如果 NVIDIA 显卡在 X11 下遇到黑屏，可以试用官网另提供的 GLX 版本。

资料：官方发布说明 · 导出文档 · 下载及系统要求