动态 SVG 制作软件有哪些?

2019-09-29 10:28:10 +08:00
 STEENSUN
14281 次点击
所在节点    设计
8 条回复
OSF2E
2019-09-29 10:56:32 +08:00
业余 UI 一枚,我只知道 Adobe Animate
damngood
2019-09-29 11:03:48 +08:00
designer code 上面有一个专题,貌似叫什么 Green sock 还是什么的
zhangyu911013
2019-09-29 11:08:38 +08:00
after effect 制作,bodymovin 插件导出 json,前端直接用
vsitebon
2019-09-29 11:51:54 +08:00
有一个办法是 After efect 结合 bodymovin 导出
有一个收费的在线编辑器是 svgator.com
有一个免费的在线编辑器是 svgartista.net
有一个本地的编辑器是 synfig (非常简单,只能做很简单的效果)
有一个强大免费开源的本地编辑器是 blender (易用性不够 AE )
----------
以下是使用 JS 结合静态 SVG 实现的动画
有两个是使静态 svg 动起来的 JS 库,snapsvg.io ,zzz.dog (这个是基于二维图,制作 3D 动态)
有一个但是我没试过的 JS 库是 d3.js (可以让你制作动态图表,前段时间特别火)
no1xsyzy
2019-09-29 14:05:22 +08:00
@vsitebon 我觉得 JS+SVG 就没必要指出了,这个连 Angular/React/Vue 三大框架都行,甚至模板化更亲民(这大概也是为什么 d3 突然又没什么声音了)。
现在炫技的 “动态 SVG” 都是在拿 CSS 动画做,虽然我不会。一方面 CSS 可以在不支持 JS 的地方用,另一方面 CSS 可以使用 GPU 加速(变换运算),而 JS+SVG 不行。

当然,用二维做 3D (伪 3D ?)也算是个独立方向。
LucasW
2019-09-29 19:17:38 +08:00
选择不多 snapsvg.io 正在使用,还不错,但是做复杂动画的话已经完全被 Canvas 和 WebGL 取代。
vsitebon
2019-09-29 19:20:36 +08:00
@no1xsyzy 嗯,zzz.dog 就是二维做伪 3D,其它我其实只是列出来一些方案来抛砖引玉。更重要的是分割线以上的方案,我觉得那些才是楼主想要的
fenx
2019-09-30 12:19:22 +08:00

这是一个专为移动设备优化的页面(即为了让你能够在 Google 搜索结果里秒开这个页面),如果你希望参与 V2EX 社区的讨论,你可以继续到 V2EX 上打开本讨论主题的完整版本。

https://www.v2ex.com/t/605285

V2EX 是创意工作者们的社区,是一个分享自己正在做的有趣事物、交流想法,可以遇见新朋友甚至新机会的地方。

V2EX is a community of developers, designers and creative people.

© 2021 V2EX