VG简介

只要是程序员的你，你不得不知道svg图片，它可以无限任意放大拉伸都不会损失画质，就像系统字体一样可以无限矢量放大，svg更高级是可以用来制作矢量动画，现在各大浏览器和系统基本对svg已经支持很好了

SVG与Gif的比较

SVG图片: 矢量放大，动画也是矢量，体积极小，相当于一个.txt文本的体积,几b到几kb

GIF图片：固定大小，动画为图片逐帧显示，体积贼大

SVG应用的平台

Android应用、IOS应用、网页、电脑软件

SVG的设计工具

Sketch、Photoshop、AI等等

我个人推荐使用Sketch来设计svg图形

svgator动画制作工具

好了废话不多说啊，以上是svg的科普知识而已，下面介绍制作svg动画的强大工具

这个工具是一个网页在线的svg制作工具，只需要进入网页就可以制作svg动画了，不过这个工具制作起svg动画来是跟ae使用差不多的，如果有ae的基础基本使用就非常好上手啦。

工具非常强大，而且没有广告，重要的是免费使用的，制作好动画之后呢直接又可以导回出svg图片了，这时你的svg就是会动的了，你就可以直接应用到网页或者移动应用的开发当中了

工具的编辑界面

这里还有一个技巧，你可以去阿里图标库去下载svg图片导入到这里来编辑添加动画，然后再导出

前往工具地址

https://www.svgator.com/

是国外网站所以你需要翻墙来使用喔

网页中SVG应用的案例

比如又拍云官网就大量使用了svg动画，还有更多大家自己去发现学习了。

通常可以被用作一个图标的特效，banner背景特效等等，在移动应用中svg可以用于制作app的引导页动画和按钮等

SVG动画制作工具 ， 从此抛弃臃肿的gif的更多相关文章

  1. 关于HTML5在动画制作工具Animatron的一些问题

    Animatron是国外一款在线HTML5动画制作工具,网址:www.animatron.com 当然,想使用的话,是需要FQ的. 用animatron制作好的动画是可以下载为代码和GIF的,这时候付 ...

  2. MFC实现Gif动画制作工具

    每天来博客园逛,看里面各种好文章,发现自己已经许久没有分享点什么了. 前几天用MFC设计了一个小型的Gif动画制作工具,思路如下: 1.支持图片格式:"*.jpg","* ...

  3. svg可视化制作工具

    svg可视化制作工具直接ai里面用钢笔路径画好 然后右键建立复合路径 最后存储为svg即可 这样生成的svg就带path标签了

  4. [置顶] 我的Android进阶之旅------>介绍一款集录制与剪辑为一体的屏幕GIF 动画制作工具 GifCam

    由于上一篇文章:我的Android进阶之旅------>Android之动画之Frame Animation实例 中展示的是Frame动画效果,但是之前我是将图片截取下来,不好说明确切的动画过程 ...

  5. 我的Android进阶之旅------>介绍一款集录制与剪辑为一体的屏幕GIF 动画制作工具 GifCam

    由于上一篇文章:我的Android进阶之旅------>Android之动画之Frame Animation实例 中展示的是Frame动画效果,但是之前我是将图片截取下来,不好说明确切的动画过程 ...

  6. css3动画制作工具

    1.从chrome webstore下载 chrome应用商店安装地址 2.直接下载crx文件 如果无法访问到chrome的应用商城,可以选择下载app.crx文件,在chrome中打开chrome: ...

  7. HTML5 页面制作工具

    https://www.zhihu.com/question/30087283 HTML5 页面制作工具 免费的基于 HTML 5 的 Web Apps 生成器工具网站     81 235 初页 制 ...

  8. SVG交互动画制作

    前面我们已经说过了要怎样制作CSS3动画,但是SVG动画一直都没有时间研究过,正好趁现在有一点时间静下心来研究一下. 一般来说,常见前端动画实现方案分为三种,CSS3动画,HTML动画(SVG动画), ...

  9. CSS Animatie是一款在线制作CSS3动画的工具，可以在线直接制作CSS3动画效果，生成代码

    CSS Animatie是一款在线制作CSS3动画的工具,可以在线直接制作CSS3动画效果,生成代码 CSS Animatie 彩蛋爆料直击现场 CSS Animatie是一款在线制作CSS3动画的工 ...

随机推荐

  1. (3)centos7 目录结构

    根目录下的文件下 根目录:  /   注意:根目录只存放目录,并且/etc./bin./dev./lib./sbin应该和根目录放置在一个分区中 /bin 二进制目录,存放用户级的GUN工具  /bo ...

  2. 使用listFiles的FileFilter过滤来查找文件并处理

    package test; import java.io.File; import java.io.FileFilter; public class MyFilter implements FileF ...

  3. maven学习整理-基础知识

    1.maven认识 maven是一种自动化的构建工具,它主要解决的问题有: ①项目中的划分规则:原先我们用package或文件夹的形式来划分不同模块,导致在一个项目中存在大量的文件夹和包代码显得庞大: ...

  4. java有序列表

    关于有序和无序的定义: 有序:有序列表中的元素具有某种内在的关联,这种关联定义了列表之间的顺序 无序:无序列表中的元素按使用者所选择得任意方式排序 索引:索引列表为他的元素维护一段连续的数字索引值 有 ...

  5. mariadb入门

    MariaDB数据库管理系统是MySQL的一个分支,主要由开源社区在维护,采用GPL授权许可.开发这个分支的原因之一是:甲骨文公司收购了MySQL后,有将MySQL闭源的潜在风险,因此社区采用分支的方 ...

  6. 高程（三）--- Date

    Date类型使用UTC(国际协调时间)1970年1月1日0时0分始到现在的毫秒数来保存日期的. 所以当我们知道毫秒数时,还需要通过计算才能获取年月日时分秒. 一.获取时间对象 Date提供了2个方法: ...

  7. springboot中引用配置文件中的参数

    首先可以看到这是做微信登陆时候的配置,一般不会写死都是通过配置文件获取,所以,记载配置文件中 那么怎么引用呢: 可以看到直接注入的方式就可以引用了,所以看下面: 进行页面跳转,并且带有参数的, 使用m ...

  8. 笔记-Linux包管理命令

    一.apt, apt-get, dpkg命令 apt-get是一条linux命令,适用于deb包管理式的操作系统,主要用于自动从互联网的软件仓库中搜索.安装.升级.卸载软件或操作系统.使用apt-ge ...

  9. centos7 sshd 安全设置

    ssh 的安全机制 1.SSH之所以能够保证安全,原因在于它采用了非对称加密技术(RSA)加密了所有传输的数据.   2.传统的网络服务程序,如FTP等在网络上用明文传送数据.用户帐号和用户口令,很容 ...

  10. CSIC_716_20191128【多态、绑定与非绑定方法、isinstance与issubclass 】

    多态 what: 同一个事物有不同的形态. 多态的目的:在不知道对象具体类型的情况下,统一对象调用方法的规范.(通俗讲,即规定实现同样功能的方法,一定要起同样的名字). 多态的表现形式之一就是继承,先 ...