美文网首页
华丽的动效设计

华丽的动效设计

作者: 爱丽丝的UI妹妹 | 来源:发表于2018-10-25 20:21 被阅读0次

什么是动效?

 1. 动效是源于国外的MG 

        M 指 Motion运动 

        G 指 Graphic静态图片 合在一起就是运动的静态图片

  动态的图片, 传递信息 ,表达氛围

  2. 动效的作用是什么?

(1)产品展示 

      A. 展示了页面之间是如何切换的 元素跟元素之间是如何过渡的

      B. 菜单页的展示,比如圆圆的按钮运用动效,给我们交代了点开按钮之后它应该是什么

      C. List点击后是如何展开的以及是如何滑动的

(2)品牌建设(因为很多时候,静态的图片传递信息毕竟是有限的,所以运用动效展示品牌会更形象立体)

(3)交互展示(就是界面的跳动,信息的展示以及细节的展示)

3. UI为什么需要动效

(1)流畅过渡 (UI最基本功能),它交代了元素之间是如何过渡的,点击后页面是怎么跳转的,标签之间的滑动效果是个什么样子,整个操作非常流畅

(2)高效反馈 : 知道时间多久效率高

(3)增强操纵 : 结合手势操作比如看小说,动效简单到就是跟我们实际翻书效果是一样的,直到上一页下一页怎么翻很轻松的驾驭

(4)帮助引导 : 比如滑动解锁,利用颜色的渐变跳动引导我们向那个方向解锁

(5)升华体验 : 产品做得很好就是缺乏亮点就可以用动效设计提高产品的魅力值

4. 动效的 “坑”

(1)复杂繁琐:所以我们做动效的时候一定要做到简洁适度

(2)未考虑开发成本;会出现项目延期而不被采纳

(3)性能和响应度差:在做动效的时候一定的考虑设备的性能跟响应度,因为我们的动效是在设备上来跑的,所以由于硬件的一个性能注定我们不能任凭自己的性子来做动效

(4)如果开发已经优化到最大程度了 设备上还是跑不起来


总结

1. 动效是指,会动的图片,它能够传递信息表达氛围

2. 动效设计与动画设计,动效设计与平面设计,是有区别的

3. 动画设计有个性鲜明的角色 有曲折离奇的剧情 有环境氛围的烘托 有特定信息的传递从而反映社会现象哲学道理等这些元素组成了动画片的迷人之处

4. 平面设计有信息的传递,比如海报品牌信息,还有氛围的烘托

5. 动效设计它是处于 "动画设计" 跟 "平面设计" 之间一门交叉性的学科,所以它是用动态的图片来传递信息表达氛围的

6. 品牌和动效完美地结合能反映产品的本质

对自己说:路在自己脚下,没有人可以决定我的方向 ~

相关文章

  • 华丽的动效设计

    什么是动效? 1. 动效是源于国外的MG M 指 Motion运动 G 指 Graphic静态图片 合在一起就是运...

  • 近两年的设计趋势

    1.1 动效设计和动画设计 我认为动效设计会是主要趋势,因为在几乎所有的设计领域都能用到动效,从微动效到Logo和...

  • 动效设计-交互设计的最后一公里(三)

    在《动效设计-交互设计的最后一公里(一)》中,作者已经将动效的类型划分为四种:品牌类动效、引导类动效、转场类动效、...

  • ENViews, 一个华丽丽的动效控件库

    ENViews, 一个华丽丽的动效控件库,所有控件原型取自Nick Buturishvili的设计作品 出于学习的...

  • 动效设计

    我的动效设计,sketch绘图,principle制作动效。

  • 近日动效设计

    最近的一些动效工作和练习作品 信商产品App动效设计 动效设计练习作品

  • 动效设计之我见

    在这个动效设计元年,动效设计似乎也变成了设计师必备的技能之一,那么笔者就来分享一下自己对于动效设计的见解吧。 工具...

  • Principle: 做动效,选对软件很重要

    你有多久没做动效了?平时的工作主要是终端视觉设计,功能需求加运营需求,静态稿件加动效设计,从比例来看,动效设计其实...

  • 图标动效设计灵感,让你的图标动起来

    动效设计已经成为了一种设计流行趋势,动效在设计中被越来越广泛的运用,好的动效设计对用户体验的提升是显而易见的,它的...

  • PopAnimation入门

    开元大法好,首先感谢Facebook开源了POP动效库,让人人都能制作出华丽的动效。 在GitHub上打开Pop的...

网友评论

      本文标题:华丽的动效设计

      本文链接:https://www.haomeiwen.com/subject/gwoctqtx.html