AE动效设计概论和实操

课程导师

马青 马青
曾任职于上海gamania,上海Massiveblack, 擅长界面设计、概念设计及传统美术绘画,熟悉项目开发交互流程,有着丰富的UI设计及培训经验。
00:00:00
Play
Next
00:00 / 00:00
40%
  • 2x
  • 1.5x
  • 1.25x
  • 1x
1x
2.我们不需要怎样的动效设计
离线学习

下载APP离线观看

技能补充更多
  • 流程图
    流程图

    产品经理梳理过程的利器——流程图,如何绘制流程图,如何组织要绘制的节点内容,用哪些工具可以更有效地绘制流程图,本部分产品流程图课程将深入浅出的带领大家实际训练起来。

  • 竞品分析
    竞品分析

    关注竞品进行分析是产品经理日常工作的重要部分,本部分课程将完整的介绍竞品分析如何组织,有哪些方法,以什么样的形式呈现,配合实际案例做全面的介绍。

  • 从零打造一款社区web产品
    从零打造一款社区web产品

    通过产品经理课程的学习,开展实际训练,运用之前课程中的方法和工具,完整的进行产品的设计流程和整体规划,对产品经理工作中的各个环节进行梳理形成全面认识,从0打造一款社区web产品。

  • 从零打造一款工具app产品
    从零打造一款工具app产品

    通过产品经理理论知识的学习,进行实际训练,运用之前课程中的方法和工具,完整的进行产品的设计流程和整体规划,对产品经理工作中的各个环节进行梳理形成全面认识,从零打造一款工具app产品。

  • 最新问答
  • WIKI资料
  • 课件下载
只看我参与的
  • 学习AE

    动效设计功能

    加强体验舒适度表现层级关系可以让用户用产品时更加舒适。如下案例:大家能够很好的看清层与层之间的关系,是“抽屉”还是“打开”,让用户知道上一个界面和下一个界面。这已经是非常常见的应用了,就是“表现层级关系”。与用户手势结合,更自然的动画表现当用户手势操作的时候,让界面的动态更符合手指的运动。如图案例,...

  • 学习AE

    不需要的动效设计

    不合理的动效设计案例设计所包含的方方面面在MengTo的《Design+Code》上与很好的归纳,我时常发现,经过一段时间的设计之后很容易在设计的过程中有所迷失,原因就在于我们很容易在意细节,保持阅读的习惯并试图用相对宏观的视角去看设计是一个很不错的做法。动效设计让页面元素能够非常自如的被操纵而不仅...

  • 学习AE

    动效设计原理

    动效设计原理UI就是基于静态页面来设计的,页面之间通过跳转、切换。在设计过程中,设计师比较重视单页的视觉效果,但是经常忽略了对界面跳转的处理。这些没有经过处理的跳转可能没有提供足够的预期,所以用户在使用时经常会觉得困惑。与此相反,在卡通的动画里面,由于使用了足够多的动画效果,用户可以非常容易理解某个...

  • 学习AE

    创建交互动画

    如何快速创建一个交互动画如图QQ的界面,也是常见的抽屉式界面。这个动效很简单,就有三个地方的变化:位置的位移、大小的变化、不透明度的变化。如图是已经设计好的界面,将两个界面衔接起来增添动效是有一个衔接过程的,大致分为三个过程。用PS给背景一个蓝色,然后文字部分给一个白色,这部分白色就是QQ联系人界面...

  • 学习AE

    输出交互动画

    如何输出交互动画并加以说明打开上节课的课程文件,可以看到整个交互大概是5秒钟,这个速度不现实,因为一般情况下的响应时常是400毫秒以内。所以修改一下交互动画的速度。完成了交互动画,下面进行输出,点击:合成、渲染前。然后如图选择分辨率“完整”,点击确定。然后最佳设置选择“草图”,点击确定。点击开始渲染...

  • 学习AE

    丰富动效原则

    移动应用丰富动效的六点原则转场由于手机屏幕空间有限,更多的内容会被隐藏在屏幕后边,或者屏幕的左边、右边、下边,转场动效能帮助应用营造一种空间方位感。如图第一个就是3D右翻转,可能通过这种方式进入下一个页面。平常见到最多的可能就是淡入和淡出,可能打开某个东西,会淡入淡出呈现一个广告或其他页面。    ...

  • 学习AE

    常见动效类型

    交互基础交互基础一般就是视觉表层跟信息的外观,然后动效与信息的运动方式,来表现视觉层级关系,以及UI之间的相互交换。如图是常见的IOS系统图层的相对运动,Icon图层做相向运动,视野缩小,视野中物体变大;Icon放大变成APP&文件夹,切换成APP界面或者文件夹。常见的四个动效类型:APP的Icon...

  • 学习AE

    基础交互动画

    常见的基础交互动画常见的基础交互动画有:页面的切换、弹窗、最小化、通知、下拉刷新。下面完成一个“下拉刷新交互动画的设计”。交互设计首先要把界面设计出来,如图是以前设计好的一个水果的项目,然后将进行动画的地方进行拆分,如图这部分进行下拉,然后上面不动的部分以及下面工具栏也是不动的,都需要拆分开。下拉之...

  • 学习AE

    交互动画练习

    杀毒软件的小动画下面做一个杀毒软件的小动画。首先要用PS去设计好,如图是一个设计好的页面,整个页面上下的布局要做的就是旋转的部分,以及包括数字的变化、背景颜色的变化。“90分”应该给一个绿色或蓝色。更改为如下图右边的命名,保存到桌边上。打开AE软件,新建一个,将之前桌面上保存的图片拖拽进来,“合并图...

  • 学习AE

    拆解原理

    交互动画练习一拆解原理打开PS软件,分析一下。下面的功能区是不需要变动的,整个需要进行交互的部分是上面一部分。所以首先需要将整个界面设计出来,将这些区分开来。所以设计的时候一定要把这些拆开,需要变动的部分是数字、转动部分。转动部分可能只是白色的部分进行转动(本节课暂时不讲)。另外背景需要颜色的变化,...

  • 学习AE

    交互动画练习进阶

    天气界面的动效下面进行设计天气界面的动效,不考虑它的逻辑性与数据,只考虑动效。首先用Photoshop把它设计好,用PS把AE里面的动效拆分好。如图已经拆分好了,晚上的可以命名为“1”,白天的就不命名,这样容易区分。编组之后会在AE里面变成一个合成,那样子的话就不好调节。打开AE,新建一个项目,再把...

  • 学习AE

    交互动画练习高级

    完善上节课的设计本节课对第十一节课进行完善,打开AE软件,完成从夜间到白天的转变。首先最大的变化就是背景,在第六秒的时候就可以进行转变,先给它一个不透明度的变化,进行不透明度的变化,选最好的效果。也可以直接调一下颜色试一下,“效果、颜色校正、色相饱和度”,看一下能不能调出我们想要的效果,因为看到的黄...

  • 学习AE

    动效网站

    动效网站设计欣赏与练习技巧这里有几个个人觉得很不错的网站:http://www.ginventory.co/,http://thisisarc.com/,http://kwokyinmak.com/。下面这个网站是一个非常漂亮的网站的排行榜:http://bestwebgallery.com/。这里...

© 2012-2016 www.maiziedu.com

蜀ICP备13014270号-4 Version 5.0.0 release20160127

你有一个红包等你领取!

免费电话咨询