Ctrl+M输出电影、在渲染面板格式选项里选定GIF格式输出就可以了！ 楼上说的有道理，AE输出GIF质量很差、建议先用AE输出视频，然后再导入到Photoshop里面存储为WEB所用格式输出GIF，Photoshop对GIF的优化更为好一点，最后质量也好（MP4,MOV,AVI,W

本文分享一下如何用 AE 配合 AI & PS 进行简单的 gif 动效制作

材料/工具

After Effect

说来话长了，教你的话智商需要十几二十个步骤，涉及到的不只是基础还有理论，光靠说的话的你肯定会蒙圈，建议你还是找一些UI/Ae 厉害的大师请教，案例加说辞会好点。环球网校能工巧匠很多，你可以去了解

方法

打开 AI, 文档类型选择 Video and File, AI 画布会自动帮助创建文字安全线，便于后期导入 AE 中。

Ps、Flash、Ae都可以，用在交互动效中flash就可以AE是纯粹的视觉特效软件虽然定位是影视后期，但是网页也有使用，作为UI设计师用AE只能说你很新潮很厉害，AE也有自己基于JavaScript语言的表达式来实现高级动画控制，目前来看AE现在用的最多的领

绘制LOGO输入 SURF, 调整字体设置，使其大小适中新图层，复制 SURF，内容改成 ZONG需要注意的是，每一个需要运动的元素都需要创建在单独的图层上。因为 AE 支持直接导入 AI 文件，同时会将 AI 每一个图层对应生成

画一条mask作为轨迹，展开mask属性，找到第一项mask path，这个参数跟位移position都是一个二维参数。故选中mask path, Ctrl+C复制，找到你那个动效的position，Ctrl+V粘贴。 现在路径的值已经被赋予在动效的运动属性上了，按空格键预览下，可发

导入AI

打开 AE, 将 AI 导入[import as component]，生成新的 Component.

这个是你在输出的时候选择杂边边缘为白色，只需设置无就可以了。 举报继续追问： 能详细点嘛 ~ 我不太会 呵呵 ！ 你哪个在哪调的呀？ 谢谢了 o(∩_∩)o 举报补充回 你点击文件——储存为WEB所用格式，然后格式选择GIF，就有这个界面了

双击 Component

Ps、Flash、Ae都可以，用在交互动效中flash就可以AE是纯粹的视觉特效软件虽然定位是影视后期，但是网页也有使用，作为UI设计师用AE只能说你很新潮很厉害，AE也有自己基于JavaScript语言的表达式来实现高级动画控制，目前来看AE现在用的最多的领

双击 Component

Ps、Flash、Ae都可以，用在交互动效中flash就可以AE是纯粹的视觉特效软件虽然定位是影视后期，但是网页也有使用，作为UI设计师用AE只能说你很新潮很厉害，AE也有自己基于JavaScript语言的表达式来实现高级动画控制，目前来看AE现在用的最多的领

创建关键帧

根据自己想要的动画效果，创建关键帧，并设置对应属性。每一个单独的图层好比一个跳跃的小动物，黑色画布好比美丽的草原。而你就好比大自然的神，让每个小动物在特定的时刻以某种方式出现在大自然的某个地方。

简单的动效图标做几个静态图交给开发在程序里顺序更换就能得到效果，类似以前的电影胶片的道理

设置动效

但动画效果都是线性的，看起来没有什么动感。这时候需要点击 Graph Editor 按钮，去调节动画曲线。但让也可以快捷设置 Ease in || Ease out || Ease Ease, 按照你想象中的方式设置它。曲线越缓，动效渐变越快，反之亦然，多设置几次就会找到你喜欢的模式。

你好，很高兴回答你的问题。在ae里面对文字属性的字间距和描边分别做动画就可以了。希望能对你有帮助。

导出为PNG

说来话长了，教你的话智商需要十几二十个步骤，涉及到的不只是基础还有理论，光靠说的话的你肯定会蒙圈，建议你还是找一些UI/Ae 厉害的大师请教，案例加说辞会好点。环球网校能工巧匠很多，你可以去了解

点击 Output Module，将导出 Format 设置为 PNG Sequence. 这样 AE 便会将所有图片帧按 Sequence 保存到指定地址。

首先介绍最重要的两个概念： 动画（Animation） 某个界面控件在一段时间内的变化即产生动画。产生动画的维度可以是它的形状、位置、大孝颜色、透明度等，抑或是它们的叠加。 过渡（Transition） 那这个控件在两个状态之间是如何变化的呢？定义这

