双11干货!写给运营视觉设计师的交互小技巧

58UXD – 马世光:双十一就要来了,本文为你分享两套运营设计利器。运营视觉设计师不同于UI和交互设计师,运营视觉设计师的工作要求他们更加注重视觉丰富性的表现,难免会淡化交互逻辑层面的思考,优秀的体验需要视觉与交互兼顾,今天我就为运营视觉同胞get两点交互小技巧,方便我们的产出既能视觉爆炸也能体验棒棒!

双11干货!写给运营视觉设计师的交互小技巧

58UXD – 马世光:双十一就要来了,本文为你分享两套运营设计利器。

运营视觉设计师不同于UI和交互设计师,运营视觉设计师的工作要求他们更加注重视觉丰富性的表现,难免会淡化交互逻辑层面的思考,优秀的体验需要视觉与交互兼顾,今天我就为运营视觉同胞get两点交互小技巧,方便我们的产出既能视觉爆炸也能体验棒棒!

触发器

触发器,顾名思义就是任何能够启动交互的东西,通常分为两类:手动触发器和系统触发器。视觉设计主要打交道的就是手动触发器。

双11干货!写给运营视觉设计师的交互小技巧

△  58icon就是一个触发器

那么运营视觉的同学就会说,手动触发器不就是按钮么。没错!但是小按钮也会有大学问,按钮做不好,用户体验自然就上不来。

做好一个按钮,首先,尽可能给用户最少的选项,如果它看起来像一个按钮、就应该像一个按钮一样能被按下,不要破坏视觉的使用情境。

双11干货!写给运营视觉设计师的交互小技巧

画面中首屏除了头图展示外,把专题中重要的两个入口也放在首屏,结合中秋风格来进行设计,即可吸引点击,又不会破坏使用情境。

其次,我们的按钮要设计多吸引眼球呢?最简单的原则就是用的越多(越重要)的按钮就要越引人注目。

双11干货!写给运营视觉设计师的交互小技巧

专题中紧接头图的三个区域占整个专题入口流量的70%,天猫采用大数据推送的方式为用户推送最感兴趣的商品,将「引人瞩目」的形式从视觉表现层面上升为心理需求层面。

我有必要解释一下引人注目的按钮应该是个什么样子:

我们在主动寻找时,会盯住某个东西或区域,希望能从中找到满足自己需要的内容。这时我们的视野会变窄,达到1度或者只有平时视野的1%,这么窄的视野堪比聚光灯和放大镜。此时,我们专注于辨别物体,即对环境中的物体进行识别和归类。我们在辨别物体时,眼睛会寻找熟悉的小几何,就是正方形,三角形,立方体,圆柱体等简单的几何形体,我们的大脑把他们组合起来就能辨别出物体。

既然人眼以小几何体为基本识别单位,那么一些图标形触发器就特别适合设计成某种几何形状。一般来说,只具备一种特征的目标比具备多种特征的目标更容易被找到。因此,要尽量保证触发器看起来简单,尤其是在复杂拥挤的环境下。

双11干货!写给运营视觉设计师的交互小技巧

当这组内容足够丰富时,只要我们采用简单小几何体形式,大脑便会很容易的发现右下角的按钮。

当然我们还有更加吸引人的按钮,比如,移动的按钮。

双11干货!写给运营视觉设计师的交互小技巧

购买按钮虽然没有采用动态形式,但是上面的小小气泡框却十足的吸引了我们的眼球,人类对运动物体要敏感的多。

按钮除了控件部分,标签(文案)也是提升按钮点击的一个关键要素,相信我,如果自己看着按钮里面的文案不爽(不吸引人),自己来条推动产品去优化吧!

双11干货!写给运营视觉设计师的交互小技巧

旧版本中按钮的文案是电话号码,吸引点击的作用并不强,在更换了标签文案后按钮点击率上升了20%

反馈

反馈,简单说就是告诉用户在按下按钮之后会出现什么结果,视觉设计师的工作是设计反馈的形式,当然,反馈除了视觉还有听觉以及触觉的反馈。

当我开始设计一个反馈页面的时候,我们应该注意什么呢,好的反馈又是什么呢?

首先,别让反馈给用户造成压力,反馈应由需求来推动。用户需要知道什么,什么时候知道,做好这些用户体验就自然上升一个台阶

双11干货!写给运营视觉设计师的交互小技巧

△  微信输入语音时,出现浮层动画提示用户的语音输入是有效的

其次,我们应该使用最少的反馈来传达最多的信息,最好的反馈永远不会高深莫测,永远记住少即是多。

双11干货!写给运营视觉设计师的交互小技巧

当用户操作后,界面操作前的状态和操作后的状态不一致。通过这个不一致,给用户反馈的操作得到了提交。

当我们在做视觉反馈的时候,不要显示多余的视觉反馈、任何反馈都必须力求清晰,视觉反馈应出现在用户操作的附近或原地。

当然,如果必须把视觉反馈放在远离视觉焦点的地方,我们可以通过动效来吸引用户的吸引力。

其实我们发现一个App的性格多是通过反馈来体现的,我们可以通过人性化的设计来增加App的情感。

双11干货!写给运营视觉设计师的交互小技巧

△  58帮帮的形象很好的增强了App的人性化和情感

