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

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


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

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

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

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

  • 功能性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

相关推荐

  • 一个用户体验设计师的转化率优化准则

    优化,作为一种服务,正变的无处不在。那么,对于通讯公司和专业的优化公司来说这两者有什么区别呢?我见过很多个人和机构在做转化率优化的时候忽视了去思考‘为什么’这个部分。说服用户的方式必须是道德的,因为我们不想破坏整体用户体验、客户的声誉和他们的品牌。从本质上讲,设计一个高转化的网站是我们的工作,并且这也是我们要去推动的边界。 一个漂亮的网站可能在短期内取悦客户,但是,如果网站不赚钱,那幸福会很短暂。

    2017-05-19
  • 交互设计师的60日计划之第八天

    今天仍然在处理上周五的需求。参与讨论的人越多,战线就拖得越长。不过讨论虽然效率低,却能出现各种各样的想法和方案,不靠谱的,靠谱的。 2015/08/04 与老大谈话所得题目起的有点大,不过这是今天老大和我讲的主…

    交互专题 2015-08-20
  • 张茂泽:论黄帝陵的文化内涵 | 黄帝陵国家文化公园规划设计大师工作营

    📌 编辑 | 璇仔编者按:由陕西文化产业投资控股(集团)有限公司、陕西省黄帝陵文化园区管理委员会、黄陵县人民政府和CBC建筑中心共同发起的“黄帝陵国家文化公园规划设计大师工作营”,邀请了中国具有代表性的六位规划大师及其领衔的团队作为核心设计团队,通过共同驻地,对黄帝陵国家文化公园进行实地调研、研讨,分别提出未来黄帝陵国家文化公园的规划设计理念及方案。3月9日,西北大学中国思想文化研究所教授张茂泽作为探班大师来到工作营现场,以《论黄帝陵的...

    2018-03-17
  • 我们深挖的那些设计小惊喜 【UXRen译#151】

    作者: Cosima Mielke |  翻译:Sherry ,校审:佳歧 & Teenie     CodePen网站已成为开发者的游乐场。那是一个你可以驰骋想象、开发创造的沙盘。里面既有实践的东西,也有实验性的概念——是个激发灵感的宝库。…

    交互专题 2017-08-07
  • AXURE免费元件库分享-web

    分享个WEB端axure元件库下面是元件库地址:https://pan.baidu.com/s/1pLXHuf5

    2018-03-05
  • 2018用户体验设计趋势,你知道吗?

    设计师总再盼望未来 - 在整个工作流中我们重复相同的事情。最后,困扰设计师往往是围绕着一个简单的问题:我们如何才能提高用户的体验?为了解决这个题,Figma采访了18位设计师,让他们来来预测2018用户体验设计趋势。1.可用性第一,个性化第二“我真的希望2018年设计师们将可用性设计铭记在心。我们不要在基本元素上使用超浅灰色,我们做得每一个像素动画不应该只是因为它看起来不错,我们不应该让用户难以理解内容,因为我们是设计师。”2.设计师要...

    2018-01-31
  • 交互设计师的60日计划之第九天

    今天参与了用户访谈,啊不,是旁听了用户访谈,躲在小黑屋里观察用户的表情动作,听他的描述,挺有趣。 20150805 用户和我们预想的完全不同前两天有讲过准备了访谈前的一些问题和任务提供给用研同学,今天真的见到…

    交互专题 2015-08-20
  • 交互总结篇(一):框架与布局

    上篇文章里面简单介绍了一下关于交互设计分析的三维度,即框架、流程和状态;这里就不做特殊介绍了,详细内容请见《三个维度,解析产品的交互设计》。而本文作为交互设计总结篇的第一篇——框架布局篇,主要是系统地整理一下交互框架设计所需要考虑到的方方面面。框架是整个或部分系统的可重用设计,表现为一组抽象构件及构件实例间交互的方法。

    2017-04-28
  • 新项目丨青岛东海凤凰:宽建筑[UCD]挑战中国第一仿生建筑

    *文章已由原作者授权发布▲凤凰中心效果图作者:王宽方案设计方:宽建筑 [北京城建] KUAN architects [UCD]项目名称:青岛市西海岸新区文化活动中心地址:中国,青岛,金沙滩设计团队:王宽,周媛,李鹏,梁文杰等结构咨询:中冶京诚工程技术有限公司  卢理杰数字模型&BIM咨询:北京华茂云信息科技有限责任公司施工方:北京城建集团(建筑部)、北京城建集团十六公司、城建精工钢构公司面积:31,313平方米状态:主体结构已封顶预计建...

    2018-03-13
  • 看世界之Google对话式交互设计规范

    目录序言1.对话式用户界面及其重要性2.建立友好用户界面的关键-理解对话如何进行设计实践3.设计原则与方法论4.设计走查5.设计检查表6.用户界面工具包最佳实践7.像你的用户一样...有合作精神(待翻译)8.解锁口语的力量(待翻译)9.通过确认逐渐给用户信心(待翻译)10.对话中是没有错误的(待翻译)1.对话式用户界面及其重要性我们已经进入全新并且充满希望的计算机时代,机器学习和人工智能的进步使得对话式界面和自然语言处理得以兴起,通过技...

    2018-02-24