DO OR DO NOT?如何从3个方面判断是否做交互动画

编者按:IOS 7出来后,交互动画立刻成为设计师的抢手货,有关动效设计的教程都趁势火了一把,但是很少有人讨论到底该不该做交互动画,如果做,为什么?今天终于有同学分享了他的观点,一旦符合文中提到的3个方面,那死心塌地动手吧!

@王笑Nothing :作为设计师,相比以前死板的体验,我们越来越看重APP的交互性。这种心态的转变很大程度上可以归因于IOS 7的大换脸。IOS 7过度动画强调物理变化。从这以后,我们可以看到有很多热门APP上都有非常出色的动效。

令人激动的动效很容易让人着迷,从而让用户忘记机会成本的衡量。另一方面,花费额外的时间,在恰当的时机,使用恰当的动效,可以增加易用性,还可以帮助树立品牌个性,为用户带来愉悦的体验。在这篇文章中,我会告诉你费尽心思给产品添加交互性强的动效对于提升品牌价值是否有意义。

先不谈意义,光看这些动效的奢华程度就心痒痒啊!《最近这个超火!23个FACEBOOK PAPER中的设计细节》
DO OR DO NOT?如何从3个方面判断是否做交互动画

可用性

有些APP把交互动效作为工作的核心部分。在下面的实例中,我们可以看到动效可以让人纵览全局,轻松的找到当前在APP中所处的位置。

Pinterest(图钉)

Pinterest是我最喜欢的APP之一,它可以通过手势滑动在列表和详细内容之间自如切换,这比传统笨笨的切换方式好太多。

DO OR DO NOT?如何从3个方面判断是否做交互动画

下划返回

DO OR DO NOT?如何从3个方面判断是否做交互动画

左划查看下一张

DO OR DO NOT?如何从3个方面判断是否做交互动画

上划加载新内容

Circa App(Circa 新闻)

这是另一个使用动效来联系上下文的好例子,Circa 把一篇长文章分为很多小段,在右侧可以看到每个圆点代表一段,上下滑动查看每段的内容。

DO OR DO NOT?如何从3个方面判断是否做交互动画

在上面两个例子中,动画不但没有成为浪费时间的累赘,而是真真切切的提升了APP的可用性。

个性

很多APP把交互作为传达品牌个性和内涵的重要途径。在下面的例子中,独特的交互动效已经成为了APP的标志。你的APP动效是滑稽的还是严肃的?是机械的还是柔和的?为你的APP选择恰当的交互和动效会把品牌深深印在用户脑中。

Path & Tumblr

移动终端是Path的唯一平台,在单一平台下创建统一的交互体验是Path的优势。可以看到Path独特的交互理念深入人心,给人亲和、有趣的印象。

DO OR DO NOT?如何从3个方面判断是否做交互动画

Tumblr安卓版也在试图给用户创建类似的体验。

DO OR DO NOT?如何从3个方面判断是否做交互动画

Tweetbot

Tweetbot是通过创造独特交互体验让用户记住它们品牌的又一个例子。与Path和Tumblr相比,它给人一种机械的,反馈有力的感觉。

Tweetbot的交互动效就像一个具有鲜明特点的机器人一样生动。

DO OR DO NOT?如何从3个方面判断是否做交互动画

喜悦

你会发现很多APP的动画来自于UI的变化,这是因为它们设计的文字很少或者不适合做动画。然而,花费大量时间精力去制作吸引眼球的动画代价很大。也正因如此,我们很少看到资金短缺的公司在动画上大做文章。总的来说,做UI变化的动画是为了做动画而做动画,不一定是为了达成某个目的。

Flickr

当你浏览Flickr的引导页也许不会发现什么特别之处,但是当你慢慢滑动屏幕就会发现很美妙的3D动画,利用视差滚动和元素屏蔽就可以达到如下的效果。

DO OR DO NOT?如何从3个方面判断是否做交互动画

就算APP的动画做的异常精良美妙,从商业角度看却没有太大意义,尤其是在资源有限的公司。Flickr就是在获得大量融资之后才去投入人力和财力后,才去考虑交互的细节。

结论

选择投入的金钱还是提高用户体验,会决定你的APP未来能否获得成功。所以你要慎重考虑,为什么要制作动画,投入的花费究竟值不值得。你可以通过评价以上三点:可用性、个性、喜悦来做决定。如果你做的动画连一点都没有达到,那么这肯定是不值得的。

动效设计好文合集!

教你快速保存动效!
《经验分享:如何快速保存APP动效?》

手把手教你设计动态界面!
《PS高手教程!教你打造流畅酷炫的动态演示》

腾讯出品的动效设计指南!
《超赞!高大上的动效设计方法及流程总结》

原文地址:Uxmag
译文地址:wangder
译者:@王笑Nothing

优设uisdc.com“是国内人气最高的网页设计师学习平台,专注分享网页设计、无线端设计以及PS教程。
【特色推荐】
设计师需要读的100本书:史上最全的设计师图书导航:http://hao.uisdc.com/book/
设计微博:拥有粉丝量78万的人气微博@优秀网页设计 ,欢迎关注获取网页设计资源、下载顶尖设计素材。
设计导航:全球顶尖设计网站推荐,设计师必备导航:http://hao.uisdc.com
———————————————————–
想在手机上、被窝里获取设计教程、经验分享和各种意想不到的”福利”吗?
添加 优秀网页设计 微信号:【youshege】优设哥的全拼
您也可以通过扫描下方二维码快速添加:

DO OR DO NOT?如何从3个方面判断是否做交互动画

点赞
收藏 3
继续阅读相关文章

发表评论 快来秀出你的观点

还可以输入 800 个字
 
 
载入中....
评论 收藏