注册 登录  
 加关注
   显示下一条  |  关闭
温馨提示!由于新浪微博认证机制调整,您的新浪微博帐号绑定已过期,请重新绑定!立即重新绑定新浪微博》  |  关闭

{800Bu}

——Well, Here We Are...

 
 
 
 
 

日志

 
 

虽然Path再美也没戏,为什么APP们还要有动画效果?(转载)  

2013-03-28 11:09:34|  分类: 设计 创意 |  标签: |举报 |字号 订阅

  下载LOFTER 我的照片书  |
原文转载自虎嗅网

虽然Path再美也没戏,为什么APP们还要有动画效果?(转载) - 800bu - {800Bu}
在上一篇关于Path的文章最后我问了一个问题,“iPhone的成功真的是因为美得让人飙泪的图标和华丽炫目的动画吗”,今天先聊聊动画。

苹果在Mac上尝试动画的时候,微软和谷歌接近文盲,改变世界对于动画理解的仍然是iPhone。

最初做App的时候,我压根没考虑过动画,直到有一天,在运行宋提交的新版本时,突然发现一个界面的切换用了动画。

我问:“宋,你加动画了啊?这样的确平滑多了”。

宋答:“看了Pinterest,发现所有的界面切换都有动画,很舒服,我决定以后每改到一个界面就顺手把动画加上”。

这是我第一次试图从使用者的角度感受动画。再后来,做的多了,反思的也多了,忍不住问自己一个问题:“为什么要有动画?”

回答这个问题前,让我们先思考一个场景:

每天出门、回家,您都要做两件事:开门、关门。好了,麻烦您走到门口,打开门,再把门关上。现在让我们从这个过程中去掉一点点东西,去掉动画。假设门只有两种状态,关闭着的门和打开着的门(就像是二进制里的0和1),麻烦您再去门口试试。很别扭,是不是?

没错,的确很别扭,生活中的一切都有动画,心理学上有一个词叫“知觉恒常性”,我们的认知习惯了这个动画的世界,去掉动画,我们将无所适从最终想明白这个事儿的还是苹果,指望谷歌的工程师和微软的官僚的确有点儿难,不信你在Win7上打开、关闭下窗口、或者在Gmail里写封邮件试试。

如果只是为了聊一下开门、关门,我这篇文章毫无营养。iPhone之后,通过各色山寨(创新)者们的努力,我们进入了一个动画甚至超动画的时代,手机上各种华丽、炫目的动画充斥着我们的眼球。

我仍然还是那个问题“为什么要有动画?”。

记住“我们可能会因为很多原因给App加上动画,但这些原因里一定不包括华丽和炫目”。华丽和炫目的动画就相当于是您开门的时候,门开启的过程没了,换成一个礼花弹在您眼前绽放,除了危险和搞笑外没任何好处。

App需要动画大概有这么几个理由:

1、动画一定要有用。我们可能会为了界面切换的平滑而设计动画,为了让用户更容易理解删除操作而设计动画,但一定不要为了动画而动画。举几个反例:

例:Android 2.1的那个动态桌面的新特性,除了费电和看的时间长了晃眼睛外,没什么好处?什么?您喜欢手触屏幕水波荡漾的感觉?装个捕鱼达人玩儿水去吧,就别跟桌面较劲了。

例:Galaxy Note里的图库,图库是兵家必争之地,读图时代嘛!可能是受到了iPad的刺激,图库上的各色创意层出不穷,动画特效的滥用几乎到了东施们排着队效颦的程度,图库里尤其奇葩的是三星,界面切换时候的大黑屏没想着用动画平滑过渡,反倒是来回滑动的时候图片们那盖世的抖动和跳跃,选个图都费死劲了。

2、动画是为了让用户体验更平滑。平滑很难有个准确的定义,一般来讲,经常使用一个软件如果觉得眼睛疲劳就有可能是因为不平滑动画的滥用了。大体上,平滑的动画要做到以下几点:

