相关分类
AE实例教程
AE特效教程
AE视频教程
VIP会员AE教程
飞特网 顶部通栏广告

AE制作APP界面动效

妮子发布于:2015-8-26 09:53
妮子
浙江省 绍兴市 GUI设计师
发私信 + 关注
简介: 这篇教程教飞特的AE学习者们使用AE制作APP界面动效,AE原本是做影视后期特效的,但是制作出来的动效GIF能力超群,所以现在很多的效果也被运用到APP程序的界面效果制作中,这篇教程制作的几个动效都非常实用,推荐一 ...

这篇教程教飞特的AE学习者们使用AE制作APP界面动效,AE原本是做影视后期特效的,但是制作出来的动效GIF能力超群,所以现在很多的效果也被运用到APP程序的界面效果制作中,这篇教程制作的几个动效都非常实用,推荐一下,喜欢的朋友记得给我好评啦!

FEVTE编注:更多After Effects实例教程学习交流和After Effects作品发布请访问飞特网After Effects实例教程栏目,地址:https://www.fevte.com/moive/AE/AESL/

天气应用gif(据观测,小圆点弹的过了,各位制作的时候修改一下吧)

提供源文件下载

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

动态GIF展现UI作品,优点在于:

  • 展示实际工作流程
  • 利用转场,来展示应用不同状态时的效果
  • 便于网络分享。

工具

  • After Effects CS6 or CC
  • Photoshop CS6 or CC

设计流程

After Effects

  1. 在一个合成中创建转场效果
  2. 另外一个合成中创建展示效果
  3. 导出


Photoshop
   4. 优化GIF图像

素材

伦敦背景图一张

手机透视效果模板一张


一、基本构建

创建转场效果合成 

步骤1

 打开AE,合成>新建合成(Cmd+N),尺寸为640*1136,帧数29,持续6s



步骤2.

 导入伦敦背景图像,将图像丢入合成1,调整背景图像尺寸,使其适合画布


步骤3

创建3个蓝色框(用形状图层),这些蓝色框将从屏幕上方下落到屏幕底部,宽度213、214、213px。三个方框上方的方框宽度640px,输入相应文本。

步骤4

用钢笔勾勒出云朵和6片雪花空心圆(勾勒的略水,见谅)


123下一页
25

好评
19

差评

刚表态过的朋友 (44 人)

  • 飞特游客

  • 飞特游客

  • 飞特游客

  • 飞特游客

  • 飞特游客

  • 飞特游客

  • 飞特游客

  • 飞特游客

  • 飞特游客

  • 飞特游客

  • 飞特游客

  • 飞特游客

  • 飞特游客

  • 飞特游客

  • 飞特游客

  • 飞特游客

  • 飞特游客

  • 飞特游客

  • 飞特游客

  • 飞特游客

  • 飞特游客

  • 飞特游客

  • 飞特游客

  • 飞特游客

妮子
浙江省 绍兴市 GUI设计师
+关注 发私信
发表评论

最新评论

引用
七晨发布于:2019-5-13 16:27
交个作业~~
引用
半梦半醒发布于:2016-2-25 09:49
棒棒哒,做得很逼真。同理,做手机来电的效果也是可以的。

引用
畅海发布于:2015-8-31 16:51
不错

查看全部评论(3)

您需要登录后才可以评论和提交作业 登录 | 立即注册
本周热点文章
2020 新飞特 从心开始
关于飞特| 广告服务| 付款方式| 版权申明| 网站地图| 联系我们| 加入我们| 举报| 帮助中心| 移动版| 手机版| 飞特网

委托设计