导出为PNG

说来话长了，教你的话智商需要十几二十个步骤，涉及到的不只是基础还有理论，光靠说的话的你肯定会蒙圈，建议你还是找一些UI/Ae 厉害的大师请教，案例加说辞会好点。环球网校能工巧匠很多，你可以去了解

点击 Output Module，将导出 Format 设置为 PNG Sequence. 这样 AE 便会将所有图片帧按 Sequence 保存到指定地址。

首先介绍最重要的两个概念： 动画（Animation） 某个界面控件在一段时间内的变化即产生动画。产生动画的维度可以是它的形状、位置、大孝颜色、透明度等，抑或是它们的叠加。 过渡（Transition） 那这个控件在两个状态之间是如何变化的呢？定义这

图片导入PS

在Dribbble和Behance上，你们可能见过很多用Gif来表达设计理念的UI作品。很多人都想知道怎么来制作，怎样更好、更高效的表达自己的理念。很明显，动态的展现比静态的更形象，在这片文章中，我将教大家如何“动态化”自己的设计作品。 动态GIF展现U

打开PS, Open 保存图片的文件夹，选择第一张图片，导入时记得勾选 Image Sequence checkbox.

Ps、Flash、Ae都可以，用在交互动效中flash就可以AE是纯粹的视觉特效软件虽然定位是影视后期，但是网页也有使用，作为UI设计师用AE只能说你很新潮很厉害，AE也有自己基于JavaScript语言的表达式来实现高级动画控制，目前来看AE现在用的最多的领

存储为WEB

载AK大神的插件：twitch。 抖动-颜色分离，按照这个逻辑来设置 很简单http://tieba.baidu.com/p/2681703065

存储为 WEB，格式选择为 gif 即可。

1、基础动画 通过控制元素的基本属性来实现动效，位置（P）、缩放（S）、旋转（R）、透明度（T） 例：列表元素由左向右滑动出现的动效 2、路径动画 路径动画就是物体或者某个元素按照设定好的路径进行运动 例1: 纸飞机的运动 例2: 针和线的运动

大功告成，用浏览器打开 gif 便可以欣赏自己的作品了

扩展阅读，以下内容您可能还感兴趣。

AE 动效 这个图怎么做出来？

Ps、Flash、Ae都可以，用在交互动效中flash就可以AE是纯粹的视觉特效软件虽然定位是影视后期，来但是网页也有使用，作为UI设计师用AE只能说你很新潮很厉害，AE也有自源己基于JavaScript语言的表达式来实现高级动画控制，目前来看AE现在用的最百多的领域是CG、多媒体行业的领域。

Flash给大多数人的印象，这是一个矢量动画度软件，但是容易忽略的一点就是知动画并非是Flash的全部，它并不像AE一样纯粹的构建视觉特效它还可以做游戏、做网站开发，能做很多东西一个明显的特征就是逗交互性地，比如玩游戏就是一种交互。

作为道UI设计师flash用于做动效就可以，毕竟AE做出来的东西更适合看。追问额，我想要的是这个动图的原理，制作方法，打上AE只是为了扩大答题者范围

想知道 这个简单的AE动效如何实现（只要告诉我如何从长方形变为体形也可以）效果如图

这个你拿mask画个A图形. 然后对mask打个关键帧. 再拿这个mask画个B图形. 不就有A-B的变形动画了吗?更多追问追答追问这个三角形 貌似由两个对等长方形 旋转变形得来（你说打关键帧变形 我想知道 大什么命令的关键字） 我只有7分。。给你5分。。望指点迷津追答

你拿Mask先画个A.. 然后打开mask path关键帧. 然后拖动时间线.你想让这个变形动画几秒就拖动到几秒. 然后在拖动到的位置处. 调节当前Mask节点为个三角形就行了.

APP上的动效图标怎么交付给开发？保存GIF?

简单的动效图标做几个静态图交给开发在程序里顺序更换就能得到效果，类似以前的电影胶片的道理

请问这种动效AE怎么做？

你好，很高兴回答你的问题。在ae里面对文字属性的字间距和描边分别做动画就可以了。希望能对你有帮助。

如何用AE创建简单的UI动效

说来话长了，教你的话智商需要十几二十个步骤，涉及到的不只是基础还有理论，光靠说的话的你肯定会蒙圈，建议你还是找一些UI/Ae 厉害的大师请教，案例加说辞会好点。环球网校能工巧匠很多，你可以去了解