AE动效设计的缓动曲线和表现层动效

上海/UX设计师/4年前/223浏览
AE动效设计的缓动曲线和表现层动效

设计的前提条件永远是你见过的,成为设计大师的前提条件是见的比大部分普通设计师多。

一、AE中的缓动曲线

由于在现实生活中,绝大部分物体的运动并不是非常规整的匀速直线运动,而是会受其他空气摩擦力、阻力等因素的影响,呈现出多种多样的曲线变化。

那么UI设计动效也是如此,要模拟现实,所以在动效设计时要通过缓动曲线的调节来改变物体运动的速率,从而使它的运动呈现多种多样的变化。

缓动曲线的分类:匀速运动(loading加载动效可以有效平缓用户等待时的焦虑心理)

加速运动(APP中的页面和场景切换时新页面的展现可以减少用户的等待时间)

减速运动(APP列表页中的图片和名称进入一个缓慢的进入)

先加速后减速、缓动组合运动。

二、表现层动效

表现层动效是指动效要实现不用最后的一个落地实现,只要我们制作出来展现就可以了。只需要展现不需要进行具体的落地实现。

主要用于三个方面:产品的提案过程中、设计师的概念稿和作品集的设计、MG动效。

表现层动效常用设计建议:过渡、来源、去向、情绪、属性。

过渡:1.过渡流畅——减少用户等待的焦虑感,适用于转场与页面层级切换。2.快速转场的动效——页面在进行转场或层级展示时,第一级和第二级页面要非常迅速。

来源:抽屉效果——模拟物理的现实,所属模块在层级中不断变化。

去向:下坠效果(商品加入购物车的动效)、落地回弹、运动惯性

情绪:带动情绪、错误提示、完成愉悦

属性:设计样式。

表现形式动效特点:并列(每个信息都作为一个单独的个体,有自己缓动的时间点存在;牵一发而动全身;同时进场和退场但有一定的结构和层次在里面)

因果(控制好动效控件它们要发生怎样的变化以及这些变化如何展现都是要提前定义好的)、

联动(板块之间的连接在设计时要构思清楚,哪些模块动或不动)。

5
Report
|
1
Share
相关推荐
评论
in to comment
Add emoji
喜欢TA的作品吗?喜欢就快来夸夸TA吧!
推荐素材
You may like
相关收藏夹
动效落地
动效落地
动效落地
动效落地
作品收藏夹
IP形象——动物类
IP形象——动物类
IP形象——动物类
IP形象——动物类
精选收藏夹
作品收藏夹
企业展厅
企业展厅
企业展厅
企业展厅
精选收藏夹
作品收藏夹
ip形象设计+表情包
ip形象设计+表情包
ip形象设计+表情包
ip形象设计+表情包
精选收藏夹
作品收藏夹
企业展厅/文化墙 参考
企业展厅/文化墙 参考
企业展厅/文化墙 参考
企业展厅/文化墙 参考
精选收藏夹
作品收藏夹
小家电
小家电
小家电
小家电
精选收藏夹
作品收藏夹
大家都在看
Log in