动画的两种类型:移动界面上的功能动画和情感动画

动画是整个过程的完全独立的部分,必须在评估整个项目时立即予以确认。


动画是整个过程的完全独立的部分,必须在评估整个项目时立即予以确认。

动画的两种类型:移动界面上的功能动画和情感动画

首先,我们谈论动画在实际应用中的努力和需求。创建动画设计显然比将其变成现实容易得多,编程动画可以严格延长应用程序开发的时间。这就是为什么大多数动画被困在概念阶段,并在设计师的组合中停滞不前。

我们将界面动画分为两种类型:

  • 功能性UX动画
  • 情感性UI动画

功能性UX动画提升应用程序的响应能力

这些动画无疑提高了可用性,有意义地促成了一些具体操作。通常,它们不需要比用户的特定动作序列更多的时间。例如,刷新的拖动,指标的加载,按钮操作或滑动…

动画的两种类型:移动界面上的功能动画和情感动画

Ramotion

动画的两种类型:移动界面上的功能动画和情感动画

Sergii Ganushchak

独特的下拉列表的内容更新。一旦收到数据,动画就会结束。这些例子弥合了功能与情感动画之间的差距,但开发这种下拉列表并不像看起来那么容易。

动画的两种类型:移动界面上的功能动画和情感动画

Stan Yakusevich

在这里,我们看到一个滚动条,当你移动它时会改变颜色。它是一个功能元素,因为它提供了对折扣“温度”变化的触觉和“热”感觉。热或冷。就其所需的努力而言,编程实现是一个非常难的效果。

动画的两种类型:移动界面上的功能动画和情感动画

Aurélien Salomon

在屏幕间平滑转换的水平滑动的不同例子。如果这个动画没有比交互和用手指控制更长久,那么它是功能性动画的一个很好的例子。具有平滑转换功能的界面产生一流的印象,也不仅仅是因为它们很少见。

动画的两种类型:移动界面上的功能动画和情感动画

Lukas Horak

这是一个减缓用户操作的复杂动画的例子。卡片的额外震颤拖延了我们几秒钟,这是不必要的。震颤效果需要6-8小时的开发时间。

总的来说,在规划时间表和预算时,必须考虑账户中的功能动画。不言而喻,界面必须具有动态性和响应性,因为这样可以增强交互性。即使你只是设计它,也请记住动画需求的额外时间和精力是关键。这确保你的作品集只包含由第三方开发商开发的仅完全实现的项目,这是你的设计的基础组成部分。

情感UI动画是界面的装饰

大多数时候,这些动画只有令他们惊叹的因素,其吸引力的目的是促进应用。只有通过设计师想象力的限制,改进的UX被放在后面,因为这些动画是非常复杂且经过精心的设计。以下是几个例子:

动画的两种类型:移动界面上的功能动画和情感动画

https://dribbble.com/shots/1936758-GIF-of-the-Tap-Bar-Concept

动画的两种类型:移动界面上的功能动画和情感动画

https://dribbble.com/shots/3208361-Plus-expanded

动画的两种类型:移动界面上的功能动画和情感动画

https://dribbble.com/shots/2232385-Pull-Down-to-Refresh

动画的两种类型:移动界面上的功能动画和情感动画

https://dribbble.com/shots/1692646-Splash-screen-animation

动画的两种类型:移动界面上的功能动画和情感动画

https://dribbble.com/shots/1701001-GIF-Exercise

动画的两种类型:移动界面上的功能动画和情感动画

https://dribbble.com/shots/3247394-Delivery-app-design

大多数设计师在他们的作品集中都有这样一些东西,但它仅保持在想法阶段。在开发方面,承包商和客户都明白这不是一个重要的事情,而是不能没有它。毕竟这些动画需要很大的努力的,且直接反映了开发的预算和日常安排。

谁负责嵌入这些动画呢?

市场上的公司永远不会为了生存而奋斗。他们修改最受欢迎的产品。因为他们在很久以前就开始炒作他们的产品,并解决了大量的UX问题,他们有机会为情感动画投入更多的时间,金钱和努力。很好的例子是:Twitter、Uber、Airbnb、Things 3等。

对于如何推进营销策略有明确的削减计划的启动。他们瞄准一个奖项,如Apple Design Awards,Tappawards,The Webby Awards,Global Mobile Awards,Driven x Design Awards等。所以这可能是一个竞争优势,但将动画变成优势并不是那么简单。这些应用程序的一些很好的例子:

动画的两种类型:移动界面上的功能动画和情感动画

Clear Path Robinhood City Guides

其他人因为各种原因也做这个,如:

  • 每个人都在做。

对于设计师和客户来说,它很有趣且令人印象深刻。没有线索,如何影响应用程序的可升级性?

这是客户想要的,因为它很酷。

它来自发展阶段可能出现的缺乏经验和无知的挑战。

缺乏营销策略,客户端不明白动画是什么,或者如何帮助产品改变。

最后的结果

在从想法到现实的应用程序的开发过程中,有必要清楚地确定每一步的方法。动画是整个过程的完全独立的部分,必须在评估整个项目时立即予以确认。毕竟动画占整个开发过程的100%。

功能动画具有明确的目的,在准备时间表和预算时要考虑到这一点。首先,它们提高了可用性。这些动画的复杂实现完全取决于创作者。

