恭喜你成为UI中国推荐设计师 (详情)
//百度统计 20220402 uicn

您的意见是我们 UI 中国进步的动力!
点击立即反馈按钮,发表您的意见!
立即反馈
QQ群反馈
您也可以加入UI中国官方反馈群进行反馈!
群号:302892100
备注:反馈问题后@管理员能让我们及时了解您的意见

提交需求

赛事与广告咨询合作,请填写需求表单,我们会在第一时间与您联系!

0/20
0/200

设计大赛

  • 设计大赛
  • 发布广告
  • 发布招聘
  • 其它需求

提交完成
感谢您对UI中国的支持和信赖!
动效中的细节丰富感
0.0°
2018-09-05 原创文章 经验/观点 举报 1181 3 2 1

终于忙过了一阵子,也有些想给大家说的关于我自己个的想法和实践所行的东西啦~ 


2018年截至目前我可做了好多部关于公司产品宣传类的MG动画,以及一些UI上的交互相关的工作,累P了,也看了些文章,关于动效的文章,真的是太多太多了。巴拉巴拉都是些动效多么的重要,多么的有用之类的,其实吧,我就觉得吧,这些东西只要与工作相关,设计师情之所至的就确实需要学学,其余的都是浮云~UI中动效表达确实是心之所向,技术所至,至美设计的需要~ 所以不要掉队~ 我们一起UP UP~


言归正传,敲黑板,下面说的东西或许对正在学习动效设计的小伙伴很有帮助,就是动效设计的丰富感表现。


为啥别人的动画那么流畅?为啥别人的动画那么酷炫?为啥这么花里胡哨的东西我搞不出来?很难吗?


其实设计都是有技法可行的,只是这个技法有些感性,需要脑洞,需要处处留心,需要积累。


比如做一个圆环的加载动效,如下图原始-加载效果,其实整体来看没什么问题,就是个普通的加载,规规矩矩但毫无亮点,应付差事其实是OK的,但是对于个人提升和产品的性格表现来看,just so so~ 还不如程序员哥哥搞的有水平。

0


下面我将告诉大家丰富动效细节的小技法:


1.丰富对象形态。动其实是个关联性的行为,单一的动理论上没有问题,但是视觉上表现出来就会使得画面有些空旷感,适当的增加对象关联性的装饰元素,可以增添细节的丰富感,画面也会有些生动的气息,比如下图改造-1:

1


2.为对象建立主从关系,制造时间差。画面中的主要元素是动画含义的表现主体,它直接决定了动画的性格和内容,红花需要绿叶的衬托,在动效设计中,主要元素增加些“绿叶”的装饰,有时可以事半功倍,彰显生命活力。但是注意,绿叶终究是绿叶,不管怎么装饰都不能抢了主角的光环,避免乱花迷眼。比如下图改造-2:

2


3.使画面增加层次感,透视/光影等表现。简单的透视效果可以很好的营造出空间感,Google推出的设计语言-Material Design教科书般的讲述了动效元素如何营造空间感,如何表现多维度等设计理念。简单的加些投影,便可以使简陋的元素充满层次感,比如下图改造-3:3



4.反向思维,打破规律的动态表现。预动作的加入,使其形成一个虚拟的反向作用力,再加上夸张的惯性表现,和关联的裙带动作。另外为这个圆环加些特殊效果,有一点性格成分。一个简单的加载便可以俏皮起来了,比如下图改造-4:4



5.夸张的动作,有趣的剧情。小时候看猫和老鼠很容易上瘾,哈哈傻笑,额,暴漏年纪了,里面过于夸张的动画表现不仅搞笑更能为剧情的发展注入情绪,也许这就是动画的魅力,可以接受太多的不可能,可以任由设计师情绪性的表现,更能够实现那些反人类的运动,并且居然看着很合理。一个渐生长的小圆环,加入了Y轴的旋转,貌似不合理,但动画就是可以这么夸张而充满想象。比如下图改造-5:5



最后想总结的是:设计师是一个太牛逼的工种,是创新和潮流的践行者,是社会精神文明建设的引领者,丰富的想象力和走心的观察力是设计职业生涯不可或缺和停止的,也只有保持不断的学习,不停的想象,生活才能够处处新奇和美好,我们看到的事物才能够充满爱和趣,这样,我们呈现的作品才能够更加的美好。加油吧,每个战斗在一线的小伙伴们,希望每天都有好运气~ 

酷


更新:2018-09-05

收藏

3人已收藏

小凉小爽

Do or Die~

  • 17

    作品

  • 27

    粉丝

  • 29

    关注

  • 3D螺旋扭曲
  • 转场动效
  • CSS派生选择器
  • 一道闪电
相关标签
设计GUI经验

    猜你喜欢

      2018-09-05 原创文章 经验/观点 举报 1181 3 2 1

      动效中的细节丰富感

      0.0°

      你确定要举报动效中的细节丰富感

      如果查出恶意举报,十天内禁止提交任何举报申请。

      0/200

      上传证据: 超过10M的附件请使用网盘地址

      点击上传附件

      对谁可见:

      全部设计师
      • 全部设计师
      • 推荐设计师和认证设计师

      您确认要推荐?

      该作品发布时间:2018年09月05日

      评分

      完整度

      启发性

      勤奋性

      排版布局

      推荐心得

      建议20-200字以内

      0/200

      2
      3
      1

      账号或密码错误,请重新输入

      账号或密码错误,请重新输入

      登录

      手机号

      发送验证码 120s 验证码错误

      登录
      第三方账号登录