总结

相信视觉设计师已经对触发器和反馈的基本原理有所了解,在实践工作中要活学活用。以上是我get到的针对视觉的小技巧,希望对大家有所启发帮助,谢谢。

欢迎关注58UXD 的公众号:

双11干货!写给运营视觉设计师的交互小技巧

「让你的设计更温暖」

【优设网 原创文章 投稿邮箱:yuan@uisdc.com】

================明星栏目推荐================

优优教程网 UiiiUiii.com 是优设旗下优质中文教程网站,分享了大量PS、AE、AI、C4D等中文教程,为零基础设计爱好者也准备了贴心的知识树专栏。开启免费自学新篇章,按照我们的专栏一步步学习,一定可以迅速上手并制作出酷炫的视觉效果。

设计导航:国内人气最高的设计网址导航,设计师必备:http://hao.uisdc.com

原创文章,作者:震天下,如若转载,请注明出处:https://www.iamue.com/34414/

(0)
震天下震天下
上一篇 2017-10-31
下一篇 2017-11-01

相关推荐

  • 动起来才好玩——创意交互设计景观

    设计是靠亮点征服人,吸引眼球,大部分方案构思雷同,建成后风格水平都差不多,如何让场地更加吸引人而脱颖而出,这就需要在新、奇上下功夫。电子梦幻天幕世贸天阶最著名的“全北京向上看”的“超豪华LED天幕”,这座天幕将为整条商业街带来富于梦幻色彩和时尚品位的声光组合,成为一座吸引人潮的世界级奇观。建成之后,人们在这里可以欣赏缤纷悦目的日夜景观,感受现代科技带来的富于梦幻色彩和时尚品位的声光艺术。而且游客可以把想说的话发送短信到平台号码,天幕上就...

    2018-02-03
  • 淘宝UED:如何高效输出移动APP产品原型

    如何高效输出移动app产品原型? 清晰的产品思路,顺畅的协同合作,齐备的素材元素,真实的体验感受…保证过程的高效,更要保证有效的成果。下面我们将分三步走,来完成高效输出移动app产品原型。 一、输出以界面为单…

    2015-07-10
  • 减少认知过载:塑造更好的用户体验

    设计不是美工,想成为优秀的设计师怎么能不懂点心理学?文章从认知心理学角度下手,分析了在交互设计过程中时常会犯得几种错误,一些平时稀松见惯的设计方式也都在这儿找到了比较理性的依据。设计是门科学,我们需要掌握一些方法论,以不变应万变。

    2017-05-11
  • 为产品赋予人格 - 情感化设计的组成要素及实践案例

    Flickr为用户准备了很多有意思的登录欢迎语,这其实是一个容易被忽略的细节,但Flickr的整体设计风格与产品气质也正是由许许多多这样的细节构成的。也许,只有当这些细节从产品中消失的时候,我们才会发现并开始怀…

    2015-11-01
  • 观点解读|四两拨千斤的交互设计方法

    最近读了一本书,叫做《细节,如何轻松影响他人》,里面给出了52条意见,每一条意见都是经过大量实验得出来的,有一定的科学依据,而且这些意见也反应了人们的普遍心理,强力推荐销售人员看看。这本书的主旨就是:只需改变一点点,就可以达到四两拨千斤的显著效果。虽然有52条之多,但是我会抽取一些和交互关系比较大的观点进行解读。

    2017-05-02
  • 网易游戏交互设计师分享:游戏交互设计做什么及学习的关键性方法

    嘉宾介绍 陈振华,网易游戏做交互设计师 分享主题 游戏交互该如何做,新人该如何入门 交互设计是什么 首先我们来理解下,我们平时认为的交互是什么? ONE. 用户研究,调研 TWO. 功能分析,了解一下我们这个产品,也…

    2015-12-05
  • 我花了五个小时,完成了iOS 11新版App Store的交互探索

    WWDC 2017 上发布了全新的 iOS 11 ,系统本身在设计上就有了诸多变化和更新:信息更扁平的控制中心、WP 风格的大标题、截图编辑功能、相机直扫二维码等等。不过,作为一名电商设计师和 App 爱好者,此次更新最让我感兴趣的莫过于 App Store 的“改头换面”了。

    2017-06-12
  • 客户体验,体验的是什么?

    近年来,“客户体验”成了一个很常用的词,但就像“创新”和“设计”一样,你实际上很难给它找到一个众所公认的明确定义,尽管许多企业都将改进客户体验视为一项差异化的竞争优势。可是,如果我们连某种东西的定义都说不清楚,又如何谈得上对其加以改进呢?

    2017-05-29
  • 以文本框为例,了解交互设计师在工作中的逻辑思考方法

    文本框是设计工作中常见的组件之一,无论是PC还是无线,大多仅是样式上的不同,它们的交互行为上是可以相互参照的。本文想从这一简单的组件出发,让大家看到交互设计师在工作中的逻辑思考方法,从而达到见微知著的直观感受。

    2017-05-17
  • 【干货】用户体验是个什么鬼。

    接上篇文章,我们既然已经了解到了用户需求,且已经为用户需求设计了功能去解决了他们的问题。然而问题又来了,用户依然在用我的竞品,而不用我的产品,这是为什么?

    2017-06-04