情感动画并不是最重要,因此最好考虑你或客户希望将其嵌入到应用中的情况。大多数情况下,情感动画是不值得付出努力,投资现金促进产品是更有效,这是容易被忽视的,设想一个好想法将会“提升自己”。

 

原文地址:https://blog.prototypr.io/functionality-vs-emotions-in-mobile-interface-animation-9bce59129ac7

原文作者:Cuberto

译者:SKYUI

本文由 @SKYUI 翻译发布于人人都是产品经理。未经许可,禁止转载

原创文章,作者:Catherine,如若转载,请注明出处:https://www.iamue.com/20715/

(0)
CatherineCatherine
上一篇 2017-08-04 08:34
下一篇 2017-08-04 09:24

相关推荐

  • Axure RP 8 入门手册 – 第7章

    第7章母版管理第1节母版简介第2节添加/编辑/删除第3节添加母版到页面中第4节从页面中移除母版第5节拖放行为第6节自定义触发事件第7章母版管理第1节母版简介圆儿:小楼欧巴!小楼:圆圆好!圆儿:老师,我就一个圆!小楼:可是我喜欢两个圆啊!圆儿:老师…你正经一点儿好不好嘛!小楼:呃……你想问什么?圆儿:我想问,在做很多个页面的时候,如果每个页面中都有相同的内容,有没有办法不用每个页面都做一次?当然,我知道能够复制粘贴,但是,如果将来再发生改...

    2018-04-25
  • 菲茨定律与未来交互方式

    未来已来,随着科技的不断发展,交互的方式也发生巨大的变化,它正一步步颠覆着我们的生活习惯。

    2017-04-27
  • 从用户体验到品牌形象,营销的道路有多远?

    在数字化时代,如何提升品牌形象和用户体验,是两个营销的核心问题,品牌形象塑造消费感知,用户体验决定消费忠诚。企业重要的战略资源之一是:优质化的内容。而真正做内容营销的门槛极高,唯有真正强大的IP内容,才具有引爆市场与号召市场的能力。什么是营销IP,即知识产权(Intellectual Property),大IP,本身是产业链也延伸,具有黑洞版的吸金能力,是从招牌、内容、产业链等的延伸式营销。举个目前比较火热的例子,电影《魔兽》,根据网络...

    2018-02-02
  • UI风水学:你该知道的9个UI设计门道

    好风水称之“顺”,其中一元叫气,精气/气场在于风水之中:“气遇风则走,遇水则停。”讲究个气顺心畅;
    好交互称之“理”,其中一元叫情,情感/情怀在于场景之中:“情遇杂则乱,遇简则通。”讲究个通情达理。好风水称之“顺”,其中一元叫气,精气/气场在于风水之中:“气遇风则走,遇水则停。”讲究个气顺心畅;
    好交互称之“理”,其中一元叫情,情感/情怀在于场景之中:“情遇杂则乱,遇简则通。”讲究个通情达理。

    2017-05-12
  • 全面解读!人工智能如何改善五大用户体验?

    点击【阅读原文】,即将IPO独角兽,抓住上市前最后的机会!最近两年人工智能技术在金融、安全、交通、医疗、公共服务和制造业等领域逐渐落地,随着技术的成熟,人工智能将会在更多领域影响人类的生活。以人为本的人工智能设计会变得更加重要,本文会从安全性、效率、易用性、场景化、个性化五个方面阐述人工智能如何改善现有的产品和用户体验,这五个方面存在着各种联系并相互影响。安全性越接近系统底层的技术越影响用户体验,例如手机中毒或者信息被盗都会对用户产生巨...

    2018-05-05
  • 功能确定之后,如何做好产品的交互设计?

    功能和数据都确定下之后,接下来我们就要把功能数据给设计出来,也就是决定它们长啥样,怎么操作的。如果说前面的分析研究、需求定义、功能数据确定是“做正确的事”,现在开始我们就要“正确地做事”,方向抓准了,我…

    2017-08-03
  • 内部教程|6步透视网易设计规范(附规范PDF下载)

    LOFTER这份精而美的设计规范,页数不多,但每页都是经过三思后得出的总结,推荐一看。

    2017-05-20
  • 乐观派UI:真实的谎言

    我真诚地希望,这篇文章能帮助你理解乐观派UI设计背后的核心观念。乐观主义,形容词,对于未来充满希望和信心。

    2017-05-15
  • 十张图看懂交互设计原则

    一致性保持视觉统一性,才能加深用户对产品品牌的认知,降低用户的学习成本可视性用户一看便知的操作方法认知不一味只求美感或者感觉,而是从一般人的认知习惯,比如视觉,阅读,记忆,学习等多方面开展设计反馈用户需要接收到操作结果的完整、持续的反馈信息自然操作流程顺畅不生硬,节点、逻辑跳转符合人类的思维习惯情感化与人文关怀赋予设计的产品生命力和亲和力,不要把产品当成一个冷冰冰的使用工具错误控制考虑可能出现的人为差错,在设计的时候先行避免效率简化任务...

    2018-04-12
  • 中国app产品UI在歪果仁眼里是怎么样子的?-Dan Grover

    小木导读:中美用户习惯的和文化的不同,造成了设计很多的不同。看惯了国内的设计,你了解外国人怎么看待我们的产品吗?接下来就可以带着疑问往下阅读。

    2014-12-30