A、不卡。相比起iOS,Android上做到不卡的确要费点儿劲,不少应用连Splash动画都是卡的。这主要是因为谷歌自己都没想明白动画到底有啥用,JellyBean开始终于考虑基于硬件的动画了(这其实就是谷歌吹嘘了半天的Android 4.1性能大幅提升),SDK弄的又烂,App开发仍然有很多难度,不信您试试号称顶配的Nexus 10,基本上所有App的动画在上面都杯具,只能靠开发者们自己纠结着解决了。

B、不跳跃。先用iPhone再用Note,您就知道啥叫跳跃了,三星是田径队出身?

C、不闪。在闪这个字儿上,Google+ Android版是个极品,滚动的时候居然用动画来加载图片,闪的眼睛真心难受啊,还好俺只是试试,压根没打算真用。

在平滑的动画方面,iOS默认的就很舒服了,Pinterest Android版做的也很不错。

3、动画是为了让用户使用的时候更自然。自然的动画指的是动画要尽量与人在现实生活中的感知一致,越一致,人的思维开销就越小,也就越舒服。简单的说就好比是开门的时候您可千万别给个关门的动画。

例:不知道从什么时候开始,App们流行起Tab切换动画,当前选中的Tab上给您盖块“破布”,当您选择另一个Tab的时候,那块布就会滑过来,滑远点儿经常还丢帧。我愣是没搞明白这到底要表达什么?就像是您开门的时候,隔壁家的门帘子飞过来盖在您家门上。代表应用:蘑菇街、360手机助手。

例:Windows Phone上基本上没有一个动画是自然的,随便举一个打开应用的例子吧,点击桌面上某个应用的图标(专业术语是磁贴?),桌面上其它磁贴都会翻牌子飞走,然后此应用的磁贴会放大成应用界面,魔术般神奇。就像是您开门的时候,您家门没打开,楼道里其他家的门全开了。

在自然的动画方面,还是苹果所做的努力最多,比如说动画一定是非匀速直线运动,再比如那个让人头疼的橡皮筋专利。

4、某些精心设计的动画还能表达一些含义,有效降低用户的学习和使用软件的成本

例:Mac上最小化和关闭窗口的动画,能让您一下子就能明白点哪里可以再次打开这个窗口。作为码农,俺第一眼看到这个动画时就觉得费劲,要记住原来的位置,还要逐渐变小,变小还得是平滑的,这程序是tmd人写的吗?要说唯一让我感觉有点儿别扭的是,可能因为动画太平滑了,总给我西游记里的大神们拿着葫芦收妖怪的感觉。

例:iPhone图库里选择图片发送邮件,通过一个动画就做到了让用户无需理解邮件附件这个概念,实在是经典。

写了这么多,总结一下。“为什么要有动画?”,我的答案是,不要为了动画而动画,使用动画是为了与人现实生活中的认知相一致,动画要平滑、自然、有用。

好的动画应该是每个产品人追求的目标,很多人看iPhone 4s的时候关注的是Siri,iPhone 5的时候关注的是地图和Passport,俺看到的却是苹果对于极致体验的追求。不信?您可以找两台iOS 5和iOS 6的设备对比着看看,动画又有进步哦!

博文地址,作者微博:@i问号
  评论这张
 
阅读(131)| 评论(0)
推荐 转载

历史上的今天

在LOFTER的更多文章

评论

<#--最新日志,群博日志--> <#--推荐日志--> <#--引用记录--> <#--博主推荐--> <#--随机阅读--> <#--首页推荐--> <#--历史上的今天--> <#--被推荐日志--> <#--上一篇,下一篇--> <#-- 热度 --> <#-- 网易新闻广告 --> <#--右边模块结构--> <#--评论模块结构--> <#--引用模块结构--> <#--博主发起的投票-->
 
 
 
 
 
 
 
 
 
 
 
 
 
 

页脚

网易公司版权所有 ©1997-2017