020-29815005
预约专线时间:09:00-23:59

UI设计中的动效是什么

新闻来源:优漫教育 日期:2021-06-12
新一代的因特网产品,大量地融合和互动,同时也是各种竞争中的一个重要亮点,因此,知道互动的有效性对于新时代的设计者来说,也是必不可少的能力。甚至对于流畅性的整个交互来说,还不够熟悉,至少还需要对一些启动、负载状态进行一些设计。
         当我们与研发人员进行对接时,仅仅通过语言和想象是不能描绘出预期特效的,而且,大多数研发人员会直接将动效库调动起来,或将gif图片作为默认值。因此,对动作有效性的描述要求我们用视觉表现的方式来表现。现在,我们可以使用photoshop的时间轴来做一些动态的设计了,基本上不会有什么问题。

UI设计培训,设计培训

  波纹式时间轴。

  “时间轴”的概念以及flash和aftereffects的作用是相通的,即将元素从一个地方移动到另一个地方。其低成本、高速度的特点是受到大众设计师的喜爱,而目前,在互联网上使用photoshop进行qq表情的设计大多是使用photoshop。



  photoshop序列框架动画

  对于时间轴,如果不太熟悉,也可以使用序列帧动画,其实这个解释比较简单,把2+n张稍有不同的图片排列整齐后,再进行设置,更直接的说就是将关键帧动效作为简单动画来使用。尽管该特性的动态特效没有时间轴那么好,但它在处理由loading读取的动画时非常快速。

  应该指出,输出的并非gif格式的动画图片,而是png透明背景格式的输出,如切图,再将其与程序进行动效连接。


       UI设计动效是什么?

       动效应该算是概念设计领域的一个分支。总的来说,概念动效还是在做动效和动画的设计,不过它是为了在真实的产品上线之前,基于特定的想法、构思而进行创建的东西。在进行用户界面设计的时候,动效可以存在于交互、转场和具体的控件操作上,动效作为一种状态转变、交互反馈和视觉引导的工具而存在。动效设计师会使用各种各样的工具来进行动效的设计,我们常常提到的工具包括 Adobe After Effects,Principle,Figma 和 InVision。


       为什么UI设计需要动效

       这其实是目前最富有争议的话题。很多概念动效和现有的、成型的动效/动画解决方案,在步骤、效果、执行和开发上都不尽相同,超出了通常的限制和常见的规则。这种动效技术在刚刚开始接触的时候,会觉得不够真实,没有必要,甚至有人会认为无法实现。

      想了解更多关于UI设计的知识请关注广州优漫动游教育