网页动效究竟是交互设计还是视觉设计

2016-02-16 22:20 1 1 收藏

下面请跟着图老师小编一起来了解下网页动效究竟是交互设计还是视觉设计,精心挑选的内容希望大家喜欢,不要忘记点个赞哦!

【 tulaoshi.com - 平面设计 】

自从iOS7发布后UI圈就开始疯狂流行起动画效果,尤其是在Facebook Home之后,大家觉得如果没有酷炫转场、扭来扭去元素,产品就好像上个世纪的老古董一样。但是让整个圈子争相学习的风尚背后却还仍然有一个争议:动效是交互设计还是视觉设计?

在很多外行人眼中,看到一个App动画不错,往往脱口而出的是哇,这个App交互好棒!。或者老板觉得产品太死板了,会对着大家说我们的产品交互还需要再打磨一下。其实从严格意义上来说,动效作为交互反馈的一部分也属于交互设计的范畴,但是大部分交互设计师既没有动效设计的能力,也一般不会去做这种事情,而现在努力学习动效的往往又是那些视觉大牛们。那做动效设计的工作流程到底是如何开展的呢?

(本文来源于图老师网站,更多请访问https://www.tulaoshi.com/pmsj/)

网页动效究竟是交互设计还是视觉设计,PS教程,图老师教程网

要了解这个问题,我们先要看动效设计的目的是什么?

1,在用户体验上为了达到某种目标的引导

早期互联网产品动画较少时,大部分动效都是为了解决某个具体的交互问题而存在的,有很强的目标性。比如iOS上book的翻页效果,因为用户对手势翻页没有很好的认知也不会很快适应,所以需要模拟真实的翻书效果让用户适应。

网页动效究竟是交互设计还是视觉设计,PS教程,图老师教程网

又或者在Safari下载文件后,文件的进度和管理会在Dock的下载文件夹下,用户不容易发现和注意到,这时会有一个图标飞入到下载文件夹的动画,告诉用户下载的文件已经到这里了。

网页动效究竟是交互设计还是视觉设计,PS教程,图老师教程网

2,让界面更灵动活泼

因为现在越来越流行扁平化,所以设计师都开始用更简单的元素尽量去突出内容。但是如果只是纯粹的扁平的话就未免有点太粗糙了,给人一种界面很死板、没怎么设计的感觉。所以为了泥补这个问题,动效可以让扁平的界面更活泼起来。

网页动效究竟是交互设计还是视觉设计,PS教程,图老师教程网

(本文来源于图老师网站,更多请访问https://www.tulaoshi.com/pmsj/)

比如Skype将普通的菜单弹出过程加上了果冻效果,让整个界面可爱了许多。类似于这样的动效有很多其实只是为了好看而制作的,他们属于视觉设计的部分,是为了让界面视觉更优秀。

所以可以看出动效即兼顾了交互的功能性,还具有美观性的特征,应该是交互设计师和视觉设计师互相合作的结果。

我们团队在具体开展动效设计的过程中,交互设计师会扮演导演的角色,视觉设计师扮演摄影师的角色。在设计动效时,交互设计师要先想明白动效所能解决的问题是什么,需要应用在什么场景下,以及把控动效的实现自然柔和不要过度。而视觉设计师不但要负责动效的制作,还会根据产品的特点加上很多风格化的效果。

网页动效究竟是交互设计还是视觉设计,PS教程,图老师教程网

交互设计师并不是动效的制作者,相比较而言视觉设计师不但更方便修改产品的素材,而且对产品的视觉把控能力也更强一些,所以更适合成为制作者。所以我觉得交互设计师要多了解动效的实现原理,学会运用动效解决问题,思考动效的概念。但是鼓励视觉设计师尽量多的掌握动效制作技术,让自己的效果图动起来。

视觉设计师在动效设计上需要交互设计师的把控,避免成为花瓶。和界面一样,动效在实现过程中也会影响到用户体验,比如过渡的并不自然,或者虽然很好看但是太花哨反而影响信息的阅读等,这些都可以让交互设计师帮忙check一下。

最后希望各位UI和UE同学,在面对新的流行趋势下能够更多的理解和认识它,不盲从,一起探索更好的工作方法。

来源:https://www.tulaoshi.com/n/20160216/1575606.html

延伸阅读
最近一直在做交互规范总结的工作,在不断梳理页面间跳转逻辑的同时,发现页面间的逻辑关系并不能和页面间跳转的动效很好的结合上。虽然只是零点几秒的切换动效,却能在一定程度上影响用户对于页面间逻辑的认知。为了输出详细的规范,花了大量时间把玩现在公司线上的产品以及国内外优秀的APP,尤其是苹果、谷歌自己开发的APP。如果某些方面在设...
本文主要讨论腾讯手机网站在WAP2.0下的界面交互设计体验,这类经验适合所有WAP2.0手机网站界面设计 适配竖屏横向尺度,禁止出现横向滚屏 常规QVGA机型竖屏状态下,14号字体,单行仅显示13.5个字。资讯频道的新闻短标题要控制在13字以内才能在一行以内完整显示。标题折行会造成在相同空间承载信息量减少;频繁的眼动容易引起视疲劳;在视觉上带...
在风起云涌的互联网浪潮中,产品迭代的速度越来越快。随着用户需求的激增,也不断带来了对设计师能力要求的提高。初入交互设计领域几年来,明显发现可视化的内容远比文档的更易于被用户(以至我们的客户)所接受,就像用户研究项目中常说的一句话:用户怎么说的,并不代表他们怎么想。今天以原型设计为基点,与大家展开几点做简要的分析。 一、...
对于视觉设计师、交互设计师来说,他们需要做的不仅仅是设计一张张静态的页面和独立的icon,他们需要将这些元素整体组合在一起,根据整体画面感和视觉体验来做出修改。与此同时,开发人员查看网站交互设计时也需要通过一定的工具。因此,一款快速、方便的视觉稿设计工具就显得尤为重要,通过这些工具,设计师可以真实地看到网站呈现的效果,并...
对于竹荪我想可能有些人是比较熟悉的,还有些人是不太了解的。没关系,下面我就来告诉大家关于干竹荪的相关知识吧。竹荪是一种菌类,竹荪的营养价值极高,竹荪中含有大量的碳水化合物,还有一定的蛋白质、脂肪等等营养物质。具有一定的食用价值,尤其是对于一些高血压患者,竹荪对于治疗高血压等等病症是有一定的效果的。 竹荪的使用方...

经验教程

911

收藏

25
微博分享 QQ分享 QQ空间 手机页面 收藏网站 回到头部